javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-16 03:31:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

IOS stylers

Browse Source
This commit is contained in:
vakrilov
2015-10-29 15:27:12 +02:00
parent 815a4fc23c
commit 7e85de351e
9 changed files with 95 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
CrossPlatformModules.csproj
View File

@ -192,6 +192,9 @@
<Content Include="apps\ui-tests-app\action-bar\all.xml">
<SubType>Designer</SubType>
</Content>
<Content Include="apps\ui-tests-app\action-bar\clean.xml">
<SubType>Designer</SubType>
</Content>
<Content Include="apps\ui-tests-app\tab-view\background.xml">
<SubType>Designer</SubType>
</Content>
@ -214,6 +217,8 @@
<SubType>Designer</SubType>
</Content>
<Content Include="apps\ui-tests-app\app.css" />
<TypeScriptCompile Include="apps\ui-tests-app\action-bar\all.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\action-bar\color.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\nordic\nordic.ts">
<DependentUpon>nordic.xml</DependentUpon>
</TypeScriptCompile>

5
apps/ui-tests-app/action-bar/all.ts Normal file
View File

@ -0,0 +1,5 @@
import frame = require("ui/frame");
export function navigate(args) {
frame.topmost().navigate("action-bar/clean");
}

2
apps/ui-tests-app/action-bar/all.xml
View File

@ -8,6 +8,6 @@
</ActionBar>
</Page.actionBar>
<StackLayout>
<Button text="do nothing"/>
<Button text="go to cleared page" tap="navigate"/>
</StackLayout>
</Page>

13
apps/ui-tests-app/action-bar/clean.xml Normal file
View File

@ -0,0 +1,13 @@
<Page>
<Page.actionBar>
<ActionBar title="Page Title">
<NavigationButton text="go back"/>
<ActionBar.actionItems>
<ActionItem text="ITEM" />
</ActionBar.actionItems>
</ActionBar>
</Page.actionBar>
<StackLayout>
<Button text="do nothing"/>
</StackLayout>
</Page>

5
apps/ui-tests-app/action-bar/color.ts Normal file
View File

@ -0,0 +1,5 @@
import frame = require("ui/frame");
export function navigate(args) {
frame.topmost().navigate("action-bar/clean");
}

4
apps/ui-tests-app/action-bar/color.xml
View File

@ -1,6 +1,6 @@
<Page>
<Page.actionBar>
<ActionBar title="Page Title" style="background-color: green;">
<ActionBar title="Page Title" style="color: green;">
<NavigationButton text="go back"/>
<ActionBar.actionItems>
<ActionItem text="ITEM" />
@ -8,6 +8,6 @@
</ActionBar>
</Page.actionBar>
<StackLayout>
<Button text="do nothing"/>
<Button text="go to cleared page" tap="navigate"/>
</StackLayout>
</Page>

5
ui/action-bar/action-bar.d.ts vendored
View File

@ -203,4 +203,9 @@ declare module "ui/action-bar" {
export class NavigationButton extends ActionItemBase {
}
//@private
export function _setNavBarColor(navBar: UINavigationBar, color: UIColor);
export function _setNavBarBackgroundColor(navBar: UINavigationBar, color: UIColor);
//@endprivate
}

18
ui/action-bar/action-bar.ios.ts
View File

@ -80,6 +80,9 @@ export class ActionBar extends common.ActionBar {
// Populate action items
this.populateMenuItems(navigationItem);
// update colors explicitly - they may have to be cleared form a previous page
this.updateColors(navigationBar);
}
private populateMenuItems(navigationItem: UINavigationItem) {
@ -129,6 +132,21 @@ export class ActionBar extends common.ActionBar {
return barButtonItem;
}
private updateColors(navBar: UINavigationBar) {
var color = this.color;
if (color) {
navBar.titleTextAttributes = <any>{ [NSForegroundColorAttributeName]: color.ios };
navBar.tintColor = color.ios;
}
else {
navBar.titleTextAttributes = null;
navBar.tintColor = null;
}
var bgColor = this.backgroundColor;
navBar.barTintColor = bgColor ? bgColor.ios : null;
}
public _onTitlePropertyChanged() {
if (!this.page) {
return;

49
ui/styling/stylers.ios.ts
View File

@ -16,6 +16,14 @@ interface TextUIView {
textColor: UIColor;
}
var ignorePropertyHandler = new stylersCommon.StylePropertyChangedHandler(
(view, val) => {
// empty
},
(view, val) => {
// empty
});
export class DefaultStyler implements definition.stylers.Styler {
//Background methods
private static setBackgroundInternalProperty(view: view.View, newValue: any) {
@ -537,13 +545,13 @@ export class SwitchStyler implements definition.stylers.Styler {
SwitchStyler.resetColorProperty,
SwitchStyler.getNativeColorValue), "Switch");
var bkgHandler = new stylersCommon.StylePropertyChangedHandler(
style.registerHandler(style.backgroundColorProperty, new stylersCommon.StylePropertyChangedHandler(
SwitchStyler.setBackgroundColorProperty,
SwitchStyler.resetBackgroundColorProperty,
SwitchStyler.getBackgroundColorProperty);
SwitchStyler.getBackgroundColorProperty), "Switch");
style.registerHandler(style.backgroundColorProperty, bkgHandler, "Switch");
style.registerHandler(style.backgroundInternalProperty, bkgHandler, "Switch");
// Ignore the default backgroundInternalProperty handler
style.registerHandler(style.backgroundInternalProperty, ignorePropertyHandler, "Switch");
}
}
@ -634,16 +642,35 @@ export class ActionBarStyler implements definition.stylers.Styler {
private static setColorProperty(view: view.View, newValue: any) {
var topFrame = frame.topmost();
if (topFrame) {
var bar = topFrame.ios.controller.navigationBar;
(<any>bar).titleTextAttributes = { [NSForegroundColorAttributeName]: newValue };
var navBar = topFrame.ios.controller.navigationBar;
navBar.titleTextAttributes = <any>{ [NSForegroundColorAttributeName]: newValue };
navBar.tintColor = newValue;
}
}
private static resetColorProperty(view: view.View, nativeValue: any) {
var topFrame = frame.topmost();
if (topFrame) {
var bar = topFrame.ios.controller.navigationBar;
(<any>bar).titleTextAttributes = null;
var navBar = topFrame.ios.controller.navigationBar;
navBar.titleTextAttributes = null;
navBar.tintColor = null;
}
}
// background-color
private static setBackgroundColorProperty(view: view.View, newValue: any) {
var topFrame = frame.topmost();
if (topFrame) {
var navBar = topFrame.ios.controller.navigationBar;
navBar.barTintColor = newValue;
}
}
private static resetBackgroundColorProperty(view: view.View, nativeValue: any) {
var topFrame = frame.topmost();
if (topFrame) {
var navBar = topFrame.ios.controller.navigationBar;
navBar.barTintColor = null;
}
}
@ -651,6 +678,12 @@ export class ActionBarStyler implements definition.stylers.Styler {
style.registerHandler(style.colorProperty, new stylersCommon.StylePropertyChangedHandler(
ActionBarStyler.setColorProperty,
ActionBarStyler.resetColorProperty), "ActionBar");
style.registerHandler(style.backgroundColorProperty, new stylersCommon.StylePropertyChangedHandler(
ActionBarStyler.setBackgroundColorProperty,
ActionBarStyler.resetBackgroundColorProperty), "ActionBar");
style.registerHandler(style.backgroundInternalProperty, ignorePropertyHandler, "ActionBar");
}
}