NativeScript
diff --git a/apps/sample-fonts/main-page.ts b/apps/sample-fonts/main-page.ts
@@ -1,62 +1,178 @@
 import { View } from "ui/core/view";
-import { EventData } from "data/observable";
-import { LayoutBase } from "ui/layouts/layout-base";
+import { Page, NavigatedData } from "ui/page";
+import { StackLayout } from "ui/layouts/stack-layout";
+import { ScrollView } from "ui/scroll-view";
 import { Label } from "ui/label";
-import { TextField } from "ui/text-field";
-import { TextView } from "ui/text-view";
-import { Button } from "ui/button";
 import { FontStyle, FontWeight } from "ui/enums";
 import typeUtils = require("utils/types");
 import { Color } from "color";
+import * as font from "ui/styling/font";
 
-const fontFamilies = ["system", "sans-serif", "serif", "monospace"];
-const fontWeights = [FontWeight.normal, FontWeight.bold];
-const fontStyles = [FontStyle.normal, FontStyle.italic];
+const genericFontFamilies = [
+    "system",
+    "sans-serif",
+    "serif",
+    "monospace",
+];
+var fontFamilies = [];
+var fontNames = [];
+const embeddedFontNames = [
+    "Entypo",
+    "EvilIcons",
+    "FontAwesome",
+    "Ionicons",
+    "Material-Design-Iconic-Font",
+    "MaterialIcons",
+];
+const fontStyles = [
+    FontStyle.normal,
+    FontStyle.italic
+];
+const fontWeights = [
+    FontWeight.thin,
+    FontWeight.extraLight,
+    FontWeight.light,
+    FontWeight.normal,
+    FontWeight.medium,
+    FontWeight.semiBold,
+    FontWeight.bold,
+    FontWeight.extraBold,
+    FontWeight.black,
+];
 
-export function onStackLayoutLoaded(args: EventData) {
-    var layout = <LayoutBase>args.object;
-    _generateViews(() => { return new Label(); }, layout);
-    _generateViews(() => { return new TextField(); }, layout);
-    _generateViews(() => { return new TextView(); }, layout);
-    _generateViews(() => { return new Button(); }, layout);
+var green = new Color("Green");
+var red = new Color("Red");
+var white = new Color("White");
+var black = new Color("Black");
+
+var compareIgnoreCase = function (a, b) {
+    return a.toLowerCase().localeCompare(b.toLowerCase());
+};
+
+if (font.ios) {
+    for (var f = 0; f < embeddedFontNames.length; f++) {
+        font.ios.registerFont(`fonts/${embeddedFontNames[f]}.ttf`);
+    }
+
+    var font_internal = <any>font;
+    font_internal.ensureSystemFontSets();
+
+    (<Set<string>>font_internal.systemFontFamilies).forEach(f => fontFamilies.push(f));
+    fontFamilies = fontFamilies.sort(compareIgnoreCase);
+
+    (<Set<string>>font_internal.systemFonts).forEach(f => fontNames.push(f));
+    fontNames = fontNames.sort(compareIgnoreCase);
+}
+
+export function onPageLoaded(args: NavigatedData) {
+    var page = <Page>args.object;
+    var scrollView = new ScrollView();
+    var stackLayout = new StackLayout();
+    generateLabels(stackLayout);
+    scrollView.content = stackLayout;
+    page.content = scrollView;
 }
 
-function _generateViews(factory: () => View, layout: LayoutBase) {
+function generateLabels(layout: StackLayout) {
+    layout.addChild(prepareTitle("Generic Font Families", 24));
+    for (var f = 0; f < genericFontFamilies.length; f++) {
+        layout.addChild(prepareTitle(genericFontFamilies[f], 20));
+        for (var s = 0; s < fontStyles.length; s++) {
+            for (var w = 0; w < fontWeights.length; w++) {
+                var view = prepareLabel(genericFontFamilies[f], fontStyles[s], fontWeights[w]);
+                layout.addChild(view);
+            }
+        }
+    }
+
+    if (fontFamilies.length > 0)
+    {
+        layout.addChild(prepareTitle("Font Families", 24));
+    }
     for (var f = 0; f < fontFamilies.length; f++) {
-        for (var w = 0; w < fontWeights.length; w++) {
-            for (var s = 0; s < fontStyles.length; s++) {
-                var view = factory();
-                var css = `font-family: ${fontFamilies[f]}; font-weight: ${fontWeights[w]}; font-style: ${fontStyles[s]};`;
-                (<any>view).text = `${typeUtils.getClass(view)} ${css}`;
-                (<any>view).textWrap = true;
-                view.style.textAlignment = "left";
-                view.setInlineStyle(css);
-                view.margin = "1 0";
-                view.borderWidth = 1;
-                view.height = 75;
-                view.color = new Color("Black");
-                view.backgroundColor = new Color("LightGray");
-                view.on("loaded", args => {
-                    (<any>view).text += _getFontInfo(view);
-                });
+        layout.addChild(prepareTitle(fontFamilies[f], 20));
+        for (var s = 0; s < fontStyles.length; s++) {
+            for (var w = 0; w < fontWeights.length; w++) {
+                var view = prepareLabel(fontFamilies[f], fontStyles[s], fontWeights[w]);
                 layout.addChild(view);
             }
         }
     }
+
+    if (fontNames.length > 0) {
+        layout.addChild(prepareTitle("Phone Fonts", 24));
+    }
+    for (var f = 0; f < fontNames.length; f++) {
+        var view = prepareLabel(fontNames[f], "normal", "normal");
+        layout.addChild(view);
+    }
+
+    if (embeddedFontNames.length > 0) {
+        layout.addChild(prepareTitle("Embedded Fonts", 24));
+    }
+    for (var f = 0; f < embeddedFontNames.length; f++) {
+        var view = prepareLabel(embeddedFontNames[f], "normal", "normal");
+        layout.addChild(view);
+    }
 }
 
-function _getFontInfo(view: View): string {
+function prepareTitle(text: string, fontSize: number) {
+    var title = new Label();
+    title.text = text;
+    title.height = 100;
+    title.backgroundColor = black;
+    title.color = white;
+    title.fontSize = fontSize;
+    title.style.fontStyle = "italic";
+    title.borderWidth = 1;
+    title.borderColor = white;
+    title.textAlignment = "center";
+    return title;
+}
+
+function prepareLabel(fontFamily: string, fontStyle: string, fontWeight: string): View {
+    var label = new Label();
+    label["font-family"] = fontFamily;
+    var fontFamilyCss = `font-family: ${fontFamily}; `;
+    var fontStyleCss = fontStyle !== FontStyle.normal ? `font-style: ${fontStyle}; ` : "";
+    var fontWeightCss = fontWeight !== FontWeight.normal ? `font-weight: ${fontWeight}; ` : "";
+    var css = `${fontFamilyCss}${fontStyleCss}${fontWeightCss}`;
+    label.text = `${typeUtils.getClass(label) } {${css}};`;
+    label.textWrap = true;
+    label.style.textAlignment = "left";
+    label.borderWidth = 1;
+    label.borderColor = black;
+    label.style.padding = "2"; 
+    label.setInlineStyle(css);
+    label.on("loaded", args => {
+        var sender = <Label>args.object;
+        if (sender.ios) {
+            var uiFont = _getUIFont(label);
+            sender.text += `\niOS Font: ${uiFont.fontName};`;
+            if (genericFontFamilies.indexOf(fontFamily) !== -1) {
+                return;
+            }
+            if (uiFont.fontName.replace(" ", "").indexOf((<string>sender["font-family"]).replace(" ", "")) !== -1) {
+                sender.color = green;
+            }
+            else {
+                sender.color = red;
+            }
+        }
+    });
+    if (fontFamily === "FontAwesome") {
+        label.text += "\uF17B\uF10B";
+    }
+    return label;
+}
+
+function _getUIFont(view: any): UIFont {
     if (view.ios) {
-        var uiFont: UIFont;
         if (view.ios instanceof UIButton) {
-            uiFont = view.ios.titleLabel.font;
+            return view.ios.titleLabel.font;
         }
         else if (view.ios.font) {
-            uiFont = view.ios.font;
+            return view.ios.font;
         }
-
-        return ` ${uiFont.fontName} ${uiFont.pointSize}pt.`;
     }
-
-    return "";
 }
diff --git a/apps/sample-fonts/main-page.xml b/apps/sample-fonts/main-page.xml
@@ -1,5 +1,3 @@
-<Page xmlns="http://schemas.nativescript.org/tns.xsd" >
-  <ScrollView>
-    <StackLayout loaded="onStackLayoutLoaded"/>
-  </ScrollView>
+<Page xmlns="http://schemas.nativescript.org/tns.xsd" 
+      loaded="onPageLoaded">
 </Page>
diff --git a/ui/enums/enums.d.ts b/ui/enums/enums.d.ts
@@ -485,14 +485,49 @@
      */
     export module FontWeight {
         /**
-         * Normal font weight.
+         * Thin font weight. CSS font-weight 100.
+         */
+        export var thin: string;
+
+        /**
+         * Extra-light / Ultra-light font weight. CSS font-weight 200.
+         */
+        export var extraLight: string;
+
+        /**
+         * Light font weight. CSS font-weight 300.
+         */
+        export var light: string;
+
+        /**
+         * Normal font weight. CSS font-weight 400.
          */
         export var normal: string;
 
         /**
-         * Bold font weight.
+         * Medium font weight. CSS font-weight 500.
+         */
+        export var medium: string;
+
+        /**
+         * Semi-bold / Demi-bold font weight. CSS font-weight 600.
+         */
+        export var semiBold: string;
+
+        /**
+         * Bold font weight. CSS font-weight 700.
          */
         export var bold: string;
+
+        /**
+         * Extra-bold / Ultra-bold font weight. CSS font-weight 800.
+         */
+        export var extraBold: string;
+
+        /**
+         * Black font weight. CSS font-weight 900.
+         */
+        export var black: string;
     }
 
     /**

diff --git a/ui/enums/enums.ts b/ui/enums/enums.ts
@@ -146,8 +146,15 @@ export module FontStyle {
 }
 
 export module FontWeight {
-    export var normal: string = "normal";
-    export var bold: string = "bold";
+    export var thin: string = "100";
+    export var extraLight: string = "200";
+    export var light: string = "300";
+    export var normal: string = "normal"; // 400 
+    export var medium: string = "500";
+    export var semiBold: string = "600";
+    export var bold: string = "bold"; // 700 
+    export var extraBold: string = "800";
+    export var black: string = "900";
 }
 
 export module BackgroundRepeat {

diff --git a/ui/styling/font-common.ts b/ui/styling/font-common.ts
@@ -39,14 +39,15 @@ export class Font implements definitios.Font {
     }
 
     get isBold(): boolean {
-        return this._fontWeight.toLowerCase() === enums.FontWeight.bold;;
+        return this._fontWeight.toLowerCase() === enums.FontWeight.bold
+            || this._fontWeight.toLowerCase() === "700";
     }
     set isBold(value: boolean) {
         throw new Error("isBold is read-only");
     }
 
     get isItalic(): boolean {
-        return this._fontStyle.toLowerCase() === enums.FontStyle.italic;;
+        return this._fontStyle.toLowerCase() === enums.FontStyle.italic;
     }
     set isItalic(value: boolean) {
         throw new Error("isItalic is read-only");
@@ -135,8 +136,21 @@ export module genericFontFamilies {
 
 var styles = new Set();
 ["italic", "oblique"].forEach((val, i, a) => styles.add(val));
+
+// http://www.w3schools.com/cssref/pr_font_weight.asp
+//- normal(same as 400)
+//- bold(same as 700)
+//- 100(Thin) (API16 -thin)
+//- 200(Extra Light / Ultra Light) (API16 -light)
+//- 300(Light) (API16 -light)
+//- 400(Normal) 
+//- 500(Medium) (API21 -medium)
+//- 600(Semi Bold / Demi Bold) (API21 -medium)
+//- 700(Bold) (API16 -bold)
+//- 800(Extra Bold / Ultra Bold) (API16 -bold)
+//- 900(Black / Heavy) (API21 -black)
 var weights = new Set();
-["bold", "bolder", "lighter", "100", "200", "300", "400", "500", "600", "700", "800", "900"].forEach((val, i, a) => weights.add(val));
+["normal", "bold", "100", "200", "300", "400", "500", "600", "700", "800", "900"].forEach((val, i, a) => weights.add(val));
 
 interface ParsedFont {
     fontStyle?: string;