diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index df52b4a5a..8185d2435 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -690,6 +690,9 @@
+
+
+
@@ -1519,16 +1522,6 @@
-
-
- stylers.d.ts
-
-
- stylers.d.ts
-
-
- stylers.d.ts
-
utils.d.ts
diff --git a/apps/tests/app/style_props.ts b/apps/tests/app/style_props.ts
index fd5fe5335..a94b19a69 100644
--- a/apps/tests/app/style_props.ts
+++ b/apps/tests/app/style_props.ts
@@ -1,4 +1,4 @@
-import styles = require("ui/styling");
+import style = require("ui/styling/style");
import observable = require("ui/core/dependency-observable");
import styleProperty = require("ui/styling/style-property");
import view = require("ui/core/view");
@@ -9,7 +9,7 @@ import stackLayoutDef = require("ui/layouts/stack-layout");
export var fontFamilyProperty = new styleProperty.Property("fontFamily", "font-family",
new observable.PropertyMetadata(undefined, observable.PropertyMetadataSettings.AffectsLayout));
-export class MyTextViewStyler implements styles.stylers.Styler {
+export class MyTextViewStyler implements style.Styler {
public static setFontFamilyProperty(view: view.View, newValue: any) {
if (view.android) {
(view.android).setTypeface(android.graphics.Typeface.create(newValue, android.graphics.Typeface.NORMAL));
@@ -41,7 +41,7 @@ export class MyTextViewStyler implements styles.stylers.Styler {
}
public static registerHandlers() {
- styles.stylers.registerHandler(fontFamilyProperty, new styles.stylers.StylePropertyChangedHandler(
+ style.registerHandler(fontFamilyProperty, new style.StylePropertyChangedHandler(
MyTextViewStyler.setFontFamilyProperty,
MyTextViewStyler.resetFontFamilyProperty,
MyTextViewStyler.getNativeFontFamilyValue), "MyButton");
diff --git a/apps/tests/ui/style/style-tests.ts b/apps/tests/ui/style/style-tests.ts
index 8a09d416a..3446ec5d0 100644
--- a/apps/tests/ui/style/style-tests.ts
+++ b/apps/tests/ui/style/style-tests.ts
@@ -724,8 +724,8 @@ export function test_styling_visualStates_are_defined() {
}
export function test_styling_stylers_are_defined() {
- TKUnit.assert(types.isFunction(styling.stylers.registerHandler), "registerHandler function is not defined");
- TKUnit.assert(types.isFunction(styling.stylers.StylePropertyChangedHandler), "StylePropertyChangedHandler class is not defined");
+ TKUnit.assert(types.isFunction(styleModule.registerHandler), "registerHandler function is not defined");
+ TKUnit.assert(types.isFunction(styleModule.StylePropertyChangedHandler), "StylePropertyChangedHandler class is not defined");
}
export function test_styling_classes_are_defined() {
diff --git a/tsconfig.json b/tsconfig.json
index b352f0d50..c989fedb6 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -622,10 +622,6 @@
"ui/styling/style-scope.ts",
"ui/styling/style.d.ts",
"ui/styling/style.ts",
- "ui/styling/stylers-common.ts",
- "ui/styling/stylers.android.ts",
- "ui/styling/stylers.d.ts",
- "ui/styling/stylers.ios.ts",
"ui/styling/styling.d.ts",
"ui/styling/styling.ts",
"ui/styling/visual-state-constants.d.ts",
@@ -639,6 +635,9 @@
"ui/tab-view/tab-view.android.ts",
"ui/tab-view/tab-view.d.ts",
"ui/tab-view/tab-view.ios.ts",
+ "ui/text-base/text-base-styler.android.ts",
+ "ui/text-base/text-base-styler.d.ts",
+ "ui/text-base/text-base-styler.ios.ts",
"ui/text-base/text-base.d.ts",
"ui/text-base/text-base.ts",
"ui/text-field/text-field-common.ts",
diff --git a/ui/action-bar/action-bar.android.ts b/ui/action-bar/action-bar.android.ts
index f7e8aa55a..3bdead63e 100644
--- a/ui/action-bar/action-bar.android.ts
+++ b/ui/action-bar/action-bar.android.ts
@@ -8,6 +8,9 @@ import view = require("ui/core/view");
import * as traceModule from "trace";
import * as utilsModule from "utils/utils";
import * as imageSourceModule from "image-source";
+import style = require("ui/styling/style");
+import font = require("ui/styling/font");
+import styling = require("ui/styling");
const R_ID_HOME = 0x0102002c;
const ACTION_ITEM_ID_OFFSET = 1000;
@@ -366,4 +369,29 @@ function getIconVisibility(iconVisibility: string): boolean {
function getSystemResourceId(systemIcon: string): number {
return android.content.res.Resources.getSystem().getIdentifier(systemIcon, "drawable", "android");
-}
\ No newline at end of file
+}
+
+export class ActionBarStyler implements style.Styler {
+ // color
+ private static setColorProperty(v: view.View, newValue: any) {
+ var toolbar = (v._nativeView);
+ toolbar.setTitleTextColor(newValue);
+
+ }
+
+ private static resetColorProperty(v: view.View, nativeValue: any) {
+ // there is no toolbar.getTitleTextColor - so default to black
+ if (types.isNullOrUndefined(nativeValue)) {
+ nativeValue = android.graphics.Color.BLACK;
+ }
+ (v._nativeView).setTitleTextColor(nativeValue);
+ }
+
+ public static registerHandlers() {
+ style.registerHandler(style.colorProperty, new style.StylePropertyChangedHandler(
+ ActionBarStyler.setColorProperty,
+ ActionBarStyler.resetColorProperty), "ActionBar");
+ }
+}
+
+ActionBarStyler.registerHandlers();
diff --git a/ui/action-bar/action-bar.ios.ts b/ui/action-bar/action-bar.ios.ts
index b04613735..52c9a1be1 100644
--- a/ui/action-bar/action-bar.ios.ts
+++ b/ui/action-bar/action-bar.ios.ts
@@ -6,6 +6,10 @@ import enums = require("ui/enums");
import view = require("ui/core/view");
import utils = require("utils/utils");
import types = require("utils/types");
+import style = require("ui/styling/style");
+import font = require("ui/styling/font");
+import styling = require("ui/styling");
+import frame = require("ui/frame");
global.moduleMerge(common, exports);
@@ -243,3 +247,55 @@ class TapBarItemHandlerImpl extends NSObject {
"tap": { returns: interop.types.void, params: [interop.types.id] }
};
}
+
+export class ActionBarStyler implements style.Styler {
+ // color
+ private static setColorProperty(v: view.View, newValue: any) {
+ var topFrame = frame.topmost();
+ if (topFrame) {
+ var navBar = topFrame.ios.controller.navigationBar;
+ navBar.titleTextAttributes = { [NSForegroundColorAttributeName]: newValue };
+ navBar.tintColor = newValue;
+ }
+ }
+
+ private static resetColorProperty(v: view.View, nativeValue: any) {
+ var topFrame = frame.topmost();
+ if (topFrame) {
+ var navBar = topFrame.ios.controller.navigationBar;
+ navBar.titleTextAttributes = null;
+ navBar.tintColor = null;
+ }
+ }
+
+ // background-color
+ private static setBackgroundColorProperty(v: view.View, newValue: any) {
+ var topFrame = frame.topmost();
+ if (topFrame) {
+ var navBar = topFrame.ios.controller.navigationBar;
+ navBar.barTintColor = newValue;
+ }
+ }
+
+ private static resetBackgroundColorProperty(v: view.View, nativeValue: any) {
+ var topFrame = frame.topmost();
+ if (topFrame) {
+ var navBar = topFrame.ios.controller.navigationBar;
+ navBar.barTintColor = null;
+ }
+ }
+
+ public static registerHandlers() {
+ style.registerHandler(style.colorProperty, new style.StylePropertyChangedHandler(
+ ActionBarStyler.setColorProperty,
+ ActionBarStyler.resetColorProperty), "ActionBar");
+
+ style.registerHandler(style.backgroundColorProperty, new style.StylePropertyChangedHandler(
+ ActionBarStyler.setBackgroundColorProperty,
+ ActionBarStyler.resetBackgroundColorProperty), "ActionBar");
+
+ style.registerHandler(style.backgroundInternalProperty, style.ignorePropertyHandler, "ActionBar");
+ }
+}
+
+ActionBarStyler.registerHandlers();
diff --git a/ui/activity-indicator/activity-indicator.android.ts b/ui/activity-indicator/activity-indicator.android.ts
index 3fca5407f..37d8c1943 100644
--- a/ui/activity-indicator/activity-indicator.android.ts
+++ b/ui/activity-indicator/activity-indicator.android.ts
@@ -1,7 +1,10 @@
import aiCommon = require("./activity-indicator-common");
import dependencyObservable = require("ui/core/dependency-observable");
import proxy = require("ui/core/proxy");
-import * as enumsModule from "ui/enums";
+import enums = require("ui/enums");
+import styling = require("ui/styling");
+import style = require("ui/styling/style");
+import view = require("ui/core/view");
function onBusyPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var indicator = data.object;
@@ -9,8 +12,6 @@ function onBusyPropertyChanged(data: dependencyObservable.PropertyChangeData) {
return;
}
- var enums: typeof enumsModule = require("ui/enums");
-
if (indicator.visibility === enums.Visibility.visible) {
indicator.android.setVisibility(data.newValue ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
}
@@ -34,3 +35,45 @@ export class ActivityIndicator extends aiCommon.ActivityIndicator {
return this._android;
}
}
+
+export class ActivityIndicatorStyler implements style.Styler {
+ private static setColorProperty(view: view.View, newValue: any) {
+ var bar = view._nativeView;
+ bar.getIndeterminateDrawable().setColorFilter(newValue, android.graphics.PorterDuff.Mode.SRC_IN);
+ }
+
+ private static resetColorProperty(view: view.View, nativeValue: number) {
+ var bar = view._nativeView;
+ bar.getIndeterminateDrawable().clearColorFilter();
+ }
+
+ //Visibility methods
+ public static setActivityIndicatorVisibilityProperty(view: view.View, newValue: any) {
+ ActivityIndicatorStyler.setIndicatorVisibility((view).busy, newValue, view._nativeView);
+ }
+
+ public static resetActivityIndicatorVisibilityProperty(view: view.View, nativeValue: any) {
+ ActivityIndicatorStyler.setIndicatorVisibility((view).busy, enums.Visibility.visible, view._nativeView);
+ }
+
+ public static setIndicatorVisibility(isBusy: boolean, visibility: string, nativeView: android.view.View) {
+ if (visibility === enums.Visibility.collapsed || visibility === enums.Visibility.collapse) {
+ nativeView.setVisibility(android.view.View.GONE);
+ }
+ else {
+ nativeView.setVisibility(isBusy ? android.view.View.VISIBLE : android.view.View.INVISIBLE);
+ }
+ }
+
+ public static registerHandlers() {
+ style.registerHandler(style.colorProperty, new style.StylePropertyChangedHandler(
+ ActivityIndicatorStyler.setColorProperty,
+ ActivityIndicatorStyler.resetColorProperty), "ActivityIndicator");
+
+ style.registerHandler(style.visibilityProperty, new style.StylePropertyChangedHandler(
+ ActivityIndicatorStyler.setActivityIndicatorVisibilityProperty,
+ ActivityIndicatorStyler.resetActivityIndicatorVisibilityProperty), "ActivityIndicator");
+ }
+}
+
+ActivityIndicatorStyler.registerHandlers();
\ No newline at end of file
diff --git a/ui/activity-indicator/activity-indicator.ios.ts b/ui/activity-indicator/activity-indicator.ios.ts
index fbd097270..5b2e103bc 100644
--- a/ui/activity-indicator/activity-indicator.ios.ts
+++ b/ui/activity-indicator/activity-indicator.ios.ts
@@ -1,6 +1,9 @@
import aiCommon = require("./activity-indicator-common");
import dependencyObservable = require("ui/core/dependency-observable");
import proxy = require("ui/core/proxy");
+import styling = require("ui/styling");
+import style = require("ui/styling/style");
+import view = require("ui/core/view");
function onBusyPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var indicator = data.object;
@@ -32,3 +35,29 @@ export class ActivityIndicator extends aiCommon.ActivityIndicator {
return this._ios;
}
}
+
+export class ActivityIndicatorStyler implements style.Styler {
+ private static setColorProperty(view: view.View, newValue: any) {
+ var bar = view.ios;
+ bar.color = newValue;
+ }
+
+ private static resetColorProperty(view: view.View, nativeValue: any) {
+ var bar = view.ios;
+ bar.color = nativeValue;
+ }
+
+ private static getNativeColorValue(view: view.View): any {
+ var bar = view.ios;
+ return bar.color;
+ }
+
+ public static registerHandlers() {
+ style.registerHandler(style.colorProperty, new style.StylePropertyChangedHandler(
+ ActivityIndicatorStyler.setColorProperty,
+ ActivityIndicatorStyler.resetColorProperty,
+ ActivityIndicatorStyler.getNativeColorValue), "ActivityIndicator");
+ }
+}
+
+ActivityIndicatorStyler.registerHandlers();
\ No newline at end of file
diff --git a/ui/button/button.ios.ts b/ui/button/button.ios.ts
index 7e8172ba6..ae98a5708 100644
--- a/ui/button/button.ios.ts
+++ b/ui/button/button.ios.ts
@@ -1,5 +1,11 @@
import common = require("./button-common");
import stateChanged = require("ui/core/control-state-change");
+import style = require("ui/styling/style");
+import font = require("ui/styling/font");
+import styling = require("ui/styling");
+import view = require("ui/core/view");
+import utils = require("utils/utils");
+import enums = require("ui/enums");
class TapHandlerImpl extends NSObject {
private _owner: WeakRef