API changes - ios and android settings objcets

apps/action-bar-demo/pages/action-items-text.xml

@@ -2,9 +2,9 @@
   <Page.actionBar>
     <ActionBar title="Title">
       <ActionBar.actionItems>
-        <ActionItem text="left"  tap="leftTap"  iosPosition="left"/>
+        <ActionItem text="left"  tap="leftTap"  ios.position="left"/>
-        <ActionItem text="right" tap="rightTap" iosPosition="right"/>
+        <ActionItem text="right" tap="rightTap" ios.position="right"/>
-        <ActionItem text="pop"   tap="popTap"   iosPosition="right"  androidPosition="popup"/>
+        <ActionItem text="pop"   tap="popTap"   ios.position="right"  android.position="popup"/>
       </ActionBar.actionItems>
     </ActionBar>
   </Page.actionBar>

apps/action-bar-demo/pages/data-binding.xml

@@ -3,8 +3,8 @@
     <ActionBar title="{{ title }}" icon="{{ mainIcon }}">
       <NavigationButton text="{{ navText }}" icon="{{ navIcon }}" tap="{{ navTap }}"/>
       <ActionBar.actionItems>
-        <ActionItem text="{{ firstItemText }}" tap="{{ firstItemTap }}"  iosPosition="left"/>
+        <ActionItem text="{{ firstItemText }}" tap="{{ firstItemTap }}"  ios.position="left"/>
-        <ActionItem icon="{{ secondItemIcon }}" tap="{{ secondItemTap }}" iosPosition="right"/>
+        <ActionItem icon="{{ secondItemIcon }}" tap="{{ secondItemTap }}" ios.position="right"/>
       </ActionBar.actionItems>
     </ActionBar>
   </Page.actionBar>

apps/action-bar-demo/pages/navigation-button.ts

@@ -28,17 +28,19 @@ var j = 0;
 export function visibilityTap(args: observable.EventData) {
     var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
 
-    if (j % 3 === 0) {
+    if (page.actionBar.android) {
-        page.actionBar.androidIconVisibility = "always";
+        if (j % 3 === 0) {
+            page.actionBar.android.iconVisibility = "always";
+        }
+        else if (j % 3 === 1) {
+            page.actionBar.android.iconVisibility = "never";
+        }
+        else if (j % 3 === 2) {
+            page.actionBar.android.iconVisibility = "auto";
+        }
+        j++;
+        console.log("Visibility changed to: " + page.actionBar.android.iconVisibility);
     }
-    else if (j % 3 === 1) {
-        page.actionBar.androidIconVisibility = "never";
-    }
-    else if (j % 3 === 2) {
-        page.actionBar.androidIconVisibility = "auto";
-    }
-    j++;
-    console.log("Visibility changed to: " + page.actionBar.androidIconVisibility);
 }
 
 export function navTap(args: observable.EventData) {

apps/action-bar-demo/pages/page-title-icon.ts

@@ -5,16 +5,18 @@ import view = require("ui/core/view");
 var i = 0;
 export function buttonTap(args: observable.EventData) {
     var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
-
     page.actionBar.title = "Title changed " + i++;
-    if (i % 3 === 0) {
+
-        page.actionBar.icon = "res://ic_test";
+    if (page.actionBar.android) {
-    }
+        if (i % 3 === 0) {
-    else if (i % 3 === 1) {
+            page.actionBar.android.icon = "res://ic_test";
-        page.actionBar.icon = "~/test-icon.png";
+        }
-    }
+        else if (i % 3 === 1) {
-    else if (i % 3 === 2) {
+            page.actionBar.android.icon = "~/test-icon.png";
-        page.actionBar.icon = undefined;
+        }
+        else if (i % 3 === 2) {
+            page.actionBar.android.icon = undefined;
+        }
     }
 }
 
@@ -22,15 +24,17 @@ var j = 0;
 export function visibilityTap(args: observable.EventData) {
     var page = <pages.Page>view.getAncestor(<view.View>args.object, "Page")
 
-    if (j % 3 === 0) {
+    if (page.actionBar.android) {
-        page.actionBar.androidIconVisibility = "always";
+        if (j % 3 === 0) {
+            page.actionBar.android.iconVisibility = "always";
+        }
+        else if (j % 3 === 1) {
+            page.actionBar.android.iconVisibility = "never";
+        }
+        else if (j % 3 === 2) {
+            page.actionBar.android.iconVisibility = "auto";
+        }
+        j++;
+        console.log("Visibility changed to: " + page.actionBar.android.iconVisibility);
     }
-    else if (j % 3 === 1) {
-        page.actionBar.androidIconVisibility = "never";
-    }
-    else if (j % 3 === 2) {
-        page.actionBar.androidIconVisibility = "auto";
-    }
-    j++;
-    console.log("Visibility changed to: " + page.actionBar.androidIconVisibility);
 }

apps/tests/pages/page17.ts

@@ -23,14 +23,17 @@ export function optionTap(args) {
 var i = 0;
 export function buttonTap(args: observable.EventData) {
     currentPage.actionBar.title = "hi " + i++;
-    if (i % 3 === 0) {
+
-        currentPage.actionBar.icon = "res://ic_test";
+    if (currentPage.actionBar.android) {
-    }
+        if (i % 3 === 0) {
-    else if (i % 3 === 1) {
+            currentPage.actionBar.android.icon = "res://ic_test";
-        currentPage.actionBar.icon = "~/test-icon.png";
+        }
-    }
+        else if (i % 3 === 1) {
-    else if (i % 3 === 2) {
+            currentPage.actionBar.android.icon = "~/test-icon.png";
-        currentPage.actionBar.icon = undefined;
+        }
+        else if (i % 3 === 2) {
+            currentPage.actionBar.android.icon = undefined;
+        }
     }
 }
 

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

@@ -19,16 +19,9 @@ function onTitlePropertyChanged(data: dependencyObservable.PropertyChangeData) {
     actionBar._onTitlePropertyChanged();
 }
 
-function onIconPropertyChanged(data: dependencyObservable.PropertyChangeData) {
-    var actionBar = <ActionBar>data.object;
-    actionBar._onIconPropertyChanged();
-}
-
 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));
-    public static iconProperty = new dependencyObservable.Property("icon", "ActionBar", new proxy.PropertyMetadata(undefined, dependencyObservable.PropertyMetadataSettings.None, onIconPropertyChanged));
+    
-    public static androidIconVisibilityProperty = new dependencyObservable.Property("androidIconVisibility", "ActionBar", new proxy.PropertyMetadata("auto", dependencyObservable.PropertyMetadataSettings.None, onIconPropertyChanged));
-
     private _actionItems: ActionItems;
     private _navigationButton: NavigationButton;
     private _page: pages.Page;
@@ -41,20 +34,6 @@ export class ActionBar extends view.View implements dts.ActionBar {
         this._setValue(ActionBar.titleProperty, value);
     }
 
-    get icon(): string {
-        return this._getValue(ActionBar.iconProperty);
-    }
-    set icon(value: string) {
-        this._setValue(ActionBar.iconProperty, value);
-    }
-
-    get androidIconVisibility(): string {
-        return this._getValue(ActionBar.androidIconVisibilityProperty);
-    }
-    set androidIconVisibility(value: string) {
-        this._setValue(ActionBar.androidIconVisibilityProperty, value);
-    }
-
     get navigationButton(): NavigationButton {
         return this._navigationButton;
     }
@@ -117,6 +96,10 @@ export class ActionBar extends view.View implements dts.ActionBar {
         }, this._page);
     }
 
+    get android(): dts.AndroidActionBarSettings {
+        return undefined;
+    }
+
     get _childrenCount(): number {
         return this.titleView ? 1 : 0;
     }
@@ -136,10 +119,6 @@ export class ActionBar extends view.View implements dts.ActionBar {
         //
     }
 
-    public _onIconPropertyChanged() {
-        //
-    }
-
     public _updateAndroidActionBar(menu: android.view.IMenu) {
         //
     }
@@ -181,7 +160,7 @@ export class ActionBar extends view.View implements dts.ActionBar {
 
     public shouldShow(): boolean {
         if (this.title ||
-            this.icon ||
+            (this.android && this.android.icon) ||
             this.navigationButton ||
             this.actionItems.getItems().length > 0) {
 
@@ -193,14 +172,14 @@ export class ActionBar extends view.View implements dts.ActionBar {
 }
 
 export class ActionItems implements dts.ActionItems {
-    private _items: Array<ActionItem> = new Array<ActionItem>();
+    private _items: Array<dts.ActionItem> = new Array<dts.ActionItem>();
     private _actionBar: ActionBar;
 
     constructor(actionBar: ActionBar) {
         this._actionBar = actionBar;
     }
 
-    public addItem(item: ActionItem): void {
+    public addItem(item: dts.ActionItem): void {
         if (!item) {
             throw new Error("Cannot add empty item");
         }
@@ -210,7 +189,7 @@ export class ActionItems implements dts.ActionItems {
         this.invalidate();
     }
 
-    public removeItem(item: ActionItem): void {
+    public removeItem(item: dts.ActionItem): void {
         if (!item) {
             throw new Error("Cannot remove empty item");
         }
@@ -225,11 +204,11 @@ export class ActionItems implements dts.ActionItems {
         this.invalidate();
     }
 
-    public getItems(): Array<ActionItem> {
+    public getItems(): Array<dts.ActionItem> {
         return this._items.slice();
     }
 
-    public getItemAt(index: number): ActionItem {
+    public getItemAt(index: number): dts.ActionItem {
         if (index < 0 || index >= this._items.length) {
             return undefined;
         }
@@ -237,7 +216,7 @@ export class ActionItems implements dts.ActionItems {
         return this._items[index];
     }
 
-    public setItems(items: Array<ActionItem>) {
+    public setItems(items: Array<dts.ActionItem>) {
         // Remove all existing items
         while (this._items.length > 0) {
             this.removeItem(this._items[this._items.length - 1]);
@@ -268,7 +247,7 @@ export class ActionItemBase extends bindable.Bindable implements dts.ActionItemB
         "icon", "ActionItemBase", new dependencyObservable.PropertyMetadata(null, null, ActionItemBase.onItemChanged));
 
     private static onItemChanged(data: dependencyObservable.PropertyChangeData) {
-        var menuItem = <ActionItem>data.object;
+        var menuItem = <ActionItemBase>data.object;
         if (menuItem.actionBar) {
             menuItem.actionBar.updateActionBar();
         }
@@ -302,27 +281,7 @@ export class ActionItemBase extends bindable.Bindable implements dts.ActionItemB
     }
 
     public _raiseTap() {
-        this._emit(ActionItem.tapEvent);
+        this._emit(ActionItemBase.tapEvent);
-    }
-
-}
-
-export class ActionItem extends ActionItemBase {
-    private _androidPosition: string = enums.AndroidActionItemPosition.actionBar;
-    private _iosPosition: string = enums.IOSActionItemPosition.right;
-
-    get androidPosition(): string {
-        return this._androidPosition;
-    }
-    set androidPosition(value: string) {
-        this._androidPosition = value;
-    }
-
-    get iosPosition(): string {
-        return this._iosPosition;
-    }
-    set iosPosition(value: string) {
-        this._iosPosition = value;
     }
 }
 

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

@@ -6,6 +6,7 @@ import utils = require("utils/utils");
 import imageSource = require("image-source");
 import enums = require("ui/enums");
 import application = require("application");
+import dts = require("ui/action-bar");
 
 var ACTION_ITEM_ID_OFFSET = 1000;
 var API_LVL = android.os.Build.VERSION.SDK_INT;
@@ -13,14 +14,71 @@ var API_LVL = android.os.Build.VERSION.SDK_INT;
 declare var exports;
 require("utils/module-merge").merge(common, exports);
 
+export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
+    private _androidPosition: dts.AndroidActionItemSettings = { position: enums.AndroidActionItemPosition.actionBar };
+
+    public get android(): dts.AndroidActionItemSettings {
+        return this._androidPosition;
+    }
+    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 {
+    private _actionBar: ActionBar;
+    private _icon: string;
+    private _iconVisibility: string = enums.AndroidActionBarIconVisibility.auto;
+
+    public get icon(): string {
+        return this._icon;
+    }
+    public set icon(value: string) {
+        if (value !== this._icon) {
+            this._icon = value;
+            this._actionBar._onIconPropertyChanged();
+        }
+    }
+
+    public get iconVisibility(): string {
+        return this._iconVisibility;
+    }
+    public set iconVisibility(value: string) {
+        if (value !== this._iconVisibility) {
+            this._iconVisibility = value;
+            this._actionBar._onIconPropertyChanged();
+        }
+    }
+
+    constructor(actionBar: ActionBar) {
+        this._actionBar = actionBar;
+    }
+}
+
 export class ActionBar extends common.ActionBar {
     private _appResources: android.content.res.Resources;
+    private _android: AndroidActionBarSettings;
+
+    get android(): AndroidActionBarSettings {
+        return this._android;
+    }
+
+    set android(value: AndroidActionBarSettings) {
+        throw new Error("ActionBar.android is read-only");
+    }
+
+    get _nativeView() {
+        return undefined;
+    }
 
     constructor() {
         super();
 
         this._appResources = application.android.context.getResources();
-        this.actionItems
+        this._android = new AndroidActionBarSettings(this);
     }
 
     public updateActionBar() {
@@ -39,7 +97,6 @@ export class ActionBar extends common.ActionBar {
         if (this.navigationButton && itemId === (<any>android).R.id.home) {
             this.navigationButton._raiseTap();
             return true;
-
         }
 
         return false;
@@ -80,7 +137,7 @@ export class ActionBar extends common.ActionBar {
     }
 
     public _updateIcon(actionBar: android.app.ActionBar) {
-        var icon = this.icon;
+        var icon = this.android.icon;
         if (types.isDefined(icon)) {
             var drawableOrId = getDrawableOrResourceId(icon, this._appResources);
             if (drawableOrId) {
@@ -92,12 +149,7 @@ export class ActionBar extends common.ActionBar {
             actionBar.setIcon(defaultIcon);
         }
 
-        var iconVisibility: boolean;
+        var visibility = getIconVisibility(this.android.iconVisibility);
-        if (this.androidIconVisibility === enums.AndroidActionBarIconVisibility.always) {
-            iconVisibility = true;
-        }
-
-        var visibility = getIconVisibility(this.androidIconVisibility);
         actionBar.setDisplayShowHomeEnabled(visibility);
     }
 
@@ -211,8 +263,8 @@ function getDrawableOrResourceId(icon: string, resources: android.content.res.Re
     return undefined;
 }
 
-function getShowAsAction(menuItem: common.ActionItem): number {
+function getShowAsAction(menuItem: dts.ActionItem): number {
-    switch (menuItem.androidPosition) {
+    switch (menuItem.android.position) {
         case enums.AndroidActionItemPosition.actionBarIfRoom:
             return android.view.MenuItem.SHOW_AS_ACTION_IF_ROOM;
 

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

@@ -7,13 +7,13 @@
 
     export class ActionBar extends view.View implements view.AddArrayFromBuilder, view.AddChildFromBuilder {
         title: string;
-        icon: string;
-        androidIconVisibility: string;
 
         navigationButton: NavigationButton;
         actionItems: ActionItems;
         titleView: view.View;
 
+        android: AndroidActionBarSettings;
+
         page: pages.Page;
 
         shouldShow(): boolean
@@ -55,6 +55,7 @@
 
         text: string;
         icon: string;
+        actionBar: ActionBar;
 
         /**
          * A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
@@ -75,10 +76,23 @@
     }
 
     export class ActionItem extends ActionItemBase {
-        androidPosition: string;
+        ios: IOSActionItemSettings;
-        iosPosition: string;
+        android: AndroidActionItemSettings;
+    }
+    
+    export interface AndroidActionItemSettings {
+        position: string;
+    }
+    
+    export interface IOSActionItemSettings {
+        position: string;
     }
 
+    export interface AndroidActionBarSettings {
+        icon: string;
+        iconVisibility: string;
+    }
+    
     export class NavigationButton extends ActionItemBase {
 
     }

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

@@ -1,5 +1,5 @@
 import common = require("ui/action-bar/action-bar-common");
-import definition = require("ui/action-bar");
+import dts = require("ui/action-bar");
 import imageSource = require("image-source");
 import frameModule = require("ui/frame");
 import enums = require("ui/enums");
@@ -9,6 +9,19 @@ import utils = require("utils/utils");
 declare var exports;
 require("utils/module-merge").merge(common, exports);
 
+export class ActionItem extends common.ActionItemBase implements dts.ActionItem {
+    private _ios: dts.IOSActionItemSettings = { position: enums.IOSActionItemPosition.left };
+    public get ios(): dts.IOSActionItemSettings {
+        return this._ios;
+    }
+    public set ios(value: dts.IOSActionItemSettings) {
+        throw new Error("ActionItem.android is read-only");
+    }
+
+    // Not used in IOS
+    public android: dts.AndroidActionItemSettings;
+}
+
 export class ActionBar extends common.ActionBar {
     public updateActionBar() {
         // Page should be attached to frame to update the action bar.
@@ -75,7 +88,7 @@ export class ActionBar extends common.ActionBar {
 
         for (var i = 0; i < items.length; i++) {
             var barButtonItem = this.createBarButtonItem(items[i]);
-            if (items[i].iosPosition === enums.IOSActionItemPosition.left) {
+            if (items[i].ios.position === enums.IOSActionItemPosition.left) {
                 leftBarItems.push(barButtonItem);
             }
             else {
@@ -96,7 +109,7 @@ export class ActionBar extends common.ActionBar {
         navigationItem.setRightBarButtonItemsAnimated(rightArray, true);
     }
 
-    private createBarButtonItem(item: common.ActionItemBase): UIBarButtonItem {
+    private createBarButtonItem(item: dts.ActionItem): UIBarButtonItem {
         var tapHandler = TapBarItemHandlerImpl.new().initWithOwner(item);
         // associate handler with menuItem or it will get collected by JSC.
         (<any>item).handler = tapHandler;
@@ -144,7 +157,7 @@ export class ActionBar extends common.ActionBar {
 
     protected get navigationBarHeight(): number {
         var navController = frameModule.topmost().ios.controller;
-        if(!navController){
+        if (!navController) {
             return 0;
         }
         var navigationBar = navController.navigationBar;
@@ -157,9 +170,9 @@ class TapBarItemHandlerImpl extends NSObject {
         return <TapBarItemHandlerImpl>super.new();
     }
 
-    private _owner: definition.ActionItemBase;
+    private _owner: dts.ActionItemBase;
 
-    public initWithOwner(owner: definition.ActionItemBase): TapBarItemHandlerImpl {
+    public initWithOwner(owner: dts.ActionItemBase): TapBarItemHandlerImpl {
         this._owner = owner;
         return this;
     }