From a6ab11a60bcfd59580836593b14a4f1ec3f7aae6 Mon Sep 17 00:00:00 2001
From: Vladimir Enchev <vladimir.enchev@telerik.com>
Date: Fri, 13 Nov 2015 17:18:44 +0200
Subject: [PATCH] text-transform added

---
 apps/tests/TKUnit.ts                          |   4 +-
 apps/tests/ui/style/style-properties-tests.ts | 164 ++++++++++++++++--
 apps/ui-tests-app/css/text-transform.ts       |  18 ++
 apps/ui-tests-app/css/text-transform.xml      |  32 ++++
 apps/ui-tests-app/mainPage.ts                 |   1 +
 tsconfig.json                                 |   1 +
 .../editable-text-base.android.ts             |  10 +-
 ui/enums/enums.d.ts                           |  25 +++
 ui/enums/enums.ts                             |   7 +
 ui/styling/converters.ts                      |  12 ++
 ui/styling/style.d.ts                         |   2 +
 ui/styling/style.ts                           |  20 +++
 ui/styling/stylers.android.ts                 |  62 +++++++
 ui/styling/stylers.ios.ts                     | 113 +++++++++++-
 ui/styling/styling.d.ts                       |   2 +
 ui/text-base/text-base.ts                     |   2 +
 ui/text-field/text-field.ios.ts               |   1 +
 ui/text-view/text-view.ios.ts                 |   5 +
 18 files changed, 465 insertions(+), 16 deletions(-)
 create mode 100644 apps/ui-tests-app/css/text-transform.ts
 create mode 100644 apps/ui-tests-app/css/text-transform.xml

diff --git a/apps/tests/TKUnit.ts b/apps/tests/TKUnit.ts
index f8ecf7cfe..0ec900df9 100644
--- a/apps/tests/TKUnit.ts
+++ b/apps/tests/TKUnit.ts
@@ -202,8 +202,8 @@ export function assertNotEqual(actual: any, expected: any, message?: string) {
 }
 
 export function assertEqual(actual: any, expected: any, message?: string) {
-    if (!types.isUndefined(actual)
-        && !types.isUndefined(expected)
+    if (!types.isNullOrUndefined(actual)
+        && !types.isNullOrUndefined(expected)
         && types.getClass(actual) === types.getClass(expected)
         && types.isFunction(actual.equals)) {
 
diff --git a/apps/tests/ui/style/style-properties-tests.ts b/apps/tests/ui/style/style-properties-tests.ts
index 2d36fe321..b37cabe4c 100644
--- a/apps/tests/ui/style/style-properties-tests.ts
+++ b/apps/tests/ui/style/style-properties-tests.ts
@@ -2,6 +2,8 @@
 import helper = require("../helper");
 import buttonModule = require("ui/button");
 import labelModule = require("ui/label");
+import textFieldModule = require("ui/text-field");
+import textViewModule = require("ui/text-view");
 import stackModule = require("ui/layouts/stack-layout");
 import page = require("ui/page");
 import color = require("color");
@@ -40,6 +42,10 @@ export function test_setting_textDecoration_property_from_CSS_is_applied_to_Styl
     test_property_from_CSS_is_applied_to_style("textDecoration", "text-decoration", "underline");
 }
 
+export function test_setting_textTransform_property_from_CSS_is_applied_to_Style() {
+    test_property_from_CSS_is_applied_to_style("textTransform", "text-transform", "uppercase");
+}
+
 export function test_setting_whiteSpace_property_from_CSS_is_applied_to_Style() {
     test_property_from_CSS_is_applied_to_style("whiteSpace", "white-space", "nowrap");
 }
@@ -281,6 +287,32 @@ export function test_setting_different_textDecoration_triggers_property_change()
     TKUnit.assert(changed, "Property changed not triggered.");
 }
 
+export function test_setting_same_textTransform_does_not_trigger_property_change() {
+    var testView = new buttonModule.Button();
+    testView.style.textTransform = "uppercase";
+
+    var changed = false;
+    testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+        changed = true;
+    });
+
+    testView.style.textTransform = "uppercase";
+    TKUnit.assert(!changed, "Property changed triggered.");
+}
+
+export function test_setting_different_textTransform_triggers_property_change() {
+    var testView = new buttonModule.Button();
+    testView.style.textTransform = "uppercase";
+
+    var changed = false;
+    testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+        changed = true;
+    });
+
+    testView.style.textTransform = "none";
+    TKUnit.assert(changed, "Property changed not triggered.");
+}
+
 export function test_setting_same_whiteSpace_does_not_trigger_property_change() {
     var testView = new buttonModule.Button();
     testView.style.whiteSpace = "normal";
@@ -376,7 +408,7 @@ export function test_setting_font_shorthand_property() {
     test_font_shorthand_property("normal normal normal 15px/30px Arial", "Arial", 15, "normal", "normal");
 }
 
-function test_font_shorthand_property(short: string, family: string, size: number, style: string, weight:string) {
+function test_font_shorthand_property(short: string, family: string, size: number, style: string, weight: string) {
     var testView = new buttonModule.Button();
     (<any>testView.style)["font"] = short;
 
@@ -411,16 +443,13 @@ function test_native_font(style: string, weight: string) {
     testView.style.fontWeight = weight;
     testView.style.fontStyle = style;
 
-    if (style === enums.FontStyle.normal && weight === enums.FontWeight.normal)
-    {
+    if (style === enums.FontStyle.normal && weight === enums.FontWeight.normal) {
         fontNameSuffix += "Regular";
     }
-    if (weight === enums.FontWeight.bold)
-    {
+    if (weight === enums.FontWeight.bold) {
         fontNameSuffix += "Bold";
     }
-    if (style === enums.FontStyle.italic)
-    {
+    if (style === enums.FontStyle.italic) {
         fontNameSuffix += "Italic";
     }
 
@@ -435,13 +464,12 @@ export var test_setting_button_whiteSpace_normal_sets_native = function () {
     testView.style.whiteSpace = "nowrap";
 
     helper.buildUIAndRunTest(testView, function (views: Array<viewModule.View>) {
-
         if (platform.device.os === platform.platformNames.android) {
             TKUnit.assertEqual((<android.widget.Button>testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END);
         } else if (platform.device.os === platform.platformNames.ios) {
             TKUnit.assertEqual((<UIButton>testView.ios).titleLabel.lineBreakMode, NSLineBreakMode.NSLineBreakByTruncatingMiddle);
             TKUnit.assertEqual((<UIButton>testView.ios).titleLabel.numberOfLines, 1);
-       }
+        }
     });
 }
 
@@ -450,7 +478,6 @@ export var test_setting_label_whiteSpace_normal_sets_native = function () {
     testView.style.whiteSpace = "nowrap";
 
     helper.buildUIAndRunTest(testView, function (views: Array<viewModule.View>) {
-
         if (platform.device.os === platform.platformNames.android) {
             TKUnit.assertEqual((<android.widget.TextView>testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END);
         } else if (platform.device.os === platform.platformNames.ios) {
@@ -465,7 +492,6 @@ export var test_setting_button_whiteSpace_nowrap_sets_native = function () {
     testView.style.whiteSpace = "normal";
 
     helper.buildUIAndRunTest(testView, function (views: Array<viewModule.View>) {
-
         if (platform.device.os === platform.platformNames.android) {
             TKUnit.assertNull((<android.widget.Button>testView.android).getEllipsize(), null);
         } else if (platform.device.os === platform.platformNames.ios) {
@@ -480,7 +506,6 @@ export var test_setting_label_whiteSpace_nowrap_sets_native = function () {
     testView.style.whiteSpace = "normal";
 
     helper.buildUIAndRunTest(testView, function (views: Array<viewModule.View>) {
-
         if (platform.device.os === platform.platformNames.android) {
             TKUnit.assertNull((<android.widget.TextView>testView.android).getEllipsize(), null);
         } else if (platform.device.os === platform.platformNames.ios) {
@@ -489,3 +514,118 @@ export var test_setting_label_whiteSpace_nowrap_sets_native = function () {
         }
     });
 }
+
+var initial = "text Text";
+var capitalized = "Text Text";
+var upper = "TEXT TEXT";
+var lower = "text text";
+
+function executeTransformTest(testView: viewModule.View, androidTextFunc: (testView: viewModule.View) => string, iOSTextFunc: (testView: viewModule.View) => string) {
+    helper.buildUIAndRunTest(testView, function (views: Array<viewModule.View>) {
+        if (platform.device.os === platform.platformNames.android) {
+            TKUnit.assertEqual(androidTextFunc(testView) + "", capitalized);
+        } else if (platform.device.os === platform.platformNames.ios) {
+            TKUnit.assertEqual(iOSTextFunc(testView), capitalized);
+        }
+
+        testView.style.textTransform = enums.TextTransform.uppercase;
+
+        if (platform.device.os === platform.platformNames.android) {
+            TKUnit.assertEqual(androidTextFunc(testView) + "", upper);
+        } else if (platform.device.os === platform.platformNames.ios) {
+            TKUnit.assertEqual(iOSTextFunc(testView), upper);
+        }
+
+        testView.style.textTransform = enums.TextTransform.lowercase;
+
+        if (platform.device.os === platform.platformNames.android) {
+            TKUnit.assertEqual(androidTextFunc(testView) + "", lower);
+        } else if (platform.device.os === platform.platformNames.ios) {
+            TKUnit.assertEqual(iOSTextFunc(testView), lower);
+        }
+
+        testView.style.textTransform = enums.TextTransform.none;
+
+        if (platform.device.os === platform.platformNames.android) {
+            TKUnit.assertEqual(androidTextFunc(testView) + "", initial);
+        } else if (platform.device.os === platform.platformNames.ios) {
+            TKUnit.assertEqual(iOSTextFunc(testView), initial);
+        }
+    });
+}
+
+function androidText(testView: viewModule.View) {
+    return (<android.widget.TextView>testView.android).getText();;
+}
+
+function iOSText(testView: viewModule.View) {
+    return (<UITextView | UILabel | UITextField>testView.ios).attributedText.string;
+}
+
+export var test_setting_label_textTransform_sets_native = function () {
+    var testView = new labelModule.Label();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_textField_textTransform_sets_native = function () {
+    var testView = new textFieldModule.TextField();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_textView_textTransform_sets_native = function () {
+    var testView = new textViewModule.TextView();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_button_textTransform_sets_native = function () {
+    var testView = new buttonModule.Button();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+
+    executeTransformTest(testView, androidText, function (v) { return (<UIButton>v.ios).attributedTitleForState(UIControlState.UIControlStateNormal).string; });
+}
+
+export var test_setting_label_textTransform_and_textDecoration_sets_native = function () {
+    var testView = new labelModule.Label();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+    testView.style.textDecoration = enums.TextDecoration.underline;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_textField_textTransform_and_textDecoration_sets_native = function () {
+    var testView = new textFieldModule.TextField();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+    testView.style.textDecoration = enums.TextDecoration.underline;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_textView_textTransform_and_textDecoration_sets_native = function () {
+    var testView = new textViewModule.TextView();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+    testView.style.textDecoration = enums.TextDecoration.underline;
+
+    executeTransformTest(testView, androidText, iOSText);
+}
+
+export var test_setting_button_textTransform_and_textDecoration_sets_native = function () {
+    var testView = new buttonModule.Button();
+    testView.text = initial;
+    testView.style.textTransform = enums.TextTransform.capitalize;
+    testView.style.textDecoration = enums.TextDecoration.underline;
+
+    executeTransformTest(testView, androidText, function (v) { return (<UIButton>v.ios).attributedTitleForState(UIControlState.UIControlStateNormal).string; });
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/text-transform.ts b/apps/ui-tests-app/css/text-transform.ts
new file mode 100644
index 000000000..b11603348
--- /dev/null
+++ b/apps/ui-tests-app/css/text-transform.ts
@@ -0,0 +1,18 @@
+import view = require("ui/core/view");
+import observable = require("data/observable");
+import label = require("ui/label");
+
+export function butonTap(args) {
+    var btn = <view.View>args.object;
+    var lbl = <label.Label>btn.parent.getViewById("Label1");
+
+    if (lbl.style.textTransform === "none") {
+        lbl.style.textTransform = "uppercase";
+    } else if (lbl.style.textTransform === "uppercase") {
+        lbl.style.textTransform = "lowercase";
+    } else if (lbl.style.textTransform === "lowercase") {
+        lbl.style.textTransform = "capitalize";
+    } else if (lbl.style.textTransform === "capitalize") {
+        lbl.style.textTransform = "none";
+    }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/text-transform.xml b/apps/ui-tests-app/css/text-transform.xml
new file mode 100644
index 000000000..24190cb40
--- /dev/null
+++ b/apps/ui-tests-app/css/text-transform.xml
@@ -0,0 +1,32 @@
+<Page >
+  <ScrollView>
+    <StackLayout>
+      <Button text="Change" tap="butonTap" />
+      <Label id="Label1" text="text Text" style="text-transform:none" />
+
+      <Label text="label label" style="text-transform:none" />
+      <Label text="label label" style="text-transform:capitalize" />
+      <Label text="label label" style="text-transform:uppercase" />
+      <Label text="label label" style="text-transform:lowercase" />
+
+      <TextField text="textField textField" style="text-transform:none" />
+      <TextField text="textField textField" style="text-transform:capitalize" />
+      <TextField text="textField textField" style="text-transform:uppercase;" />
+      <TextField text="textField textField" style="text-transform:lowercase" />
+      <TextField text="textField textField" style="text-transform:uppercase; text-decoration:underline;" />
+
+      <TextView text="textView textView" style="text-transform:none" />
+      <TextView text="textView textView" style="text-transform:capitalize" />
+      <TextView text="textView textView" style="text-transform:uppercase" />
+      <TextView text="textView textView" style="text-transform:lowercase" />
+      <TextView text="textView textView" style="text-transform:uppercase; text-decoration:underline;" />
+
+      <Button text="button Button" style="text-transform:none" />
+      <Button text="button Button" style="text-transform:capitalize" />
+      <Button text="button Button" style="text-transform:uppercase" />
+      <Button text="button Button" style="text-transform:lowercase" />
+      <Button text="button Button" style="text-transform:uppercase; text-decoration:underline;" />
+
+    </StackLayout>
+  </ScrollView>
+</Page>
\ No newline at end of file
diff --git a/apps/ui-tests-app/mainPage.ts b/apps/ui-tests-app/mainPage.ts
index 96db5a781..7b1598605 100644
--- a/apps/ui-tests-app/mainPage.ts
+++ b/apps/ui-tests-app/mainPage.ts
@@ -91,5 +91,6 @@ examples.set("webtest", "web-view/web-view-test");
 
 examples.set("decoration", "css/text-decoration");
 examples.set("whitespace", "css/white-space");
+examples.set("transform", "css/text-transform");
 
 //VM.set("selected", "tabAll");
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index f56083587..77f5d22f9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -334,6 +334,7 @@
         "apps/ui-tests-app/css/background.ts",
         "apps/ui-tests-app/css/styles.ts",
         "apps/ui-tests-app/css/text-decoration.ts",
+        "apps/ui-tests-app/css/text-transform.ts",
         "apps/ui-tests-app/css/white-space.ts",
         "apps/ui-tests-app/dialogs/dialogs.ts",
         "apps/ui-tests-app/dialogs/view-model.ts",
diff --git a/ui/editable-text-base/editable-text-base.android.ts b/ui/editable-text-base/editable-text-base.android.ts
index 522c11118..5c37deaae 100644
--- a/ui/editable-text-base/editable-text-base.android.ts
+++ b/ui/editable-text-base/editable-text-base.android.ts
@@ -30,7 +30,15 @@ export class EditableTextBase extends common.EditableTextBase {
                 //
             },
             onTextChanged: function (text: string, start: number, before: number, count: number) {
-                //
+                var owner = that.get();
+                if (!owner) {
+                    return;
+                }
+                var selectionStart = owner.android.getSelectionStart();
+                owner.android.removeTextChangedListener(textWatcher);
+                owner.style._updateTextTransform();
+                owner.android.addTextChangedListener(textWatcher);
+                owner.android.setSelection(selectionStart);
             },
             afterTextChanged: function (editable: android.text.IEditable) {
                 var owner = that.get();
diff --git a/ui/enums/enums.d.ts b/ui/enums/enums.d.ts
index 60f7731c7..451419da7 100644
--- a/ui/enums/enums.d.ts
+++ b/ui/enums/enums.d.ts
@@ -438,6 +438,31 @@
         export var lineThrough: string;
     }
 
+    /**
+     * Specifies different text transforms.
+     */
+    export module TextTransform {
+        /**
+         * No transform.
+         */
+        export var none: string;
+        
+        /**
+         * Text transform capitalize.
+         */
+        export var capitalize: string;
+
+        /**
+         * Text transform uppercase.
+         */
+        export var uppercase: string;
+        
+        /**
+         * Text transform lowercase.
+         */
+        export var lowercase: string;
+    }
+
     /**
      * Specifies different white spaces.
      */
diff --git a/ui/enums/enums.ts b/ui/enums/enums.ts
index cebbe7b7b..37f45987f 100644
--- a/ui/enums/enums.ts
+++ b/ui/enums/enums.ts
@@ -26,6 +26,13 @@ export module TextDecoration {
     export var lineThrough = "line-through";
 }
 
+export module TextTransform {
+    export var none = "none";
+    export var capitalize = "capitalize";
+    export var uppercase = "uppercase";
+    export var lowercase = "lowercase";
+}
+
 export module WhiteSpace {
     export var normal = "normal";
     export var nowrap = "nowrap";
diff --git a/ui/styling/converters.ts b/ui/styling/converters.ts
index 5c117c40b..d16c0ccb7 100644
--- a/ui/styling/converters.ts
+++ b/ui/styling/converters.ts
@@ -42,6 +42,18 @@ export function whiteSpaceConverter(value: string): string {
     }
 }
 
+export function textTransformConverter(value: string): string {
+    switch (value) {
+        case enums.TextTransform.none:
+        case enums.TextTransform.uppercase:
+        case enums.TextTransform.lowercase:
+        case enums.TextTransform.capitalize:
+            return value;
+        default:
+            throw new Error("CSS text-transform \"" + value + "\" is not supported.");
+    }
+}
+
 export var numberConverter = parseFloat;
 
 export function visibilityConverter(value: string): string {
diff --git a/ui/styling/style.d.ts b/ui/styling/style.d.ts
index e34f6f3b0..d98e5189a 100644
--- a/ui/styling/style.d.ts
+++ b/ui/styling/style.d.ts
@@ -45,6 +45,7 @@ declare module "ui/styling/style" {
         public font: string;
         public textAlignment: string;
         public textDecoration: string;
+        public textTransform: string;
         public minWidth: number;
         public minHeight: number;
         public width: number;
@@ -75,6 +76,7 @@ declare module "ui/styling/style" {
         public _inheritStyleProperties(): void;
         public _boundsChanged(): void;
         public _updateTextDecoration(): void;
+        public _updateTextTransform(): void;
     }
 
     export function registerHandler(property: Property, handler: styling.stylers.StylePropertyChangedHandler, className?: string);
diff --git a/ui/styling/style.ts b/ui/styling/style.ts
index aba3c8856..89c5f38ef 100644
--- a/ui/styling/style.ts
+++ b/ui/styling/style.ts
@@ -245,6 +245,10 @@ function isTextDecorationValid(value: string): boolean {
     return values.indexOf(enums.TextDecoration.none) !== -1 || values.indexOf(enums.TextDecoration.underline) !== -1 || values.indexOf(enums.TextDecoration.lineThrough) !== -1;
 }
 
+function isTextTransformValid(value: string): boolean {
+    return value === enums.TextTransform.none || value === enums.TextTransform.uppercase || value === enums.TextTransform.lowercase || value === enums.TextTransform.capitalize;
+}
+
 function isWhiteSpaceValid(value: string): boolean {
     return value === enums.WhiteSpace.nowrap || value === enums.WhiteSpace.normal;
 }
@@ -553,6 +557,13 @@ export class Style extends DependencyObservable implements styling.Style {
         this._setValue(textDecorationProperty, value);
     }
 
+    get textTransform(): string {
+        return this._getValue(textTransformProperty);
+    }
+    set textTransform(value: string) {
+        this._setValue(textTransformProperty, value);
+    }
+
     get whiteSpace(): string {
         return this._getValue(whiteSpaceProperty);
     }
@@ -566,6 +577,12 @@ export class Style extends DependencyObservable implements styling.Style {
         }
     }
 
+    public _updateTextTransform() {
+        if (this._getValue(textTransformProperty) !== enums.TextTransform.none) {
+            this._applyProperty(textTransformProperty, this._getValue(textTransformProperty));
+        }
+    }
+
     constructor(parentView: View) {
         super();
         this._view = parentView;
@@ -821,6 +838,9 @@ export var opacityProperty = new styleProperty.Property("opacity", "opacity",
 export var textDecorationProperty = new styleProperty.Property("textDecoration", "text-decoration",
     new PropertyMetadata(enums.TextDecoration.none, PropertyMetadataSettings.None, undefined, isTextDecorationValid), converters.textDecorationConverter);
 
+export var textTransformProperty = new styleProperty.Property("textTransform", "text-transform",
+    new PropertyMetadata(enums.TextTransform.none, PropertyMetadataSettings.None, undefined, isTextTransformValid), converters.textTransformConverter);
+
 export var whiteSpaceProperty = new styleProperty.Property("whiteSpace", "white-space",
     new PropertyMetadata(undefined, AffectsLayout, undefined, isWhiteSpaceValid), converters.whiteSpaceConverter);
 
diff --git a/ui/styling/stylers.android.ts b/ui/styling/stylers.android.ts
index 450b0d789..e50634d79 100644
--- a/ui/styling/stylers.android.ts
+++ b/ui/styling/stylers.android.ts
@@ -438,6 +438,15 @@ export class TextViewStyler implements definition.stylers.Styler {
         setTextDecoration(view._nativeView, enums.TextDecoration.none);
     }
 
+    // text-transform
+    private static setTextTransformProperty(view: view.View, newValue: any) {
+        setTextTransform(view._nativeView, newValue);
+    }
+
+    private static resetTextTransformProperty(view: view.View, nativeValue: any) {
+        setTextTransform(view._nativeView, enums.TextTransform.none);
+    }
+
     // white-space
     private static setWhiteSpaceProperty(view: view.View, newValue: any) {
         setWhiteSpace(view._nativeView, newValue);
@@ -467,6 +476,10 @@ export class TextViewStyler implements definition.stylers.Styler {
             TextViewStyler.setTextDecorationProperty,
             TextViewStyler.resetTextDecorationProperty), "TextBase");
 
+        style.registerHandler(style.textTransformProperty, new stylersCommon.StylePropertyChangedHandler(
+            TextViewStyler.setTextTransformProperty,
+            TextViewStyler.resetTextTransformProperty), "TextBase");
+
         style.registerHandler(style.whiteSpaceProperty, new stylersCommon.StylePropertyChangedHandler(
             TextViewStyler.setWhiteSpaceProperty,
             TextViewStyler.resetWhiteSpaceProperty), "TextBase");
@@ -492,6 +505,10 @@ export class TextViewStyler implements definition.stylers.Styler {
             TextViewStyler.setTextDecorationProperty,
             TextViewStyler.resetTextDecorationProperty), "Button");
 
+        style.registerHandler(style.textTransformProperty, new stylersCommon.StylePropertyChangedHandler(
+            TextViewStyler.setTextTransformProperty,
+            TextViewStyler.resetTextTransformProperty), "Button");
+
         style.registerHandler(style.whiteSpaceProperty, new stylersCommon.StylePropertyChangedHandler(
             TextViewStyler.setWhiteSpaceProperty,
             TextViewStyler.resetWhiteSpaceProperty), "Button");
@@ -518,6 +535,51 @@ function setTextDecoration(view: android.widget.TextView, value: string) {
     }   
 }
 
+function setTextTransform(view: android.widget.TextView, value: string) {
+    let str = view.getText() + "";
+    let result: string;
+
+    switch (value) {
+        case enums.TextTransform.none:
+        default:
+            result = view["originalString"] || str;
+            if (view["transformationMethod"]) {
+                view.setTransformationMethod(view["transformationMethod"]);
+            }
+            break;
+        case enums.TextTransform.uppercase:
+            view.setTransformationMethod(null);
+            result = str.toUpperCase();
+            break;
+        case enums.TextTransform.lowercase:
+            view.setTransformationMethod(null);
+            result = str.toLowerCase();
+            break;
+        case enums.TextTransform.capitalize:
+            view.setTransformationMethod(null);
+            result = getCapitalizedString(str);
+            break;
+    }
+
+    if (!view["originalString"]) {
+        view["originalString"] = str;
+        view["transformationMethod"] = view.getTransformationMethod();
+    }
+
+    view.setText(result);
+}
+
+function getCapitalizedString(str: string): string {
+    var words = str.split(" ");
+    var newWords = [];
+    for (let i = 0; i < words.length; i++) {
+        let word = words[i];
+        newWords.push(word.substr(0, 1).toUpperCase() + word.substring(1));
+    }
+
+    return newWords.join(" ");
+}
+
 function setWhiteSpace(view: android.widget.TextView, value: string) {
     view.setSingleLine(value === enums.WhiteSpace.nowrap);
     view.setEllipsize(value === enums.WhiteSpace.nowrap ? android.text.TextUtils.TruncateAt.END : null);
diff --git a/ui/styling/stylers.ios.ts b/ui/styling/stylers.ios.ts
index 0553b6477..52a97459a 100644
--- a/ui/styling/stylers.ios.ts
+++ b/ui/styling/stylers.ios.ts
@@ -16,7 +16,7 @@ interface TextUIView {
     font: UIFont;
     textAlignment: number;
     textColor: UIColor;
-    text : string;
+    text: string;
     attributedText: NSAttributedString;
     lineBreakMode: number;
     numberOfLines: number;
@@ -266,6 +266,15 @@ export class ButtonStyler implements definition.stylers.Styler {
         setTextDecoration((<UIButton>view.ios).titleLabel, enums.TextDecoration.none);
     }
 
+    // text-transform
+    private static setTextTransformProperty(view: view.View, newValue: any) {
+        setTextTransform(view.ios, newValue);
+    }
+
+    private static resetTextTransformProperty(view: view.View, nativeValue: any) {
+        setTextTransform(view.ios, enums.TextTransform.none);
+    }
+
     // white-space
     private static setWhiteSpaceProperty(view: view.View, newValue: any) {
         setWhiteSpace((<UIButton>view.ios).titleLabel, newValue, view.ios);
@@ -299,6 +308,10 @@ export class ButtonStyler implements definition.stylers.Styler {
             ButtonStyler.setTextDecorationProperty,
             ButtonStyler.resetTextDecorationProperty), "Button");
 
+        style.registerHandler(style.textTransformProperty, new stylersCommon.StylePropertyChangedHandler(
+            ButtonStyler.setTextTransformProperty,
+            ButtonStyler.resetTextTransformProperty), "Button");
+
         style.registerHandler(style.whiteSpaceProperty, new stylersCommon.StylePropertyChangedHandler(
             ButtonStyler.setWhiteSpaceProperty,
             ButtonStyler.resetWhiteSpaceProperty), "Button");
@@ -346,6 +359,15 @@ export class TextBaseStyler implements definition.stylers.Styler {
         setTextDecoration(view._nativeView, enums.TextDecoration.none);
     }
 
+    // text-transform
+    private static setTextTransformProperty(view: view.View, newValue: any) {
+        setTextTransform(view._nativeView, newValue);
+    }
+
+    private static resetTextTransformProperty(view: view.View, nativeValue: any) {
+        setTextTransform(view._nativeView, enums.TextTransform.none);
+    }
+
     // white-space
     private static setWhiteSpaceProperty(view: view.View, newValue: any) {
         setWhiteSpace(view._nativeView, newValue);
@@ -391,6 +413,10 @@ export class TextBaseStyler implements definition.stylers.Styler {
             TextBaseStyler.setTextDecorationProperty,
             TextBaseStyler.resetTextDecorationProperty), "TextBase");
 
+        style.registerHandler(style.textTransformProperty, new stylersCommon.StylePropertyChangedHandler(
+            TextBaseStyler.setTextTransformProperty,
+            TextBaseStyler.resetTextTransformProperty), "TextBase");
+
         style.registerHandler(style.whiteSpaceProperty, new stylersCommon.StylePropertyChangedHandler(
             TextBaseStyler.setWhiteSpaceProperty,
             TextBaseStyler.resetWhiteSpaceProperty), "TextBase");
@@ -957,6 +983,91 @@ function setTextDecoration(view: TextUIView, value: string) {
     }
 }
 
+function setTextTransform(view: TextUIView, value: string) {
+    let str = getNSStringFromView(view);
+    let result: string;
+
+    switch (value) {
+        case enums.TextTransform.none:
+        default:
+            result = view["originalString"] || str;
+            break;
+        case enums.TextTransform.uppercase:
+            result = str.uppercaseString;
+            break;
+        case enums.TextTransform.lowercase:
+            result = str.lowercaseString;
+            break;
+        case enums.TextTransform.capitalize:
+            result = str.capitalizedString;
+            break;
+    }
+
+    if (!view["originalString"]) {
+        view["originalString"] = str;
+    }
+
+    let newStr = getAttributedStringFromView(view, result);
+
+    if (newStr) {
+        setAttributedStringToView(view, newStr);
+    } else {
+        setStringToView(view, result);
+    }
+}
+
+function getNSStringFromView(view: any): NSString {
+    let result: string;
+
+    if (view instanceof UIButton) {
+        let attrTitle = (<UIButton>view).titleLabel.attributedText;
+        result = attrTitle ? attrTitle.string : (<UIButton>view).titleLabel.text;
+    }
+    else {
+        let attrText = (<UITextView>view).attributedText;
+        result = attrText ? attrText.string : (<UITextView>view).text;
+    }
+
+    return NSString.alloc().initWithString(result || "");
+}
+
+function setStringToView(view: any, str: string) {
+    if (view instanceof UIButton) {
+        (<UIButton>view).setTitleForState(str, UIControlState.UIControlStateNormal);
+    }
+    else {
+        (<TextUIView>view).text = str;
+    }
+}
+
+function getAttributedStringFromView(view: any, value: string): NSMutableAttributedString {
+    let result: NSMutableAttributedString;
+
+    if (view instanceof UIButton) {
+        let attrTitle = (<UIButton>view).titleLabel.attributedText;
+        if (attrTitle) {
+            result = NSMutableAttributedString.alloc().initWithAttributedString(attrTitle);
+        }
+    } else if (view.attributedText) {
+        result = NSMutableAttributedString.alloc().initWithAttributedString(view.attributedText);
+    }
+
+    if (result) {
+        result.replaceCharactersInRangeWithString({ location: 0, length: result.length }, value);
+    }
+
+    return result;
+}
+
+function setAttributedStringToView(view: any, str: NSMutableAttributedString) {
+    if (view instanceof UIButton) {
+        (<UIButton>view).setAttributedTitleForState(str, UIControlState.UIControlStateNormal);
+    }
+    else {
+        (<TextUIView>view).attributedText = str;
+    }
+}
+
 function setWhiteSpace(view: TextUIView, value: string, parentView?: UIView) {
     if (value === enums.WhiteSpace.normal) {
         view.lineBreakMode = NSLineBreakMode.NSLineBreakByWordWrapping;
diff --git a/ui/styling/styling.d.ts b/ui/styling/styling.d.ts
index 29e75f14b..4cddee576 100644
--- a/ui/styling/styling.d.ts
+++ b/ui/styling/styling.d.ts
@@ -199,6 +199,7 @@
         opacity: number;
 
         textDecoration: string;
+        textTransform: string;
         whiteSpace: string;
 
         //@private
@@ -209,6 +210,7 @@
         public _inheritStyleProperty(property: dependencyObservable.Property): void;
         public _inheritStyleProperties(): void;
         public _updateTextDecoration(): void;
+        public _updateTextTransform(): void;
         //@endprivate
     }
 
diff --git a/ui/text-base/text-base.ts b/ui/text-base/text-base.ts
index ad6a06971..f2dff19af 100644
--- a/ui/text-base/text-base.ts
+++ b/ui/text-base/text-base.ts
@@ -96,6 +96,7 @@ export class TextBase extends view.View implements definition.TextBase, formatte
         else if (this.ios) {
             this.ios.text = data.newValue + "";
             this.style._updateTextDecoration();
+            this.style._updateTextTransform();
         }
     }
 
@@ -105,6 +106,7 @@ export class TextBase extends view.View implements definition.TextBase, formatte
         } else if (this.ios) {
             this.ios.attributedText = value._formattedText;
             this.style._updateTextDecoration();
+            this.style._updateTextTransform();
             this.requestLayout();
         }
     }
diff --git a/ui/text-field/text-field.ios.ts b/ui/text-field/text-field.ios.ts
index 494a80b76..055c0d34f 100644
--- a/ui/text-field/text-field.ios.ts
+++ b/ui/text-field/text-field.ios.ts
@@ -72,6 +72,7 @@ class UITextFieldDelegateImpl extends NSObject implements UITextFieldDelegate {
 
             var r = textField.selectedTextRange;
             owner.style._updateTextDecoration();
+            owner.style._updateTextTransform();
             textField.selectedTextRange = r;
 
             if (owner.updateTextTrigger === enums.UpdateTextTrigger.textChanged) {
diff --git a/ui/text-view/text-view.ios.ts b/ui/text-view/text-view.ios.ts
index 1776480e4..a53ed537d 100644
--- a/ui/text-view/text-view.ios.ts
+++ b/ui/text-view/text-view.ios.ts
@@ -29,6 +29,7 @@ class UITextViewDelegateImpl extends NSObject implements UITextViewDelegate {
         let owner = this._owner.get();
         if (owner) {
             owner.style._updateTextDecoration();
+            owner.style._updateTextTransform();
         }
     }
 
@@ -41,6 +42,9 @@ class UITextViewDelegateImpl extends NSObject implements UITextViewDelegate {
 
             owner.dismissSoftInput();
             owner._refreshHintState(owner.hint, textView.text);
+
+            owner.style._updateTextDecoration();
+            owner.style._updateTextTransform();
         }
     }
 
@@ -49,6 +53,7 @@ class UITextViewDelegateImpl extends NSObject implements UITextViewDelegate {
         if (owner) {
             var range = textView.selectedRange;
             owner.style._updateTextDecoration();
+            owner.style._updateTextTransform();
             textView.selectedRange = range;
 
             if (owner.updateTextTrigger === enums.UpdateTextTrigger.textChanged) {