diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 31dde677d..7e4fe85c9 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -189,6 +189,9 @@
Designer
+
+ Designer
+
Designer
@@ -239,6 +242,7 @@
color.xml
+
html-view.xml
diff --git a/apps/tests/ui/style/style-properties-tests.ts b/apps/tests/ui/style/style-properties-tests.ts
index a642bbabf..2d36fe321 100644
--- a/apps/tests/ui/style/style-properties-tests.ts
+++ b/apps/tests/ui/style/style-properties-tests.ts
@@ -1,12 +1,15 @@
import TKUnit = require("../../TKUnit");
import helper = require("../helper");
import buttonModule = require("ui/button");
+import labelModule = require("ui/label");
import stackModule = require("ui/layouts/stack-layout");
import page = require("ui/page");
import color = require("color");
import observable = require("data/observable");
import enums = require("ui/enums");
import fontModule = require("ui/styling/font");
+import platform = require("platform");
+import viewModule = require("ui/core/view");
var testBtn: buttonModule.Button;
var testPage: page.Page;
@@ -33,6 +36,14 @@ export function tearDown() {
testPage.css = "";
}
+export function test_setting_textDecoration_property_from_CSS_is_applied_to_Style() {
+ test_property_from_CSS_is_applied_to_style("textDecoration", "text-decoration", "underline");
+}
+
+export function test_setting_whiteSpace_property_from_CSS_is_applied_to_Style() {
+ test_property_from_CSS_is_applied_to_style("whiteSpace", "white-space", "nowrap");
+}
+
export function test_CSS_properties_are_applied_to_Style() {
test_property_from_CSS_is_applied_to_style("color", "color", new color.Color("#FF0000"), "#FF0000");
}
@@ -244,6 +255,58 @@ export function test_setting_different_color_triggers_property_change() {
TKUnit.assert(changed, "Property changed not triggered.");
}
+export function test_setting_same_textDecoration_does_not_trigger_property_change() {
+ var testView = new buttonModule.Button();
+ testView.style.textDecoration = "underline";
+
+ var changed = false;
+ testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+ changed = true;
+ });
+
+ testView.style.textDecoration = "underline";
+ TKUnit.assert(!changed, "Property changed triggered.");
+}
+
+export function test_setting_different_textDecoration_triggers_property_change() {
+ var testView = new buttonModule.Button();
+ testView.style.textDecoration = "underline";
+
+ var changed = false;
+ testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+ changed = true;
+ });
+
+ testView.style.textDecoration = "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";
+
+ var changed = false;
+ testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+ changed = true;
+ });
+
+ testView.style.whiteSpace = "normal";
+ TKUnit.assert(!changed, "Property changed triggered.");
+}
+
+export function test_setting_different_whiteSpace_triggers_property_change() {
+ var testView = new buttonModule.Button();
+ testView.style.whiteSpace = "normal";
+
+ var changed = false;
+ testView.style.on(observable.Observable.propertyChangeEvent, (data) => {
+ changed = true;
+ });
+
+ testView.style.whiteSpace = "nowrap";
+ TKUnit.assert(changed, "Property changed not triggered.");
+}
+
export function test_setting_same_backgroundColor_does_not_trigger_property_change() {
var testView = new buttonModule.Button();
testView.style.backgroundColor = new color.Color("#FF0000");
@@ -366,3 +429,63 @@ function test_native_font(style: string, weight: string) {
}
//TODO: If needed add tests for other platforms
}
+
+export var test_setting_button_whiteSpace_normal_sets_native = function () {
+ var testView = new buttonModule.Button();
+ testView.style.whiteSpace = "nowrap";
+
+ helper.buildUIAndRunTest(testView, function (views: Array) {
+
+ if (platform.device.os === platform.platformNames.android) {
+ TKUnit.assertEqual((testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END);
+ } else if (platform.device.os === platform.platformNames.ios) {
+ TKUnit.assertEqual((testView.ios).titleLabel.lineBreakMode, NSLineBreakMode.NSLineBreakByTruncatingMiddle);
+ TKUnit.assertEqual((testView.ios).titleLabel.numberOfLines, 1);
+ }
+ });
+}
+
+export var test_setting_label_whiteSpace_normal_sets_native = function () {
+ var testView = new labelModule.Label();
+ testView.style.whiteSpace = "nowrap";
+
+ helper.buildUIAndRunTest(testView, function (views: Array) {
+
+ if (platform.device.os === platform.platformNames.android) {
+ TKUnit.assertEqual((testView.android).getEllipsize(), android.text.TextUtils.TruncateAt.END);
+ } else if (platform.device.os === platform.platformNames.ios) {
+ TKUnit.assertEqual((testView.ios).lineBreakMode, NSLineBreakMode.NSLineBreakByTruncatingTail);
+ TKUnit.assertEqual((testView.ios).numberOfLines, 1);
+ }
+ });
+}
+
+export var test_setting_button_whiteSpace_nowrap_sets_native = function () {
+ var testView = new buttonModule.Button();
+ testView.style.whiteSpace = "normal";
+
+ helper.buildUIAndRunTest(testView, function (views: Array) {
+
+ if (platform.device.os === platform.platformNames.android) {
+ TKUnit.assertNull((testView.android).getEllipsize(), null);
+ } else if (platform.device.os === platform.platformNames.ios) {
+ TKUnit.assertEqual((testView.ios).titleLabel.lineBreakMode, NSLineBreakMode.NSLineBreakByWordWrapping);
+ TKUnit.assertEqual((testView.ios).titleLabel.numberOfLines, 0);
+ }
+ });
+}
+
+export var test_setting_label_whiteSpace_nowrap_sets_native = function () {
+ var testView = new labelModule.Label();
+ testView.style.whiteSpace = "normal";
+
+ helper.buildUIAndRunTest(testView, function (views: Array) {
+
+ if (platform.device.os === platform.platformNames.android) {
+ TKUnit.assertNull((testView.android).getEllipsize(), null);
+ } else if (platform.device.os === platform.platformNames.ios) {
+ TKUnit.assertEqual((testView.ios).lineBreakMode, NSLineBreakMode.NSLineBreakByWordWrapping);
+ TKUnit.assertEqual((testView.ios).numberOfLines, 0);
+ }
+ });
+}
diff --git a/apps/ui-tests-app/css/text-decoration.ts b/apps/ui-tests-app/css/text-decoration.ts
index eceb2f30e..1697df70c 100644
--- a/apps/ui-tests-app/css/text-decoration.ts
+++ b/apps/ui-tests-app/css/text-decoration.ts
@@ -1,17 +1,18 @@
-var obj;
-
-export function loaded(args) {
- obj = args.object;
-}
+import view = require("ui/core/view");
+import observable = require("data/observable");
+import label = require("ui/label");
export function butonTap(args) {
- if (obj.style.textDecoration === "underline") {
- obj.style.textDecoration = "line-through";
- } else if (obj.style.textDecoration === "line-through") {
- obj.style.textDecoration = "line-through underline";
- } else if (obj.style.textDecoration === "line-through underline") {
- obj.style.textDecoration = "none";
- } else if (obj.style.textDecoration === "none") {
- obj.style.textDecoration = "underline";
+ var btn = args.object;
+ var lbl = btn.parent.getViewById("Label1");
+
+ if (lbl.style.textDecoration === "underline") {
+ lbl.style.textDecoration = "line-through";
+ } else if (lbl.style.textDecoration === "line-through") {
+ lbl.style.textDecoration = "line-through underline";
+ } else if (lbl.style.textDecoration === "line-through underline") {
+ lbl.style.textDecoration = "none";
+ } else if (lbl.style.textDecoration === "none") {
+ lbl.style.textDecoration = "underline";
}
}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/text-decoration.xml b/apps/ui-tests-app/css/text-decoration.xml
index f1a99cadb..4e71c619b 100644
--- a/apps/ui-tests-app/css/text-decoration.xml
+++ b/apps/ui-tests-app/css/text-decoration.xml
@@ -2,7 +2,7 @@
-
+
diff --git a/apps/ui-tests-app/css/white-space.ts b/apps/ui-tests-app/css/white-space.ts
new file mode 100644
index 000000000..d1f3a85c1
--- /dev/null
+++ b/apps/ui-tests-app/css/white-space.ts
@@ -0,0 +1,14 @@
+import view = require("ui/core/view");
+import observable = require("data/observable");
+import label = require("ui/label");
+
+export function butonTap(args: observable.EventData) {
+ var btn = args.object;
+ var lbl = btn.parent.getViewById("Label1");
+
+ if (lbl.style.whiteSpace === "normal") {
+ lbl.style.whiteSpace = "nowrap";
+ } else if (lbl.style.whiteSpace === "nowrap") {
+ lbl.style.whiteSpace = "normal";
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/css/white-space.xml b/apps/ui-tests-app/css/white-space.xml
new file mode 100644
index 000000000..869c5a988
--- /dev/null
+++ b/apps/ui-tests-app/css/white-space.xml
@@ -0,0 +1,20 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/ui-tests-app/mainPage.ts b/apps/ui-tests-app/mainPage.ts
index 1f34d56d7..96db5a781 100644
--- a/apps/ui-tests-app/mainPage.ts
+++ b/apps/ui-tests-app/mainPage.ts
@@ -90,4 +90,6 @@ examples.set("webview", "web-view/web-view");
examples.set("webtest", "web-view/web-view-test");
examples.set("decoration", "css/text-decoration");
+examples.set("whitespace", "css/white-space");
+
//VM.set("selected", "tabAll");
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index 84f94ffbd..f56083587 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/white-space.ts",
"apps/ui-tests-app/dialogs/dialogs.ts",
"apps/ui-tests-app/dialogs/view-model.ts",
"apps/ui-tests-app/font/button.ts",
diff --git a/ui/button/button-common.ts b/ui/button/button-common.ts
index 1b9e0f04e..223ff6047 100644
--- a/ui/button/button-common.ts
+++ b/ui/button/button-common.ts
@@ -5,6 +5,7 @@ import proxy = require("ui/core/proxy");
import formattedString = require("text/formatted-string");
import observable = require("data/observable");
import weakEvents = require("ui/core/weak-event-listener");
+import enums = require("ui/enums");
var textProperty = new dependencyObservable.Property(
"text",
@@ -121,4 +122,11 @@ export class Button extends view.View implements definition.Button {
public _addChildFromBuilder(name: string, value: any): void {
formattedString.FormattedString.addFormattedStringToView(this, name, value);
}
-}
\ No newline at end of file
+}
+
+function onTextWrapPropertyChanged(data: dependencyObservable.PropertyChangeData) {
+ var v = data.object;
+ v.style.whiteSpace = data.newValue ? enums.WhiteSpace.normal : enums.WhiteSpace.nowrap;
+}
+
+(Button.textWrapProperty.metadata).onSetNativeValue = onTextWrapPropertyChanged;
\ No newline at end of file
diff --git a/ui/button/button.android.ts b/ui/button/button.android.ts
index e4aaee64c..163e1b04a 100644
--- a/ui/button/button.android.ts
+++ b/ui/button/button.android.ts
@@ -5,18 +5,6 @@ import proxy = require("ui/core/proxy");
global.moduleMerge(common, exports);
-function onTextWrapPropertyChanged(data: dependencyObservable.PropertyChangeData) {
- var btn =