From b2cf286948e547eee9bbcabaf108282711d3d22c Mon Sep 17 00:00:00 2001
From: PanayotCankov <panayot.cankov@telerik.com>
Date: Fri, 17 Feb 2017 13:26:11 +0200
Subject: [PATCH] Fixed text decoration tests, Color will now store just a
 single argb info in 32bit unsigned int internally and covert to a/r/g/b or
 hex when necessary

---
 .vscode/settings.json                         |  10 +
 apps/app/ui-tests-app/css/letter-spacing.xml  |  19 +-
 apps/package.json                             |   2 +-
 tests/app/color-tests.ts                      |  43 +--
 tests/app/timer-tests.ts                      |   9 +-
 tests/app/ui/button/button-tests.ts           |  45 ++-
 tests/app/ui/label/label-tests.ts             |   9 +-
 tests/app/ui/page/page-tests-common.ts        |  22 +-
 tests/app/ui/search-bar/search-bar-tests.ts   |  10 +-
 tests/app/ui/text-field/text-field-tests.ts   |  28 +-
 tests/app/ui/text-view/text-view-tests.ts     |  33 +-
 tests/app/ui/view/view-tests-common.ts        |   4 +-
 tns-core-modules/color/color-common.ts        | 101 ++---
 tns-core-modules/color/color.android.ts       |   6 +-
 tns-core-modules/color/color.ios.ts           |  16 -
 .../ui/text-base/text-base.ios.ts             | 353 +++++++++---------
 16 files changed, 340 insertions(+), 370 deletions(-)
 create mode 100644 .vscode/settings.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 000000000..5acd7ae98
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,10 @@
+// Place your settings in this file to overwrite default and user settings.
+{
+    "search.exclude": {
+        "**/node_modules": true,
+        "**/bower_components": true,
+        "**/platforms": true,
+        "**/*.js": true,
+        "**/*.js.map": true
+    }
+}
\ No newline at end of file
diff --git a/apps/app/ui-tests-app/css/letter-spacing.xml b/apps/app/ui-tests-app/css/letter-spacing.xml
index 7d88709b8..21b3dbb72 100644
--- a/apps/app/ui-tests-app/css/letter-spacing.xml
+++ b/apps/app/ui-tests-app/css/letter-spacing.xml
@@ -5,14 +5,17 @@
         <Label text="labelLabel" style="letter-spacing: -0.1;" />
         <Label text="labelLabel" style="letter-spacing: 0;" />
         <Label text="labelLabel" style="letter-spacing: 0.1;" />
+        <Label>
+            <Span text="just bold" fontWeight="bold" />
+        </Label>
       </WrapLayout>
       <Label text="labelLabel" style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;" />
       <Label style="text-transform: uppercase; text-decoration: underline line-through;letter-spacing: 0.1;">
         <Label.formattedText>
           <FormattedString>
             <FormattedString.spans>
-              <Span text="label" fontAttributes="Bold" foregroundColor="#0000ff" />
-              <Span text="Label" fontAttributes="Italic" foregroundColor="#00ff00" />
+              <Span text="label" fontWeight="bold" color="#0000ff" />
+              <Span text="Label" fontStyle="italic" color="#00ff00" />
             </FormattedString.spans>
           </FormattedString>
         </Label.formattedText>
@@ -28,8 +31,8 @@
         <Button.formattedText>
           <FormattedString>
             <FormattedString.spans>
-              <Span text="button" fontAttributes="Bold" foregroundColor="#0000ff" />
-              <Span text="Button" fontAttributes="Italic" foregroundColor="#00ff00" />
+              <Span text="button" fontWeight="bold" color="#0000ff" />
+              <Span text="Button" fontStyle="italic" color="#00ff00" />
             </FormattedString.spans>
           </FormattedString>
         </Button.formattedText>
@@ -46,8 +49,8 @@
         <TextField.formattedText>
           <FormattedString>
             <FormattedString.spans>
-              <Span text="text" fontAttributes="Bold" foregroundColor="#0000ff" />
-              <Span text="Field" fontAttributes="Italic" foregroundColor="#00ff00" />
+              <Span text="text" fontWeight="bold" color="#0000ff" />
+              <Span text="Field" fontStyle="italic" color="#00ff00" />
             </FormattedString.spans>
           </FormattedString>
         </TextField.formattedText>
@@ -64,8 +67,8 @@
         <TextView.formattedText>
           <FormattedString>
             <FormattedString.spans>
-              <Span text="text" fontAttributes="Bold" foregroundColor="#0000ff" />
-              <Span text="View" fontAttributes="Italic" foregroundColor="#00ff00" />
+              <Span text="text" fontWeight="bold" color="#0000ff" />
+              <Span text="View" fontStyle="italic" color="#00ff00" />
             </FormattedString.spans>
           </FormattedString>
         </TextView.formattedText>
diff --git a/apps/package.json b/apps/package.json
index e4a1d524a..ebcddf27b 100644
--- a/apps/package.json
+++ b/apps/package.json
@@ -9,7 +9,7 @@
       "version": "2.5.0"
     },
     "tns-android": {
-      "version": "2.4.1"
+      "version": "2.5.0"
     }
   },
   "dependencies": {
diff --git a/tests/app/color-tests.ts b/tests/app/color-tests.ts
index cb05709d0..3aefa9f6d 100644
--- a/tests/app/color-tests.ts
+++ b/tests/app/color-tests.ts
@@ -14,7 +14,7 @@ export var test_Hex_Color = function () {
     TKUnit.assertEqual(color.g, 0, "Color.g not properly parsed");
     TKUnit.assertEqual(color.b, 0, "Color.b not properly parsed");
     TKUnit.assertEqual(color.hex, "#FF0000", "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 0, 0), "Color.argb not properly parsed");
+    TKUnit.assertEqual(color.argb, 0xFFFF0000, "Color.argb not properly parsed");
 }
 
 export var test_ShortHex_Color = function () {
@@ -27,7 +27,7 @@ export var test_ShortHex_Color = function () {
     TKUnit.assertEqual(color.g, 136, "Color.g not properly parsed"); // 0x88 == 136
     TKUnit.assertEqual(color.b, 0, "Color.b not properly parsed");
     TKUnit.assertEqual(color.hex, "#FF8800", "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 136, 0), "Color.argb not properly parsed");
+    TKUnit.assertEqual(color.argb, 0xFFFF8800, "Color.argb not properly parsed");
 }
 
 export var test_Argb_Color = function () {
@@ -39,22 +39,21 @@ export var test_Argb_Color = function () {
     TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
     TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
     TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
-    TKUnit.assertEqual(color.hex, _buildHex(100, 255, 100, 100), "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(100, 255, 100, 100), "Color.argb not properly parsed");
+    TKUnit.assertEqual(color.hex, "#64FF6464", "Color.hex not properly parsed");
+    TKUnit.assertEqual(color.argb, 0x64FF6464, "Color.argb not properly parsed");
 }
 
 export var test_ArgbInt_Color = function () {
     // >> color-rgb-single
     // Creates the color with 100 alpha, 100 red, 100 green, 100 blue
-    var argb = (100 << 24) | (100 << 16) | (100 << 8) | 100;
-    var color = new Color(argb);
+    var color = new Color(0x64646464);
     // << color-rgb-single
     TKUnit.assertEqual(color.a, 100, "Color.a not properly parsed");
     TKUnit.assertEqual(color.r, 100, "Color.r not properly parsed");
     TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
     TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
-    TKUnit.assertEqual(color.hex, _buildHex(100, 100, 100, 100), "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(100, 100, 100, 100), "Color.argb not properly parsed");
+    TKUnit.assertEqual(color.hex, "#64646464", "Color.hex not properly parsed");
+    TKUnit.assertEqual(color.argb, 0x64646464, "Color.argb not properly parsed");
 }
 
 export var test_rgb_Color_CSS = function () {
@@ -69,13 +68,13 @@ export var test_rgb_Color_CSS = function () {
     TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
     TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
     TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
-    TKUnit.assertEqual(color.hex, _buildHex(255, 255, 100, 100), "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(255, 255, 100, 100), "Color.argb not properly parsed");
+    TKUnit.assertEqual(color.hex, "#FF6464", "Color.hex not properly parsed");
+    TKUnit.assertEqual(color.argb, 0xFFFF6464, "Color.argb not properly parsed");
 }
 
 export var test_rgba_Color_CSS = function () {
     var alpha = 0.5;
-    var expected = Math.round(alpha * 255);
+    var expected = 0x80;
     // <snippet module="color" title="color">
     // ### Creating a Color from four RGB values
     // ``` JavaScript
@@ -87,24 +86,6 @@ export var test_rgba_Color_CSS = function () {
     TKUnit.assertEqual(color.r, 255, "Color.r not properly parsed");
     TKUnit.assertEqual(color.g, 100, "Color.g not properly parsed");
     TKUnit.assertEqual(color.b, 100, "Color.b not properly parsed");
-    TKUnit.assertEqual(color.hex, _buildHex(expected, 255, 100, 100), "Color.hex not properly parsed");
-    TKUnit.assertEqual(color.argb, _parseArgb(expected, 255, 100, 100), "Color.argb not properly parsed");
-}
-
-var _buildHex = function (a: number, r: number, g: number, b: number): string {
-    return "#" + _componentToHex(a) + _componentToHex(r) + _componentToHex(g) + _componentToHex(b);
-}
-
-var _componentToHex = function (component: number): string {
-    var hex = component.toString(16);
-    if (hex.length === 1) {
-        hex = "0" + hex;
-    }
-
-    return hex;
-}
-
-var _parseArgb = function (a: number, r: number, g: number, b: number): number {
-    // Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
-    return (a << 24) | (r << 16) | (g << 8) | b;
+    TKUnit.assertEqual(color.hex, "#80FF6464", "Color.hex not properly parsed");
+    TKUnit.assertEqual(color.argb, 0x80FF6464, "Color.argb not properly parsed");
 }
diff --git a/tests/app/timer-tests.ts b/tests/app/timer-tests.ts
index 7acc70c57..2e6890fcb 100644
--- a/tests/app/timer-tests.ts
+++ b/tests/app/timer-tests.ts
@@ -52,16 +52,17 @@ export function test_setTimeout_callbackCalledAfterSpecifiedTime() {
 
     TKUnit.waitUntilReady(() => completed, 1);
     timer.clearTimeout(id);
-    TKUnit.assert(completed, "Callback should be called after specified time!");
+    TKUnit.assert(completed, "Callback should be called after the specified time!");
 };
 
 export function test_setTimeout_callbackNotCalled() {
     let completed = false;
-    const id = timer.setTimeout(() => completed = true, 50);
 
-    TKUnit.wait(0.007);
+    const id = timer.setTimeout(() => completed = true, 10);
     timer.clearTimeout(id);
-    TKUnit.assert(!completed, "Callback should be called after specified time!");
+    TKUnit.wait(30 / 1000);
+
+    TKUnit.assert(!completed, "Callback should not be called after the specified time!");
 };
 
 export function test_setTimeout_shouldReturnNumber() {
diff --git a/tests/app/ui/button/button-tests.ts b/tests/app/ui/button/button-tests.ts
index f5b6b053c..4f31771a6 100644
--- a/tests/app/ui/button/button-tests.ts
+++ b/tests/app/ui/button/button-tests.ts
@@ -180,58 +180,60 @@ var _testNativeFontSizeFromLocal = function (views: Array<viewModule.View>) {
     helper.assertAreClose(actualResult, expectedFontSize, "FontSizeFromLocal");
 }
 
-var expectedColorHex = "#ffff0000";
+var actualColorHex = "#ffff0000";
+var expectedNormalizedColorHex = "#FF0000"
 var _testLocalColorFromCss = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
     var page = <pagesModule.Page>views[1];
-    page.css = "button { color: " + expectedColorHex + "; }";
+    page.css = "button { color: " + actualColorHex + "; }";
 
     var actualResult = button.style.color.hex;
-    TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
 }
 
 var _testNativeColorFromCss = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
     var page = <pagesModule.Page>views[1];
-    page.css = "button { color: " + expectedColorHex + "; }";
+    page.css = "button { color: " + actualColorHex + "; }";
 
     var actualResult = buttonTestsNative.getNativeColor(button).hex;
-    TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
 }
 
 var _testNativeColorFromLocal = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
-    button.style.color = new colorModule.Color(expectedColorHex);
+    button.style.color = new colorModule.Color(actualColorHex);
 
     var actualResult = buttonTestsNative.getNativeColor(button).hex;
-    TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
 }
 
-var expectedBackgroundColorHex = "#ff00ff00";
+var actualBackgroundColorHex = "#FF00FF00";
+var expectedNormalizedBackgroundColorHex = "#00FF00";
 var _testLocalBackgroundColorFromCss = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
     var page = <pagesModule.Page>views[1];
-    page.css = "button { background-color: " + expectedBackgroundColorHex + "; }";
+    page.css = "button { background-color: " + actualBackgroundColorHex + "; }";
 
     var actualResult = button.style.backgroundColor.hex;
-    TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
 }
 
 var _testNativeBackgroundColorFromCss = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
     var page = <pagesModule.Page>views[1];
-    page.css = "button { background-color: " + expectedBackgroundColorHex + "; }";
+    page.css = "button { background-color: " + actualBackgroundColorHex + "; }";
 
     var actualResult = buttonTestsNative.getNativeBackgroundColor(button).hex;
-    TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
 }
 
 var _testNativeBackgroundColorFromLocal = function (views: Array<viewModule.View>) {
     var button = <buttonModule.Button>views[0];
-    button.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
+    button.style.backgroundColor = new colorModule.Color(actualBackgroundColorHex);
 
     var actualResult = buttonTestsNative.getNativeBackgroundColor(button).hex;
-    TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+    TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
 }
 
 var expectedTextAlignment: "right" = "right";
@@ -261,13 +263,14 @@ export var test_StateHighlighted_also_fires_pressedState = function () {
     helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
         var view = <buttonModule.Button>views[0];
         var page = <pagesModule.Page>views[1];
-        var expectedColor = "#ffff0000";
+        var expectedColor = "#FFFF0000";
+        var expectedNormalizedColor = "#FF0000";
         page.css = "button:pressed { background-color: " + expectedColor + "; }";
 
         view._goToVisualState('highlighted');
 
         var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
-        TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
+        TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
     });
 }
 
@@ -275,13 +278,14 @@ export var test_StateHighlighted_also_fires_activeState = function () {
     helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
         var view = <buttonModule.Button>views[0];
         var page = <pagesModule.Page>views[1];
-        var expectedColor = "#ffff0000";
+        var expectedColor = "#FFFF0000";
+        var expectedNormalizedColor = "#FF0000";
         page.css = "button:active { background-color: " + expectedColor + "; }";
 
         view._goToVisualState('highlighted');
 
         var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
-        TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
+        TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
     });
 }
 
@@ -289,13 +293,14 @@ export var test_applying_disabled_visual_State_when_button_is_disable = function
     helper.buildUIAndRunTest(_createButtonFunc(), function (views: Array<viewModule.View>) {
         var view = <buttonModule.Button>views[0];
         var page = <pagesModule.Page>views[1];
-        var expectedColor = "#ffff0000";
+        var expectedColor = "#FFFF0000";
+        var expectedNormalizedColor = "#FF0000";
         page.css = "button:disabled { background-color: " + expectedColor + "; }";
 
         view.isEnabled = false;
 
         var actualResult = buttonTestsNative.getNativeBackgroundColor(view);
-        TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
+        TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
     });
 }
 
diff --git a/tests/app/ui/label/label-tests.ts b/tests/app/ui/label/label-tests.ts
index d96c3b505..cd7ddb986 100644
--- a/tests/app/ui/label/label-tests.ts
+++ b/tests/app/ui/label/label-tests.ts
@@ -193,8 +193,8 @@ export class LabelTest extends testModule.UITest<LabelModule.Label> {
         const label = this.testView;
 
         const fontSize = 14;
-        const color = "#ffff0000";
-        const backgroundColor = "#ff00ff00";
+        const color = "#FFFF0000";
+        const backgroundColor = "#FF00FF00";
         const testCss = [".title {background-color: ", backgroundColor, "; ",
             "color: ", color, "; ",
             "font-size: ", fontSize, ";}"].join("");
@@ -471,14 +471,15 @@ export class LabelTest extends testModule.UITest<LabelModule.Label> {
         let view = this.testView;
         let page = this.testPage;
         this.waitUntilTestElementIsLoaded();
-        let expectedColor = "#ffff0000";
+        let expectedColor = "#FFFF0000";
+        let expectedNormalizedColor = "#FF0000";
 
         page.css = "label:disabled { background-color: " + expectedColor + "; }";
 
         view.isEnabled = false;
 
         let actualResult = labelTestsNative.getNativeBackgroundColor(view);
-        TKUnit.assert(actualResult.hex === expectedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedColor);
+        TKUnit.assert(actualResult.hex === expectedNormalizedColor, "Actual: " + actualResult.hex + "; Expected: " + expectedNormalizedColor);
     };
 
     public test_IntegrationTest_Transform_Decoration_Spacing_WithoutFormattedText_DoesNotCrash() {
diff --git a/tests/app/ui/page/page-tests-common.ts b/tests/app/ui/page/page-tests-common.ts
index 327a221ea..118ad56be 100644
--- a/tests/app/ui/page/page-tests-common.ts
+++ b/tests/app/ui/page/page-tests-common.ts
@@ -295,7 +295,7 @@ export function test_LoadPageFromDeclarativeWithCSS() {
     TKUnit.assert(topFrame.currentPage.content instanceof Label, "Content of the test page should be a Label created within test-page-module-css.");
     let testLabel = <Label>topFrame.currentPage.content;
     TKUnit.assertEqual(testLabel.text, "Label created within a page declarative file with css.");
-    TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#ff00ff00");
+    TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#00FF00");
 }
 
 export function test_LoadPageFromModuleWithCSS() {
@@ -305,7 +305,7 @@ export function test_LoadPageFromModuleWithCSS() {
     TKUnit.assert(topFrame.currentPage.content instanceof Label, "Content of the test page should be a Label created within test-page-module-css.");
     let testLabel = <Label>topFrame.currentPage.content;
     TKUnit.assertEqual(testLabel.text, "Label created within a page module css.");
-    TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#ff00ff00");
+    TKUnit.assertEqual(testLabel.style.backgroundColor.hex, "#00FF00");
 }
 
 export function test_NavigateToPageCreatedWithNavigationEntry() {
@@ -334,7 +334,7 @@ export function test_cssShouldBeAppliedToAllNestedElements() {
     let stackLayout = new StackLayout();
     stackLayout.addChild(label);
     testPage.content = stackLayout;
-    testPage.css = "stackLayout {background-color: #ffff0000;} label {background-color: #ff00ff00;}";
+    testPage.css = "stackLayout {background-color: #FFFF0000;} label {background-color: #FF00FF00;}";
 
     let pageFactory = function () {
         return testPage;
@@ -342,8 +342,8 @@ export function test_cssShouldBeAppliedToAllNestedElements() {
 
     helper.navigate(pageFactory);
 
-    TKUnit.assertEqual(label.style.backgroundColor.hex, "#ff00ff00");
-    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ffff0000");
+    TKUnit.assertEqual(label.style.backgroundColor.hex, "#00FF00");
+    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#FF0000");
 }
 
 export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
@@ -356,7 +356,7 @@ export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
     let stackLayout = new StackLayout();
     stackLayout.addChild(label);
     testPage.content = stackLayout;
-    testPage.css = "stackLayout {background-color: #ffff0000;} label {background-color: #ff00ff00;}";
+    testPage.css = "stackLayout {background-color: #FFFF0000;} label {background-color: #FF00FF00;}";
 
     let pageFactory = function () {
         return testPage;
@@ -364,12 +364,12 @@ export function test_cssShouldBeAppliedAfterChangeToAllNestedElements() {
 
     helper.navigate(pageFactory);
 
-    TKUnit.assertEqual(label.style.backgroundColor.hex, "#ff00ff00");
-    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ffff0000");
+    TKUnit.assertEqual(label.style.backgroundColor.hex, "#00FF00");
+    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#FF0000");
 
-    testPage.css = "stackLayout {background-color: #ff0000ff;} label {background-color: #ffff0000;}";
-    TKUnit.assertEqual(label.style.backgroundColor.hex, "#ffff0000");
-    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#ff0000ff");
+    testPage.css = "stackLayout {background-color: #FF0000FF;} label {background-color: #FFFF0000;}";
+    TKUnit.assertEqual(label.style.backgroundColor.hex, "#FF0000");
+    TKUnit.assertEqual(stackLayout.style.backgroundColor.hex, "#0000FF");
 }
 
 export function test_page_backgroundColor_is_white() {
diff --git a/tests/app/ui/search-bar/search-bar-tests.ts b/tests/app/ui/search-bar/search-bar-tests.ts
index 4279d1508..f3deedc8e 100644
--- a/tests/app/ui/search-bar/search-bar-tests.ts
+++ b/tests/app/ui/search-bar/search-bar-tests.ts
@@ -31,18 +31,18 @@ export var testSearchBarHintColorAndroid = function () {
         searchBar.text = "";
         searchBar.hint = "hint color test";
 
-        var expectedValue;
+        var expectedNormalizedValue;
         var actualValue;
 
         searchBar.textFieldHintColor = new colorModule.Color("blue");
-        expectedValue = "#ff0000ff"; // blue
+        expectedNormalizedValue = "#0000FF"; // blue
         actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
-        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+        TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
 
         searchBar.textFieldHintColor = new colorModule.Color("red");
-        expectedValue = "#ffff0000"; // Red
+        expectedNormalizedValue = "#FF0000"; // red
         actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
-        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+        TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
     });
 };
 
diff --git a/tests/app/ui/text-field/text-field-tests.ts b/tests/app/ui/text-field/text-field-tests.ts
index 44f6a8bdb..b2cd0e38e 100644
--- a/tests/app/ui/text-field/text-field-tests.ts
+++ b/tests/app/ui/text-field/text-field-tests.ts
@@ -397,7 +397,8 @@ export var testNativeFontSizeFromLocal = function () {
     });
 }
 
-var expectedColorHex = "#ffff0000";
+var expectedColorHex = "#FFFF0000";
+var expectedNormalizedColorHex = "#FF0000";
 export var testLocalColorFromCss = function () {
     helper.buildUIAndRunTest(_createTextFieldFunc(), function (views: Array<viewModule.View>) {
         var textField = <textFieldModule.TextField>views[0];
@@ -405,7 +406,7 @@ export var testLocalColorFromCss = function () {
         page.css = "textfield { color: " + expectedColorHex + "; }";
 
         var actualResult = textField.style.color.hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
@@ -416,7 +417,7 @@ export var testNativeColorFromCss = function () {
         page.css = "textfield { color: " + expectedColorHex + "; }";
 
         var actualResult = textFieldTestsNative.getNativeColor(textField).hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
@@ -426,11 +427,12 @@ export var testNativeColorFromLocal = function () {
         textField.style.color = new colorModule.Color(expectedColorHex);
 
         var actualResult = textFieldTestsNative.getNativeColor(textField).hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
-var expectedBackgroundColorHex = "#ff00ff00";
+var expectedBackgroundColorHex = "#FF00FF00";
+var expectedNormalizedBackgroundColorHex = "#00FF00";
 export var testLocalBackgroundColorFromCss = function () {
     helper.buildUIAndRunTest(_createTextFieldFunc(), function (views: Array<viewModule.View>) {
         var textField = <textFieldModule.TextField>views[0];
@@ -438,7 +440,7 @@ export var testLocalBackgroundColorFromCss = function () {
         page.css = "textfield { background-color: " + expectedBackgroundColorHex + "; }";
 
         var actualResult = textField.style.backgroundColor.hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
@@ -449,7 +451,7 @@ export var testNativeBackgroundColorFromCss = function () {
         page.css = "textfield { background-color: " + expectedBackgroundColorHex + "; }";
 
         var actualResult = textFieldTestsNative.getNativeBackgroundColor(textField).hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
@@ -459,7 +461,7 @@ export var testNativeBackgroundColorFromLocal = function () {
         textField.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
 
         var actualResult = textFieldTestsNative.getNativeBackgroundColor(textField).hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
@@ -568,21 +570,23 @@ export function test_IntegrationTest_Transform_Decoration_Spacing_WithFormattedT
 
 export function test_set_placeholder_color() {
     let view = new textFieldModule.TextField();
-    let expectedColorHex = "#ffff0000";
+    let expectedColorHex = "#FFFF0000";
+    let expectedNormalizedColorHex = "#FF0000";
     helper.buildUIAndRunTest(view, function (views: Array<viewModule.View>) {
         view.hint = "Some text for hint";
         view.setInlineStyle("placeholder-color: " + expectedColorHex + ";");
         let actualColorHex = textFieldTestsNative.getNativePlaceholderColor(view).hex;
-        TKUnit.assertEqual(actualColorHex, expectedColorHex);
+        TKUnit.assertEqual(actualColorHex, expectedNormalizedColorHex);
     });
 }
 
 export function test_set_placeholder_color_when_hint_is_not_set() {
     let view = new textFieldModule.TextField();
-    let expectedColorHex = "#ffff0000";
+    let expectedColorHex = "#FFFF0000";
+    let expectedNormalizedColorHex = "#FF0000";
     helper.buildUIAndRunTest(view, function (views: Array<viewModule.View>) {
         view.setInlineStyle("placeholder-color: " + expectedColorHex + ";");
         let actualColorHex = textFieldTestsNative.getNativePlaceholderColor(view).hex;
-        TKUnit.assertEqual(actualColorHex, expectedColorHex);
+        TKUnit.assertEqual(actualColorHex, expectedNormalizedColorHex);
     });
 }
\ No newline at end of file
diff --git a/tests/app/ui/text-view/text-view-tests.ts b/tests/app/ui/text-view/text-view-tests.ts
index 961af9ee1..d3f951f55 100644
--- a/tests/app/ui/text-view/text-view-tests.ts
+++ b/tests/app/ui/text-view/text-view-tests.ts
@@ -260,22 +260,19 @@ export var testHintColoriOS = function () {
         textView.hint = "hint";
 
         var expectedValue;
+        var expectedNormalizedValue;
         var actualValue;
 
-        // expectedValue = "#38.1999948ff0000"; // 22% red
-        // if (utils.ios.MajorVersion > 7) {
-        //     expectedValue = "#38.19999999999aff0000"; // 22% red
-        // }
         actualValue = textViewTestsNative.getNativeColor(textView).hex;
-        // TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
-        TKUnit.assert(actualValue.indexOf("#38.19999") === 0, "Expected hint color to start with #38.19999");
-        TKUnit.assert(actualValue.indexOf("ff0000") !== -1, "Expected hint color to end with ff0000");
+
+        TKUnit.assertEqual(actualValue, "#38FF0000", "Expected hint color to be a subtle transparent red: #38FF0000");
 
         textView.text = "text";
 
-        expectedValue = "#ffff0000"; // red
+        expectedValue = "#FFFF0000"; // red
+        expectedNormalizedValue = "#FF0000";
         actualValue = textViewTestsNative.getNativeColor(textView).hex;
-        TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
+        TKUnit.assert(actualValue === expectedNormalizedValue, "Actual: " + actualValue + "; Expected: " + expectedNormalizedValue);
     });
 }
 
@@ -377,7 +374,8 @@ export var testNativeFontSizeFromLocal = function () {
     });
 }
 
-var expectedColorHex = "#ffff0000";
+var expectedColorHex = "#FFFF0000";
+var expectedNormalizedColorHex = "#FF0000";
 export var testLocalColorFromCss = function () {
     helper.buildUIAndRunTest(_createTextViewFunc(), function (views: Array<viewModule.View>) {
         var textView = <textViewModule.TextView>views[0];
@@ -385,7 +383,7 @@ export var testLocalColorFromCss = function () {
         page.css = "textview { color: " + expectedColorHex + "; }";
 
         var actualResult = textView.style.color.hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
@@ -396,7 +394,7 @@ export var testNativeColorFromCss = function () {
         page.css = "textview { color: " + expectedColorHex + "; }";
 
         var actualResult = textViewTestsNative.getNativeColor(textView).hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
@@ -406,11 +404,12 @@ export var testNativeColorFromLocal = function () {
         textView.style.color = new colorModule.Color(expectedColorHex);
 
         var actualResult = textViewTestsNative.getNativeColor(textView).hex;
-        TKUnit.assert(actualResult === expectedColorHex, "Actual: " + actualResult + "; Expected: " + expectedColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedColorHex);
     });
 }
 
-var expectedBackgroundColorHex = "#ff00ff00";
+var expectedBackgroundColorHex = "#FF00FF00";
+var expectedNormalizedBackgroundColorHex = "#00FF00";
 export var testLocalBackgroundColorFromCss = function () {
     helper.buildUIAndRunTest(_createTextViewFunc(), function (views: Array<viewModule.View>) {
         var textView = <textViewModule.TextView>views[0];
@@ -418,7 +417,7 @@ export var testLocalBackgroundColorFromCss = function () {
         page.css = "textview { background-color: " + expectedBackgroundColorHex + "; }";
 
         var actualResult = textView.style.backgroundColor.hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
@@ -429,7 +428,7 @@ export var testNativeBackgroundColorFromCss = function () {
         page.css = "textview { background-color: " + expectedBackgroundColorHex + "; }";
 
         var actualResult = textViewTestsNative.getNativeBackgroundColor(textView).hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
@@ -439,7 +438,7 @@ export var testNativeBackgroundColorFromLocal = function () {
         textView.style.backgroundColor = new colorModule.Color(expectedBackgroundColorHex);
 
         var actualResult = textViewTestsNative.getNativeBackgroundColor(textView).hex;
-        TKUnit.assert(actualResult === expectedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedBackgroundColorHex);
+        TKUnit.assert(actualResult === expectedNormalizedBackgroundColorHex, "Actual: " + actualResult + "; Expected: " + expectedNormalizedBackgroundColorHex);
     });
 }
 
diff --git a/tests/app/ui/view/view-tests-common.ts b/tests/app/ui/view/view-tests-common.ts
index a21883eac..2da99f8ab 100644
--- a/tests/app/ui/view/view-tests-common.ts
+++ b/tests/app/ui/view/view-tests-common.ts
@@ -755,8 +755,8 @@ export function testIsVisible() {
 export function testSetInlineStyle() {
     const lbl = new Label();
 
-    const expectedColor = "#ff0000";
-    const expectedBackgroundColor = "#ff0000";
+    const expectedColor = "#FF0000";
+    const expectedBackgroundColor = "#FF0000";
 
     lbl.setInlineStyle(`color: ${expectedColor};background-color: ${expectedBackgroundColor};`);
 
diff --git a/tns-core-modules/color/color-common.ts b/tns-core-modules/color/color-common.ts
index 971b81221..58c6b1bff 100644
--- a/tns-core-modules/color/color-common.ts
+++ b/tns-core-modules/color/color-common.ts
@@ -6,11 +6,6 @@ const SHARP = "#";
 const HEX_REGEX = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)|(^#[0-9A-F]{8}$)/i;
 
 export class Color implements definition.Color {
-    private _a: number;
-    private _r: number;
-    private _g: number;
-    private _b: number;
-    private _hex: string;
     private _argb: number;
     private _name: string;
 
@@ -25,61 +20,48 @@ export class Color implements definition.Color {
                     this._argb = argbFromRgbOrRgba(arg);
                 } else if (knownColors.isKnownName(arg)) {
                     // The parameter is a known color name
-                    this._hex = knownColors.getKnownColor(arg);
+                    const hex = knownColors.getKnownColor(arg);
                     this._name = arg;
-                    this._argb = this._argbFromString(this._hex);
+                    this._argb = this._argbFromString(hex);
                 } else if (HEX_REGEX.test(arg)) {
                     // The parameter is a "#AARRGGBB" formatted string
-                    this._hex = this._normalizeHex(arg);
-                    this._argb = this._argbFromString(this._hex);
+                    const hex = this._normalizeHex(arg);
+                    this._argb = this._argbFromString(hex);
                 } else {
                     throw new Error("Invalid color: " + arg);
                 }
             } else if (types.isNumber(arg)) {
                 // The parameter is a 32-bit unsigned integer where each 8 bits specify a color component
-                this._argb = arg;
+                // In case a 32-bit signed int (Android, Java has no unsigned types) was provided - convert to unsigned by applyint >>> 0
+                this._argb = arg >>> 0;
             } else {
                 throw new Error("Expected 1 or 4 constructor parameters.");
             }
-            this._parseComponents();
-            if (!this._hex) {
-                this._hex = this._buildHex();
-            }
         } else if (arguments.length === 4) {
-            // TODO: Alpha may be optional
-            this._a = arguments[0];
-            this._r = arguments[1];
-            this._g = arguments[2];
-            this._b = arguments[3];
-            this._buildArgb();
-            this._hex = this._buildHex();
+            this._argb = (arguments[0] & 0xFF) * 0x01000000
+                       + (arguments[1] & 0xFF) * 0x00010000
+                       + (arguments[2] & 0xFF) * 0x00000100
+                       + (arguments[3] & 0xFF) * 0x00000001;
         } else {
             throw new Error("Expected 1 or 4 constructor parameters.");
         }
     }
 
-    get a(): number {
-        return this._a;
-    }
-
-    get r(): number {
-        return this._r;
-    }
-
-    get g(): number {
-        return this._g;
-    }
-
-    get b(): number {
-        return this._b;
-    }
+    get a(): number { return (this._argb / 0x01000000) & 0xFF; }
+    get r(): number { return (this._argb / 0x00010000) & 0xFF; }
+    get g(): number { return (this._argb / 0x00000100) & 0xFF; }
+    get b(): number { return (this._argb / 0x00000001) & 0xFF; }
 
     get argb(): number {
         return this._argb;
     }
 
     get hex(): string {
-        return this._hex;
+        if (this.a === 0xFF) {
+            return ("#" + this._componentToHex(this.r) + this._componentToHex(this.g) + this._componentToHex(this.b)).toUpperCase();
+        } else {
+            return ("#" + this._componentToHex(this.a) + this._componentToHex(this.r) + this._componentToHex(this.g) + this._componentToHex(this.b)).toUpperCase();
+        }
     }
 
     get name(): string {
@@ -95,7 +77,23 @@ export class Color implements definition.Color {
     }
 
     public _argbFromString(hex: string): number {
-        return undefined;
+        if (hex.charAt(0) === "#") {
+            hex = hex.substr(1);
+        }
+
+        if (hex.length === 3) {
+            hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+        } else if (hex.length === 4) {
+            hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2] + hex[3] + hex[3];
+        }
+
+        var intVal = parseInt(hex, 16);
+        if (hex.length === 6) {
+            // add the alpha component since the provided string is RRGGBB
+            intVal = (intVal & 0x00FFFFFF) + 0xFF000000;
+        }
+
+        return intVal;
     }
 
     public equals(value: definition.Color): boolean {
@@ -132,10 +130,6 @@ export class Color implements definition.Color {
         return HEX_REGEX.test(value) || isRgbOrRgba(value);
     }
 
-    private _buildHex(): string {
-        return SHARP + this._componentToHex(this._a) + this._componentToHex(this._r) + this._componentToHex(this._g) + this._componentToHex(this._b);
-    }
-
     private _componentToHex(component: number): string {
         let hex = component.toString(16);
         if (hex.length === 1) {
@@ -145,23 +139,6 @@ export class Color implements definition.Color {
         return hex;
     }
 
-    private _parseComponents() {
-        if (types.isUndefined(this._argb)) {
-            throw new Error("Missing the ARGB numeric value");
-        }
-
-        // Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
-        this._a = (this._argb >> 24) & 255;
-        this._r = (this._argb >> 16) & 255;
-        this._g = (this._argb >> 8) & 255;
-        this._b = this._argb & 255;
-    }
-
-    private _buildArgb() {
-        // Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
-        this._argb = (this._a << 24) | (this._r << 16) | (this._g << 8) | this._b;
-    }
-
     private _normalizeHex(hexStr: string): string {
         if (hexStr.charAt(0) === SHARP && hexStr.length === 4) {
             // Duplicate each char after the #, so "#123" becomes "#112233"
@@ -208,6 +185,8 @@ function argbFromRgbOrRgba(value: string): number {
         a = Math.round(parseFloat(parts[3].trim()) * 255);
     }
 
-    // Format is ARGB, so alpha takes the first 8 bits, red the next, green the next and the last 8 bits are for the blue component
-    return (a << 24) | (r << 16) | (g << 8) | b;
+    return (a & 0xFF) * 0x01000000
+         + (r & 0xFF) * 0x00010000
+         + (g & 0xFF) * 0x00000100
+         + (b & 0xFF) * 0x00000001;
 }
\ No newline at end of file
diff --git a/tns-core-modules/color/color.android.ts b/tns-core-modules/color/color.android.ts
index 6039a728a..2df6a1be9 100644
--- a/tns-core-modules/color/color.android.ts
+++ b/tns-core-modules/color/color.android.ts
@@ -2,10 +2,6 @@
 
 export class Color extends common.Color {
     get android(): number {
-        return this.argb;
-    }
-
-    public _argbFromString(hex: string): number {
-        return android.graphics.Color.parseColor(hex);
+        return this.argb >> 0;
     }
 }
\ No newline at end of file
diff --git a/tns-core-modules/color/color.ios.ts b/tns-core-modules/color/color.ios.ts
index 123867bfe..3a0df314f 100644
--- a/tns-core-modules/color/color.ios.ts
+++ b/tns-core-modules/color/color.ios.ts
@@ -1,7 +1,5 @@
 import * as common from "./color-common";
 
-var AMP = "#";
-
 export class Color extends common.Color {
     private _ios: UIColor;
 
@@ -12,18 +10,4 @@ export class Color extends common.Color {
         }
         return this._ios;
     }
-
-    public _argbFromString(hex: string): number {
-        if (hex.charAt(0) === AMP) {
-            hex = hex.substr(1);
-        }
-
-        var intVal = parseInt(hex, 16);
-        if (hex.length === 6) {
-            // add the alpha component since the provided string is RRGGBB
-            intVal |= 255 << 24;
-        }
-
-        return intVal;
-    }
 }
\ No newline at end of file
diff --git a/tns-core-modules/ui/text-base/text-base.ios.ts b/tns-core-modules/ui/text-base/text-base.ios.ts
index 38d2aa535..592eeeaef 100644
--- a/tns-core-modules/ui/text-base/text-base.ios.ts
+++ b/tns-core-modules/ui/text-base/text-base.ios.ts
@@ -6,7 +6,6 @@
 
 import { _isSet as isSet } from "ui/core/properties";
 import { FontWeight, FontStyle } from "ui/styling/font";
-import * as utils from "utils/utils";
 
 export * from "./text-base-common";
 
@@ -23,11 +22,15 @@ export class TextBase extends TextBaseCommon {
         return '';
     }
     set [textProperty.native](value: string) {
+        if (this.formattedText) {
+            return;
+        }
+
         const newValue = (value === undefined || value === null) ? '' : value.toString();
         const nativeView = this.nativeView;
         if (this.textDecorationSet || this.textTransformSet || this.letterSpacingSet) {
             const style = this.style;
-            setTextDecorationAndTransform(newValue, nativeView, style.textDecoration, style.textTransform, style.letterSpacing, style.color);
+            this.setTextDecorationAndTransform(newValue, nativeView, style.textDecoration, style.textTransform, style.letterSpacing, style.color);
         } else if (nativeView instanceof UIButton) {
             nativeView.setTitleForState(newValue, UIControlState.Normal);
         } else {
@@ -43,7 +46,7 @@ export class TextBase extends TextBaseCommon {
     }
     set [formattedTextProperty.native](value: FormattedString) {
         const style = this.style;
-        setFormattedTextDecorationAndTransform(value, this.nativeView, style.textDecoration, style.textTransform, style.letterSpacing);
+        this.setFormattedTextDecorationAndTransform(value, this.nativeView, style.textDecoration, style.textTransform, style.letterSpacing);
         textProperty.nativeValueChange(this, !value ? '' : value.toString());
         this._requestLayoutOnTextChanged();
     }
@@ -130,9 +133,9 @@ export class TextBase extends TextBaseCommon {
         this.textDecorationSet = value !== TextDecoration.NONE;
         const style = this.style;
         if (this.formattedText) {
-            setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, value, style.textTransform, style.letterSpacing);
+            this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, value, style.textTransform, style.letterSpacing);
         } else {
-            setTextDecorationAndTransform(this.text, this.nativeView, value, style.textTransform, style.letterSpacing, style.color);
+            this.setTextDecorationAndTransform(this.text, this.nativeView, value, style.textTransform, style.letterSpacing, style.color);
         }
     }
 
@@ -144,13 +147,13 @@ export class TextBase extends TextBaseCommon {
         this.textTransformSet = value !== TextTransform.NONE;
         const style = this.style;
         if (this.formattedText) {
-            setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, value, style.letterSpacing);
+            this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, value, style.letterSpacing);
         } else {
-            setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, value, style.letterSpacing, style.color);
+            this.setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, value, style.letterSpacing, style.color);
         }
     }
 
-    // LetterSpacing
+    // LetterSpacing.
     get [letterSpacingProperty.native](): number {
         return 0;
     }
@@ -158,11 +161,178 @@ export class TextBase extends TextBaseCommon {
         this.letterSpacingSet = value !== 0;
         const style = this.style;
         if (this.formattedText) {
-            setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, style.textTransform, value);
+            this.setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, style.textDecoration, style.textTransform, value);
         } else {
-            setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, style.textTransform, value, style.color);
+            this.setTextDecorationAndTransform(this.text, this.nativeView, style.textDecoration, style.textTransform, value, style.color);
         }
     }
+
+    setFormattedTextDecorationAndTransform(formattedText: FormattedString, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number) {
+        const attrText = this.createNSMutableAttributedString(formattedText);
+        if (letterSpacing !== 0) {
+            attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * nativeView.font.pointSize, { location: 0, length: attrText.length });
+        }
+
+        if (nativeView instanceof UIButton) {
+            nativeView.setAttributedTitleForState(attrText, UIControlState.Normal);
+        }
+        else {
+            nativeView.attributedText = attrText;
+        }
+    }
+
+    setTextDecorationAndTransform(text: string, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number, color: Color) {
+        let dict = new Map<string, number>();
+        switch (textDecoration) {
+            case TextDecoration.NONE:
+                break;
+            case TextDecoration.UNDERLINE:
+                dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
+                break;
+            case TextDecoration.LINE_THROUGH:
+                dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
+                break;
+            case TextDecoration.UNDERLINE_LINE_THROUGH:
+                dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
+                dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
+                break;
+            default:
+                throw new Error(`Invalid text decoration value: ${textDecoration}. Valid values are: "${TextDecoration.NONE}", "${TextDecoration.UNDERLINE}", "${TextDecoration.LINE_THROUGH}", "${TextDecoration.UNDERLINE_LINE_THROUGH}".`);
+        }
+
+        if (letterSpacing !== 0) {
+            dict.set(NSKernAttributeName, letterSpacing * nativeView.font.pointSize);
+        }
+
+        if (color) {
+            dict.set(NSForegroundColorAttributeName, color.ios);
+        }
+
+        let source = getTransformedText(text, textTransform);
+        if (dict.size > 0) {
+            let result = NSMutableAttributedString.alloc().initWithString(source);
+            result.setAttributesRange(<any>dict, { location: 0, length: source.length });
+            if (nativeView instanceof UIButton) {
+                nativeView.setAttributedTitleForState(result, UIControlState.Normal);
+            } else {
+                nativeView.attributedText = result;
+            }
+        } else {
+            if (nativeView instanceof UIButton) {
+                // Clear attributedText or title won't be affected.
+                nativeView.setAttributedTitleForState(null, UIControlState.Normal);
+                nativeView.setTitleForState(source, UIControlState.Normal);
+            } else {
+                // Clear attributedText or text won't be affected.
+                nativeView.attributedText = undefined;
+                nativeView.text = source;
+            }
+        }
+    }
+
+    createNSMutableAttributedString(formattedString: FormattedString): NSMutableAttributedString {
+        let mas = NSMutableAttributedString.alloc().init();
+        if (formattedString) {
+            for (let i = 0, spanStart = 0, length = formattedString.spans.length; i < length; i++) {
+                const span = formattedString.spans.getItem(i);
+                const text = span.text;
+                const textTransform = (<TextBase>formattedString.parent).textTransform;
+                let spanText = (text === null || text === undefined) ? '' : text.toString();
+                if (textTransform !== "none") {
+                    spanText = getTransformedText(spanText, textTransform);
+                }
+
+                const nsAttributedString = this.createMutableStringForSpan(span, spanText);
+                mas.insertAttributedStringAtIndex(nsAttributedString, spanStart);
+                spanStart += spanText.length;
+            }
+        }
+        return mas;
+    }
+
+    createMutableStringForSpan(span: Span, text: string): NSMutableAttributedString {
+        const viewFont = this.nativeView.font;
+        let attrDict = <{ key: string, value: any }>{};
+        const style = span.style;
+        const bold = isBold(style.fontWeight);
+        const italic = style.fontStyle === FontStyle.ITALIC;
+
+        let fontFamily = span.fontFamily;
+        let fontSize = span.fontSize;
+
+        if (bold || italic || fontFamily || fontSize) {
+            if (!fontSize) {
+                fontSize = viewFont.pointSize;
+            }
+
+            if (!fontFamily) {
+                fontFamily = viewFont.fontName;
+            }
+            
+            let font;
+
+            let fontDescriptor: UIFontDescriptor = viewFont.fontDescriptor;
+            if (fontFamily) {
+                fontDescriptor = fontDescriptor.fontDescriptorWithFamily(fontFamily);
+            }
+
+            let symbolicTraits;
+            if (bold) {
+                symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitBold;
+            }
+
+            if (italic) {
+                symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitItalic;
+            }
+
+            if (symbolicTraits) {
+                font = UIFont.fontWithDescriptorSize(fontDescriptor.fontDescriptorWithSymbolicTraits(symbolicTraits), fontSize);
+            } else {
+                font = UIFont.fontWithDescriptorSize(fontDescriptor, fontSize);
+            }
+
+            attrDict[NSFontAttributeName] = font;
+        }
+
+        const color = span.color;
+        if (color) {
+            attrDict[NSForegroundColorAttributeName] = color.ios;
+        }
+
+        // We don't use isSet function here because defaultValue for backgroundColor is null.
+        const backgroundColor = style.backgroundColor
+            || (<FormattedString>span.parent).backgroundColor
+            || (<TextBase>(<FormattedString>span.parent).parent).backgroundColor;
+        if (backgroundColor) {
+            attrDict[NSBackgroundColorAttributeName] = backgroundColor.ios;
+        }
+
+        let valueSource: typeof style;
+        if (isSet(textDecorationProperty, style)) {
+            valueSource = style;
+        } else if (isSet(textDecorationProperty, span.parent.style)) {
+            // span.parent is FormattedString
+            valueSource = span.parent.style;
+        } else if (isSet(textDecorationProperty, span.parent.parent.style)) {
+            // span.parent.parent is TextBase
+            valueSource = span.parent.parent.style;
+        }
+
+        if (valueSource) {
+            const textDecorations = valueSource.textDecoration;
+            const underline = textDecorations.indexOf(TextDecoration.UNDERLINE) !== -1;
+            if (underline) {
+                attrDict[NSUnderlineStyleAttributeName] = underline;
+            }
+
+            const strikethrough = textDecorations.indexOf(TextDecoration.LINE_THROUGH) !== -1;
+            if (strikethrough) {
+                attrDict[NSStrikethroughStyleAttributeName] = strikethrough;
+            }
+        }
+
+        return NSMutableAttributedString.alloc().initWithStringAttributes(text, <any>attrDict);
+    }
 }
 
 export function getTransformedText(text: string, textTransform: TextTransform): string {
@@ -184,172 +354,9 @@ function NSStringFromNSAttributedString(source: NSAttributedString | string): NS
     return NSString.stringWithString(source instanceof NSAttributedString && source.string || <string>source);
 }
 
-function setFormattedTextDecorationAndTransform(formattedText: FormattedString, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number) {
-    const attrText = createNSMutableAttributedString(formattedText);
-    if (letterSpacing !== 0) {
-        attrText.addAttributeValueRange(NSKernAttributeName, letterSpacing * nativeView.font.pointSize, { location: 0, length: attrText.length });
-    }
-
-    if (nativeView instanceof UIButton) {
-        nativeView.setAttributedTitleForState(attrText, UIControlState.Normal);
-    }
-    else {
-        nativeView.attributedText = attrText;
-    }
-}
-
-function setTextDecorationAndTransform(text: string, nativeView: UITextField | UITextView | UILabel | UIButton, textDecoration: TextDecoration, textTransform: TextTransform, letterSpacing: number, color: Color) {
-    let dict = new Map<string, number>();
-    switch (textDecoration) {
-        case TextDecoration.NONE:
-            break;
-        case TextDecoration.UNDERLINE:
-            dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
-            break;
-        case TextDecoration.LINE_THROUGH:
-            dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
-            break;
-        case TextDecoration.UNDERLINE_LINE_THROUGH:
-            dict.set(NSUnderlineStyleAttributeName, NSUnderlineStyle.StyleSingle);
-            dict.set(NSStrikethroughStyleAttributeName, NSUnderlineStyle.StyleSingle);
-            break;
-        default:
-            throw new Error(`Invalid text decoration value: ${textDecoration}. Valid values are: "${TextDecoration.NONE}", "${TextDecoration.UNDERLINE}", "${TextDecoration.LINE_THROUGH}", "${TextDecoration.UNDERLINE_LINE_THROUGH}".`);
-    }
-
-    if (letterSpacing !== 0) {
-        dict.set(NSKernAttributeName, letterSpacing * nativeView.font.pointSize);
-    }
-
-    if (color) {
-        dict.set(NSForegroundColorAttributeName, color.ios);
-    }
-
-    let source = getTransformedText(text, textTransform);
-    if (dict.size > 0) {
-        let result = NSMutableAttributedString.alloc().initWithString(source);
-        result.setAttributesRange(<any>dict, { location: 0, length: source.length });
-        if (nativeView instanceof UIButton) {
-            nativeView.setAttributedTitleForState(result, UIControlState.Normal);
-        } else {
-            nativeView.attributedText = result;
-        }
-    } else {
-        if (nativeView instanceof UIButton) {
-            // Clear attributedText or title won't be affected.
-            nativeView.setAttributedTitleForState(null, UIControlState.Normal);
-            nativeView.setTitleForState(source, UIControlState.Normal);
-        } else {
-            // Clear attributedText or text won't be affected.
-            nativeView.attributedText = undefined;
-            nativeView.text = source;
-        }
-    }
-}
-
-function createNSMutableAttributedString(formattedString: FormattedString): NSMutableAttributedString {
-    let mas = NSMutableAttributedString.alloc().init();
-    if (formattedString) {
-        for (let i = 0, spanStart = 0, length = formattedString.spans.length; i < length; i++) {
-            const span = formattedString.spans.getItem(i);
-            const text = span.text;
-            const textTransform = (<TextBase>formattedString.parent).textTransform;
-            let spanText = (text === null || text === undefined) ? '' : text.toString();
-            if (textTransform) {
-                spanText = getTransformedText(spanText, textTransform);
-            }
-
-            const nsAttributedString = createMutableStringForSpan(span, spanText);
-            mas.insertAttributedStringAtIndex(nsAttributedString, spanStart);
-            spanStart += spanText.length;
-        }
-    }
-    return mas;
-}
-
 function isBold(fontWeight: FontWeight): boolean {
     return fontWeight === FontWeight.BOLD
         || fontWeight === "700"
         || fontWeight === FontWeight.EXTRA_BOLD
         || fontWeight === FontWeight.BLACK;
-}
-
-function createMutableStringForSpan(span: Span, text: string): NSMutableAttributedString {
-    let attrDict = <{ key: string, value: any }>{};
-    const style = span.style;
-    const bold = isBold(style.fontWeight);
-    const italic = style.fontStyle === FontStyle.ITALIC;
-
-    let fontFamily = span.fontFamily;
-    let fontSize = span.fontSize;
-
-    if (bold || italic || fontFamily || fontSize) {
-        let font;
-        if (fontFamily) {
-            if (!fontSize) {
-                fontSize = utils.ios.getter(UIFont, UIFont.systemFontSize);
-            }
-
-            font = UIFont.fontWithNameSize(fontFamily, fontSize);
-        }
-
-        if (!font) {
-            const fontDescriptor = UIFontDescriptor.new();
-            let symbolicTraits;
-            if (bold) {
-                symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitBold;
-            }
-
-            if (italic) {
-                symbolicTraits |= UIFontDescriptorSymbolicTraits.TraitItalic;
-            }
-
-            if (symbolicTraits) {
-                font = UIFont.fontWithDescriptorSize(fontDescriptor.fontDescriptorWithSymbolicTraits(symbolicTraits), fontSize);
-            } else {
-                font = UIFont.fontWithDescriptorSize(fontDescriptor, fontSize);
-            }
-        }
-
-        attrDict[NSFontAttributeName] = font;
-    }
-
-    const color = span.color;
-    if (color) {
-        attrDict[NSForegroundColorAttributeName] = color.ios;
-    }
-
-    // We don't use isSet function here because defaultValue for backgroundColor is null.
-    const backgroundColor = style.backgroundColor
-        || (<FormattedString>span.parent).backgroundColor
-        || (<TextBase>(<FormattedString>span.parent).parent).backgroundColor;
-    if (backgroundColor) {
-        attrDict[NSBackgroundColorAttributeName] = backgroundColor.ios;
-    }
-
-    let valueSource: typeof style;
-    if (isSet(textDecorationProperty, style)) {
-        valueSource = style;
-    } else if (isSet(textDecorationProperty, span.parent.style)) {
-        // span.parent is FormattedString
-        valueSource = span.parent.style;
-    } else if (isSet(textDecorationProperty, span.parent.parent.style)) {
-        // span.parent.parent is TextBase
-        valueSource = span.parent.parent.style;
-    }
-
-    if (valueSource) {
-        const textDecorations = valueSource.textDecoration;
-        const underline = textDecorations.indexOf(TextDecoration.UNDERLINE) !== -1;
-        if (underline) {
-            attrDict[NSUnderlineStyleAttributeName] = underline;
-        }
-
-        const strikethrough = textDecorations.indexOf(TextDecoration.LINE_THROUGH) !== -1;
-        if (strikethrough) {
-            attrDict[NSStrikethroughStyleAttributeName] = strikethrough;
-        }
-    }
-
-    return NSMutableAttributedString.alloc().initWithStringAttributes(text, <any>attrDict);
 }
\ No newline at end of file