Skip to content

Commit 44f6a80

Browse files
author
vakrilov
committed
Support for android.systemIcon in NavigationBar
1 parent 61882e6 commit 44f6a80

File tree

5 files changed

+69
-52
lines changed

5 files changed

+69
-52
lines changed

apps/tests/ui/action-bar/action-bar-tests-common.ts

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -65,17 +65,6 @@ import actionBarModule = require("ui/action-bar");
6565
// * **Android** - `actionBar`, `actionBarIfRoom` and `popup`. The default is `actionBar`.
6666
// * **iOS** - `left` and `right`. The default is `left`.
6767
//
68-
// ## Setting Navigation Button
69-
//```XML
70-
// <Page>
71-
// <Page.actionBar>
72-
// <ActionBar title="Title">
73-
// <NavigationButton text="go back"/>
74-
// </ActionBar>
75-
// ...
76-
// </Page>
77-
//```
78-
//
7968
// ## Displaying Platform-Specific System Icons on Action Items
8069
//```XML
8170
// <Page>
@@ -94,7 +83,8 @@ import actionBarModule = require("ui/action-bar");
9483
//
9584
//### iOS
9685
//Set `ios.systemIcon` to a number representing the iOS system item to be displayed.
97-
//Use this property instead of `ActionItemBase.icon` if you want to diplsay a built-in iOS system icon.
86+
//Use this property instead of `ActionItem.icon` if you want to diplsay a built-in iOS system icon.
87+
//Note: systemIcon is not supported on NavigationButton in iOS
9888
//The value should be a number from the `UIBarButtonSystemItem` enumeration
9989
//(https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIBarButtonItem_Class/#//apple_ref/c/tdef/UIBarButtonSystemItem)
10090
//0: Done
@@ -124,10 +114,23 @@ import actionBarModule = require("ui/action-bar");
124114
//
125115
//### Android
126116
//Set `android.systemIcon` the name of the system drawable resource to be displayed.
127-
//Use this property instead of `ActionItemBase.icon` if you want to diplsay a built-in Android system icon.
117+
//Use this property instead of `ActionItem.icon` if you want to diplsay a built-in Android system icon.
128118
//The value should be a string such as 'ic_menu_search' if you want to display the built-in Android Menu Search icon for example.
129119
//For a full list of Android drawable names, please visit http://androiddrawables.com
130120
//
121+
// ## Setting Navigation Button
122+
//```XML
123+
// <Page>
124+
// <Page.actionBar>
125+
// <ActionBar title="Title">
126+
// <NavigationButton text="go back" android.systemIcon = "ic_menu_back"/>
127+
// </ActionBar>
128+
// ...
129+
// </Page>
130+
//```
131+
//Setting `text` for the navigation button is not supproted in Android. You can use `icon` or `android.systemIcon` to set the image in Android.
132+
//Setting `ios.systemIcon` for the navigation button is not supported in iOS.
133+
//
131134
// </snippet>
132135

133136
export function test_actionItem_inherit_bindingContext() {

ui/action-bar/action-bar-common.ts

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export class ActionBar extends view.View implements dts.ActionBar {
2323
public static titleProperty = new dependencyObservable.Property("title", "ActionBar", new proxy.PropertyMetadata(undefined, dependencyObservable.PropertyMetadataSettings.None, onTitlePropertyChanged));
2424

2525
private _actionItems: ActionItems;
26-
private _navigationButton: NavigationButton;
26+
private _navigationButton: dts.NavigationButton;
2727
private _page: pages.Page;
2828
private _titleView: view.View;
2929

@@ -34,10 +34,10 @@ export class ActionBar extends view.View implements dts.ActionBar {
3434
this._setValue(ActionBar.titleProperty, value);
3535
}
3636

37-
get navigationButton(): NavigationButton {
37+
get navigationButton(): dts.NavigationButton {
3838
return this._navigationButton;
3939
}
40-
set navigationButton(value: NavigationButton) {
40+
set navigationButton(value: dts.NavigationButton) {
4141
if (this._navigationButton !== value) {
4242
if (this._navigationButton) {
4343
this._navigationButton.actionBar = undefined;
@@ -126,7 +126,7 @@ export class ActionBar extends view.View implements dts.ActionBar {
126126
}
127127

128128
public _addChildFromBuilder(name: string, value: any) {
129-
if (value instanceof NavigationButton) {
129+
if (value instanceof dts.NavigationButton) {
130130
this.navigationButton = value;
131131
}
132132

@@ -229,34 +229,34 @@ export class ActionItems implements dts.ActionItems {
229229
}
230230
}
231231

232-
export class ActionItemBase extends bindable.Bindable implements dts.ActionItemBase {
232+
export class ActionItem extends bindable.Bindable implements dts.ActionItem {
233233
public static tapEvent = "tap";
234234

235235
public static textProperty = new dependencyObservable.Property(
236-
"text", "ActionItemBase", new dependencyObservable.PropertyMetadata("", null, ActionItemBase.onItemChanged));
236+
"text", "ActionItem", new dependencyObservable.PropertyMetadata("", null, ActionItem.onItemChanged));
237237

238238
public static iconProperty = new dependencyObservable.Property(
239-
"icon", "ActionItemBase", new dependencyObservable.PropertyMetadata(null, null, ActionItemBase.onItemChanged));
239+
"icon", "ActionItem", new dependencyObservable.PropertyMetadata(null, null, ActionItem.onItemChanged));
240240

241241
private static onItemChanged(data: dependencyObservable.PropertyChangeData) {
242-
var menuItem = <ActionItemBase>data.object;
242+
var menuItem = <ActionItem>data.object;
243243
if (menuItem.actionBar) {
244244
menuItem.actionBar.update();
245245
}
246246
}
247247

248248
get text(): string {
249-
return this._getValue(ActionItemBase.textProperty);
249+
return this._getValue(ActionItem.textProperty);
250250
}
251251
set text(value: string) {
252-
this._setValue(ActionItemBase.textProperty, value);
252+
this._setValue(ActionItem.textProperty, value);
253253
}
254254

255255
get icon(): string {
256-
return this._getValue(ActionItemBase.iconProperty);
256+
return this._getValue(ActionItem.iconProperty);
257257
}
258258
set icon(value: string) {
259-
this._setValue(ActionItemBase.iconProperty, value);
259+
this._setValue(ActionItem.iconProperty, value);
260260
}
261261

262262
private _actionBar: ActionBar;
@@ -273,10 +273,10 @@ export class ActionItemBase extends bindable.Bindable implements dts.ActionItemB
273273
}
274274

275275
public _raiseTap() {
276-
this._emit(ActionItemBase.tapEvent);
276+
this._emit(ActionItem.tapEvent);
277277
}
278-
}
279278

280-
export class NavigationButton extends ActionItemBase {
279+
public ios: dts.IOSActionItemSettings;
281280

282-
}
281+
public android: dts.AndroidActionItemSettings;
282+
}

ui/action-bar/action-bar.android.ts

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ var ACTION_ITEM_ID_OFFSET = 1000;
1515

1616
global.moduleMerge(common, exports);
1717

18-
export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
18+
export class ActionItem extends common.ActionItem {
1919
private _androidPosition: dts.AndroidActionItemSettings = {
2020
position: enums.AndroidActionItemPosition.actionBar,
2121
systemIcon: undefined
@@ -27,9 +27,6 @@ export class ActionItem extends common.ActionItemBase implements dts.ActionItem
2727
public set android(value: dts.AndroidActionItemSettings) {
2828
throw new Error("ActionItem.android is read-only");
2929
}
30-
31-
// Not used in Android
32-
public ios: dts.IOSActionItemSettings;
3330
}
3431

3532
export class AndroidActionBarSettings implements dts.AndroidActionBarSettings {
@@ -62,6 +59,10 @@ export class AndroidActionBarSettings implements dts.AndroidActionBarSettings {
6259
}
6360
}
6461

62+
export class NavigationButton extends ActionItem {
63+
64+
}
65+
6566
export class ActionBar extends common.ActionBar {
6667
private _appResources: android.content.res.Resources;
6768
private _android: AndroidActionBarSettings;
@@ -102,7 +103,7 @@ export class ActionBar extends common.ActionBar {
102103
if (!this._toolbar) {
103104
return;
104105
}
105-
106+
106107
if (!this.page.frame || !this.page.frame._getNavBarVisible(this.page)) {
107108
this._toolbar.setVisibility(android.view.View.GONE);
108109

@@ -142,8 +143,18 @@ export class ActionBar extends common.ActionBar {
142143
public _updateNavigationButton() {
143144
var navButton = this.navigationButton;
144145
if (navButton) {
145-
var drawableOrId = getDrawableOrResourceId(navButton.icon, this._appResources);
146-
this._toolbar.setNavigationIcon(drawableOrId);
146+
147+
if (navButton.android.systemIcon) {
148+
// Try to look in the system resources.
149+
let systemResourceId = getSystemResourceId(navButton.android.systemIcon);
150+
if (systemResourceId) {
151+
this._toolbar.setNavigationIcon(systemResourceId);
152+
}
153+
}
154+
else if (navButton.icon) {
155+
let drawableOrId = getDrawableOrResourceId(navButton.icon, this._appResources);
156+
this._toolbar.setNavigationIcon(drawableOrId);
157+
}
147158

148159
this._toolbar.setNavigationOnClickListener(new android.view.View.OnClickListener({
149160
onClick: function (v) {
@@ -206,7 +217,7 @@ export class ActionBar extends common.ActionBar {
206217

207218
if (item.android.systemIcon) {
208219
// Try to look in the system resources.
209-
let systemResourceId = android.content.res.Resources.getSystem().getIdentifier(item.android.systemIcon, "drawable", "android");
220+
let systemResourceId = getSystemResourceId(item.android.systemIcon);
210221
if (systemResourceId) {
211222
menuItem.setIcon(systemResourceId);
212223
}
@@ -320,4 +331,8 @@ function getIconVisibility(iconVisibility: string): boolean {
320331
default:
321332
return false;
322333
}
334+
}
335+
336+
function getSystemResourceId(systemIcon: string): number {
337+
return android.content.res.Resources.getSystem().getIdentifier(systemIcon, "drawable", "android");
323338
}

ui/action-bar/action-bar.d.ts

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -85,9 +85,9 @@ declare module "ui/action-bar" {
8585
}
8686

8787
/**
88-
* Base class for action items.
88+
* Represents an action item in the action bar.
8989
*/
90-
export class ActionItemBase extends bindable.Bindable {
90+
export class ActionItem extends bindable.Bindable {
9191
/**
9292
* String value used when hooking to tap event.
9393
*/
@@ -134,12 +134,7 @@ declare module "ui/action-bar" {
134134
//@private
135135
_raiseTap(): void;
136136
//@endprivate
137-
}
138137

139-
/**
140-
* Represents an action item in the action bar.
141-
*/
142-
export class ActionItem extends ActionItemBase {
143138
/**
144139
* Gets the iOS specific options of the action item.
145140
*/
@@ -160,12 +155,13 @@ declare module "ui/action-bar" {
160155
* 1. actionBar - item is shown in the action bar.
161156
* 2. actionBarIfRoom - item is shown in the action bar if there is room for it. Otherwise it is put in the popup menu.
162157
* 3. popup - item is shown in the popup menu.
158+
* Note: Property not applicable to NavigationButton
163159
*/
164160
position: string;
165161

166162
/**
167163
* Gets or sets the name of the system drawable resource to be displayed.
168-
* Use this property instead of ActionItemBase.icon if you want to diplsay a built-in Android system icon.
164+
* Use this property instead of ActionItem.icon if you want to diplsay a built-in Android system icon.
169165
* The value should be a string such as 'ic_menu_search' if you want to display the built-in Android Menu Search icon for example.
170166
* For a full list of Android drawable names, please visit http://androiddrawables.com
171167
*/
@@ -180,12 +176,14 @@ declare module "ui/action-bar" {
180176
* Gets or sets the position of the action item in the action bar.
181177
* 1. left - items is shown at the left part of the navigation bar. This is the default value.
182178
* 2. right - items is shown at the right part of the navigation bar.
179+
* Note: Property not applicable to NavigationButton
183180
*/
184181
position: string;
185182

186183
/**
187184
* Gets or sets a number representing the iOS system item to be displayed.
188-
* Use this property instead of ActionItemBase.icon if you want to diplsay a built-in iOS system icon.
185+
* Use this property instead of ActionItem.icon if you want to diplsay a built-in iOS system icon.
186+
* Note: Property not applicable to NavigationButton
189187
* The value should be a number from the UIBarButtonSystemItem enumeration
190188
* (https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIBarButtonItem_Class/#//apple_ref/c/tdef/UIBarButtonSystemItem)
191189
* 0: Done
@@ -240,7 +238,7 @@ declare module "ui/action-bar" {
240238
/**
241239
* Represents the navigation (a.k.a. "back") button.
242240
*/
243-
export class NavigationButton extends ActionItemBase {
241+
export class NavigationButton extends ActionItem {
244242

245243
}
246244

ui/action-bar/action-bar.ios.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import types = require("utils/types");
99

1010
global.moduleMerge(common, exports);
1111

12-
export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
12+
export class ActionItem extends common.ActionItem {
1313
private _ios: dts.IOSActionItemSettings = {
1414
position: enums.IOSActionItemPosition.left,
1515
systemIcon: undefined
@@ -20,9 +20,10 @@ export class ActionItem extends common.ActionItemBase implements dts.ActionItem
2020
public set ios(value: dts.IOSActionItemSettings) {
2121
throw new Error("ActionItem.android is read-only");
2222
}
23+
}
24+
25+
export class NavigationButton extends ActionItem {
2326

24-
// Not used in IOS
25-
public android: dts.AndroidActionItemSettings;
2627
}
2728

2829
export class ActionBar extends common.ActionBar {
@@ -214,9 +215,9 @@ export class ActionBar extends common.ActionBar {
214215
}
215216

216217
class TapBarItemHandlerImpl extends NSObject {
217-
private _owner: WeakRef<dts.ActionItemBase>;
218+
private _owner: WeakRef<dts.ActionItem>;
218219

219-
public static initWithOwner(owner: WeakRef<dts.ActionItemBase>): TapBarItemHandlerImpl {
220+
public static initWithOwner(owner: WeakRef<dts.ActionItem>): TapBarItemHandlerImpl {
220221
let handler = <TapBarItemHandlerImpl>TapBarItemHandlerImpl.new();
221222
handler._owner = owner;
222223
return handler;

0 commit comments

Comments
 (0)