Support for android.systemIcon in NavigationBar

This commit is contained in:
vakrilov
2015-12-01 14:33:58 +02:00
parent 61882e678f
commit 44f6a806e8
5 changed files with 69 additions and 52 deletions

View File

@ -65,17 +65,6 @@ import actionBarModule = require("ui/action-bar");
// * **Android** - `actionBar`, `actionBarIfRoom` and `popup`. The default is `actionBar`.
// * **iOS** - `left` and `right`. The default is `left`.
//
// ## Setting Navigation Button
//```XML
// <Page>
// <Page.actionBar>
// <ActionBar title="Title">
// <NavigationButton text="go back"/>
// </ActionBar>
// ...
// </Page>
//```
//
// ## Displaying Platform-Specific System Icons on Action Items
//```XML
// <Page>
@ -94,7 +83,8 @@ import actionBarModule = require("ui/action-bar");
//
//### iOS
//Set `ios.systemIcon` to a number representing the iOS system item to be displayed.
//Use this property instead of `ActionItemBase.icon` if you want to diplsay a built-in iOS system icon.
//Use this property instead of `ActionItem.icon` if you want to diplsay a built-in iOS system icon.
//Note: systemIcon is not supported on NavigationButton in iOS
//The value should be a number from the `UIBarButtonSystemItem` enumeration
//(https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIBarButtonItem_Class/#//apple_ref/c/tdef/UIBarButtonSystemItem)
//0: Done
@ -124,10 +114,23 @@ import actionBarModule = require("ui/action-bar");
//
//### Android
//Set `android.systemIcon` the name of the system drawable resource to be displayed.
//Use this property instead of `ActionItemBase.icon` if you want to diplsay a built-in Android system icon.
//Use this property instead of `ActionItem.icon` if you want to diplsay a built-in Android system icon.
//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.
//For a full list of Android drawable names, please visit http://androiddrawables.com
//
// ## Setting Navigation Button
//```XML
// <Page>
// <Page.actionBar>
// <ActionBar title="Title">
// <NavigationButton text="go back" android.systemIcon = "ic_menu_back"/>
// </ActionBar>
// ...
// </Page>
//```
//Setting `text` for the navigation button is not supproted in Android. You can use `icon` or `android.systemIcon` to set the image in Android.
//Setting `ios.systemIcon` for the navigation button is not supported in iOS.
//
// </snippet>
export function test_actionItem_inherit_bindingContext() {

View File

@ -23,7 +23,7 @@ export class ActionBar extends view.View implements dts.ActionBar {
public static titleProperty = new dependencyObservable.Property("title", "ActionBar", new proxy.PropertyMetadata(undefined, dependencyObservable.PropertyMetadataSettings.None, onTitlePropertyChanged));
private _actionItems: ActionItems;
private _navigationButton: NavigationButton;
private _navigationButton: dts.NavigationButton;
private _page: pages.Page;
private _titleView: view.View;
@ -34,10 +34,10 @@ export class ActionBar extends view.View implements dts.ActionBar {
this._setValue(ActionBar.titleProperty, value);
}
get navigationButton(): NavigationButton {
get navigationButton(): dts.NavigationButton {
return this._navigationButton;
}
set navigationButton(value: NavigationButton) {
set navigationButton(value: dts.NavigationButton) {
if (this._navigationButton !== value) {
if (this._navigationButton) {
this._navigationButton.actionBar = undefined;
@ -126,7 +126,7 @@ export class ActionBar extends view.View implements dts.ActionBar {
}
public _addChildFromBuilder(name: string, value: any) {
if (value instanceof NavigationButton) {
if (value instanceof dts.NavigationButton) {
this.navigationButton = value;
}
@ -229,34 +229,34 @@ export class ActionItems implements dts.ActionItems {
}
}
export class ActionItemBase extends bindable.Bindable implements dts.ActionItemBase {
export class ActionItem extends bindable.Bindable implements dts.ActionItem {
public static tapEvent = "tap";
public static textProperty = new dependencyObservable.Property(
"text", "ActionItemBase", new dependencyObservable.PropertyMetadata("", null, ActionItemBase.onItemChanged));
"text", "ActionItem", new dependencyObservable.PropertyMetadata("", null, ActionItem.onItemChanged));
public static iconProperty = new dependencyObservable.Property(
"icon", "ActionItemBase", new dependencyObservable.PropertyMetadata(null, null, ActionItemBase.onItemChanged));
"icon", "ActionItem", new dependencyObservable.PropertyMetadata(null, null, ActionItem.onItemChanged));
private static onItemChanged(data: dependencyObservable.PropertyChangeData) {
var menuItem = <ActionItemBase>data.object;
var menuItem = <ActionItem>data.object;
if (menuItem.actionBar) {
menuItem.actionBar.update();
}
}
get text(): string {
return this._getValue(ActionItemBase.textProperty);
return this._getValue(ActionItem.textProperty);
}
set text(value: string) {
this._setValue(ActionItemBase.textProperty, value);
this._setValue(ActionItem.textProperty, value);
}
get icon(): string {
return this._getValue(ActionItemBase.iconProperty);
return this._getValue(ActionItem.iconProperty);
}
set icon(value: string) {
this._setValue(ActionItemBase.iconProperty, value);
this._setValue(ActionItem.iconProperty, value);
}
private _actionBar: ActionBar;
@ -273,10 +273,10 @@ export class ActionItemBase extends bindable.Bindable implements dts.ActionItemB
}
public _raiseTap() {
this._emit(ActionItemBase.tapEvent);
this._emit(ActionItem.tapEvent);
}
}
export class NavigationButton extends ActionItemBase {
public ios: dts.IOSActionItemSettings;
public android: dts.AndroidActionItemSettings;
}

View File

@ -15,7 +15,7 @@ var ACTION_ITEM_ID_OFFSET = 1000;
global.moduleMerge(common, exports);
export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
export class ActionItem extends common.ActionItem {
private _androidPosition: dts.AndroidActionItemSettings = {
position: enums.AndroidActionItemPosition.actionBar,
systemIcon: undefined
@ -27,9 +27,6 @@ export class ActionItem extends common.ActionItemBase implements dts.ActionItem
public set android(value: dts.AndroidActionItemSettings) {
throw new Error("ActionItem.android is read-only");
}
// Not used in Android
public ios: dts.IOSActionItemSettings;
}
export class AndroidActionBarSettings implements dts.AndroidActionBarSettings {
@ -62,6 +59,10 @@ export class AndroidActionBarSettings implements dts.AndroidActionBarSettings {
}
}
export class NavigationButton extends ActionItem {
}
export class ActionBar extends common.ActionBar {
private _appResources: android.content.res.Resources;
private _android: AndroidActionBarSettings;
@ -142,8 +143,18 @@ export class ActionBar extends common.ActionBar {
public _updateNavigationButton() {
var navButton = this.navigationButton;
if (navButton) {
var drawableOrId = getDrawableOrResourceId(navButton.icon, this._appResources);
if (navButton.android.systemIcon) {
// Try to look in the system resources.
let systemResourceId = getSystemResourceId(navButton.android.systemIcon);
if (systemResourceId) {
this._toolbar.setNavigationIcon(systemResourceId);
}
}
else if (navButton.icon) {
let drawableOrId = getDrawableOrResourceId(navButton.icon, this._appResources);
this._toolbar.setNavigationIcon(drawableOrId);
}
this._toolbar.setNavigationOnClickListener(new android.view.View.OnClickListener({
onClick: function (v) {
@ -206,7 +217,7 @@ export class ActionBar extends common.ActionBar {
if (item.android.systemIcon) {
// Try to look in the system resources.
let systemResourceId = android.content.res.Resources.getSystem().getIdentifier(item.android.systemIcon, "drawable", "android");
let systemResourceId = getSystemResourceId(item.android.systemIcon);
if (systemResourceId) {
menuItem.setIcon(systemResourceId);
}
@ -321,3 +332,7 @@ function getIconVisibility(iconVisibility: string): boolean {
return false;
}
}
function getSystemResourceId(systemIcon: string): number {
return android.content.res.Resources.getSystem().getIdentifier(systemIcon, "drawable", "android");
}

View File

@ -85,9 +85,9 @@ declare module "ui/action-bar" {
}
/**
* Base class for action items.
* Represents an action item in the action bar.
*/
export class ActionItemBase extends bindable.Bindable {
export class ActionItem extends bindable.Bindable {
/**
* String value used when hooking to tap event.
*/
@ -134,12 +134,7 @@ declare module "ui/action-bar" {
//@private
_raiseTap(): void;
//@endprivate
}
/**
* Represents an action item in the action bar.
*/
export class ActionItem extends ActionItemBase {
/**
* Gets the iOS specific options of the action item.
*/
@ -160,12 +155,13 @@ declare module "ui/action-bar" {
* 1. actionBar - item is shown in the action bar.
* 2. actionBarIfRoom - item is shown in the action bar if there is room for it. Otherwise it is put in the popup menu.
* 3. popup - item is shown in the popup menu.
* Note: Property not applicable to NavigationButton
*/
position: string;
/**
* Gets or sets the name of the system drawable resource to be displayed.
* Use this property instead of ActionItemBase.icon if you want to diplsay a built-in Android system icon.
* Use this property instead of ActionItem.icon if you want to diplsay a built-in Android system icon.
* 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.
* For a full list of Android drawable names, please visit http://androiddrawables.com
*/
@ -180,12 +176,14 @@ declare module "ui/action-bar" {
* Gets or sets the position of the action item in the action bar.
* 1. left - items is shown at the left part of the navigation bar. This is the default value.
* 2. right - items is shown at the right part of the navigation bar.
* Note: Property not applicable to NavigationButton
*/
position: string;
/**
* Gets or sets a number representing the iOS system item to be displayed.
* Use this property instead of ActionItemBase.icon if you want to diplsay a built-in iOS system icon.
* Use this property instead of ActionItem.icon if you want to diplsay a built-in iOS system icon.
* Note: Property not applicable to NavigationButton
* The value should be a number from the UIBarButtonSystemItem enumeration
* (https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIBarButtonItem_Class/#//apple_ref/c/tdef/UIBarButtonSystemItem)
* 0: Done
@ -240,7 +238,7 @@ declare module "ui/action-bar" {
/**
* Represents the navigation (a.k.a. "back") button.
*/
export class NavigationButton extends ActionItemBase {
export class NavigationButton extends ActionItem {
}

View File

@ -9,7 +9,7 @@ import types = require("utils/types");
global.moduleMerge(common, exports);
export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
export class ActionItem extends common.ActionItem {
private _ios: dts.IOSActionItemSettings = {
position: enums.IOSActionItemPosition.left,
systemIcon: undefined
@ -20,9 +20,10 @@ export class ActionItem extends common.ActionItemBase implements dts.ActionItem
public set ios(value: dts.IOSActionItemSettings) {
throw new Error("ActionItem.android is read-only");
}
}
export class NavigationButton extends ActionItem {
// Not used in IOS
public android: dts.AndroidActionItemSettings;
}
export class ActionBar extends common.ActionBar {
@ -214,9 +215,9 @@ export class ActionBar extends common.ActionBar {
}
class TapBarItemHandlerImpl extends NSObject {
private _owner: WeakRef<dts.ActionItemBase>;
private _owner: WeakRef<dts.ActionItem>;
public static initWithOwner(owner: WeakRef<dts.ActionItemBase>): TapBarItemHandlerImpl {
public static initWithOwner(owner: WeakRef<dts.ActionItem>): TapBarItemHandlerImpl {
let handler = <TapBarItemHandlerImpl>TapBarItemHandlerImpl.new();
handler._owner = owner;
return handler;