refactor(bottom-navigation): strip item creation (#7477)

vchimev · ADjenkov · commit eb1ed3e4eccd · 2019-07-10T17:37:45.000+03:00
* feat(ios-tabs): tab bar item appearance Implements #7436 and NativeScript/nativescript-angular#1884. * refactor(ios-tabs): move _hasImage and _hasTitle properties * feat(ios-bottom-navigation): create tab bar from image nad label Implements NativeScript/nativescript-angular#1893 for iOS. * feat(android-bottom-navigation): create tab item spec from image and label Implements NativeScript/nativescript-angular#1893 for Android. * chore: remove console.logs
diff --git a/tns-core-modules/ui/bottom-navigation/bottom-navigation.android.ts b/tns-core-modules/ui/bottom-navigation/bottom-navigation.android.ts
@@ -12,6 +12,8 @@ import { CSSType, Color } from "../core/view";
 import { Frame, View } from "../frame";
 import { RESOURCE_PREFIX, ad, layout } from "../../utils/utils";
 import { fromFileOrResource } from "../../image-source";
+import * as application from "../../application";
+
 // TODO: Impl trace
 // import { isEnabled as traceEnabled, write as traceWrite } from "../../../trace";
 
@@ -159,34 +161,35 @@ function initializeNativeClasses() {
 }
 
 function createTabItemSpec(tabStripItem: TabStripItem): org.nativescript.widgets.TabItemSpec {
-    const result = new org.nativescript.widgets.TabItemSpec();
-    result.title = tabStripItem.title;
-
-    if (tabStripItem.backgroundColor instanceof Color) {
-        result.backgroundColor = tabStripItem.backgroundColor.android;
-    }
-
-    if (tabStripItem.iconSource) {
-        if (tabStripItem.iconSource.indexOf(RESOURCE_PREFIX) === 0) {
-            result.iconId = ad.resources.getDrawableId(tabStripItem.iconSource.substr(RESOURCE_PREFIX.length));
-            if (result.iconId === 0) {
+    let iconSource;
+    const tabItemSpec = new org.nativescript.widgets.TabItemSpec();
+
+    // Image and Label children of TabStripItem
+    // take priority over its `iconSource` and `title` properties
+    iconSource = tabStripItem.image ? tabStripItem.image.src : tabStripItem.iconSource;
+    tabItemSpec.title = tabStripItem.label ? tabStripItem.label.text : tabStripItem.title;
+
+    if (iconSource) {
+        if (iconSource.indexOf(RESOURCE_PREFIX) === 0) {
+            tabItemSpec.iconId = ad.resources.getDrawableId(iconSource.substr(RESOURCE_PREFIX.length));
+            if (tabItemSpec.iconId === 0) {
                 // TODO:
-                // traceMissingIcon(tabStripItem.iconSource);
+                // traceMissingIcon(iconSource);
             }
         } else {
             const is = fromFileOrResource(tabStripItem.iconSource);
             if (is) {
                 // TODO: Make this native call that accepts string so that we don't load Bitmap in JS.
                 // tslint:disable-next-line:deprecation
-                result.iconDrawable = new android.graphics.drawable.BitmapDrawable(is.android);
+                tabItemSpec.iconDrawable = new android.graphics.drawable.BitmapDrawable(application.android.context.getResources(), is.android);
             } else {
                 // TODO:
-                // traceMissingIcon(tabStripItem.iconSource);
+                // traceMissingIcon(iconSource);
             }
         }
     }
 
-    return result;
+    return tabItemSpec;
 }
 
 function setElevation(grid: org.nativescript.widgets.GridLayout, bottomNavigationBar: org.nativescript.widgets.BottomNavigationBar) {
@@ -471,7 +474,7 @@ export class BottomNavigation extends TabNavigationBase {
             }
 
             this._currentFragment = fragment;
-        
+
             const tabItems = this.items;
             const tabItem = tabItems ? tabItems[position] : null;
             if (tabItem) {
diff --git a/tns-core-modules/ui/bottom-navigation/bottom-navigation.ios.ts b/tns-core-modules/ui/bottom-navigation/bottom-navigation.ios.ts
@@ -1,4 +1,4 @@
-﻿// Types
+// Types
 import { TabContentItem } from "../tab-navigation-base/tab-content-item";
 import { TabStripItem } from "../tab-navigation-base/tab-strip-item";
 import { TextTransform } from "../text-base";
@@ -500,15 +500,9 @@ export class BottomNavigation extends TabNavigationBase {
         items.forEach((item, i) => {
             const controller = this.getViewController(item);
 
-            let icon = null;
-            let title = "";
-
             if (this.tabStrip && this.tabStrip.items && this.tabStrip.items[i]) {
                 const tabStripItem = <TabStripItem>this.tabStrip.items[i];
-                icon = this._getIcon(tabStripItem.iconSource);
-                title = tabStripItem.title;
-
-                const tabBarItem = UITabBarItem.alloc().initWithTitleImageTag((title || ""), icon, i);
+                const tabBarItem = this.createTabBarItem(tabStripItem, i);
                 updateTitleAndIconPositions(tabStripItem, tabBarItem, controller);
 
                 applyStatesToItem(tabBarItem, states);
@@ -528,6 +522,20 @@ export class BottomNavigation extends TabNavigationBase {
         this._ios.moreNavigationController.delegate = this._moreNavigationControllerDelegate;
     }
 
+    private createTabBarItem(item: TabStripItem, index: number): UITabBarItem {
+        let image: UIImage;
+        let title: string;
+
+        // Image and Label children of TabStripItem
+        // take priority over its `iconSource` and `title` properties
+        image = item.image ? this._getIcon(item.image.src) : this._getIcon(item.iconSource);
+        title = item.label ? item.label.text : item.title;
+
+        const tabBarItem = UITabBarItem.alloc().initWithTitleImageTag(title, image, index);
+
+        return tabBarItem;
+    }
+
     private _getIconRenderingMode(): UIImageRenderingMode {
         return UIImageRenderingMode.AlwaysOriginal;
     }
@@ -632,4 +640,4 @@ function applyStatesToItem(item: UITabBarItem, states: TabStates) {
 
     item.setTitleTextAttributesForState(states.normalState, UIControlState.Normal);
     item.setTitleTextAttributesForState(states.selectedState, UIControlState.Selected);
-}
+}
diff --git a/tns-core-modules/ui/tabs/tabs.ios.ts b/tns-core-modules/ui/tabs/tabs.ios.ts
@@ -345,8 +345,6 @@ class UIPageViewControllerDelegateImpl extends NSObject implements UIPageViewCon
         // } else {
         //     owner.selectedIndex++;
         // }
-        console.log("test");
-        //
     }
 
     public pageViewControllerDidFinishAnimatingPreviousViewControllersTransitionCompleted(pageViewController: UIPageViewController, didFinishAnimating: boolean, previousViewControllers: NSArray<UIViewController>, transitionCompleted: boolean): void {
@@ -364,9 +362,6 @@ class UIPageViewControllerDelegateImpl extends NSObject implements UIPageViewCon
             owner.selectedIndex = nextViewControllerIndex;
             owner._canSelectItem = true;
         }
-
-        console.log("test");
-        //
     }
 }
 

Original file line number	Diff line number	Diff line change
`@@ -345,8 +345,6 @@ class UIPageViewControllerDelegateImpl extends NSObject implements UIPageViewCon`
`345`	`345`	`// } else {`
`346`	`346`	`// owner.selectedIndex++;`
`347`	`347`	`// }`
`348`		`- console.log("test");`
`349`		`- //`
`350`	`348`	`}`
`351`	`349`
`352`	`350`	`public pageViewControllerDidFinishAnimatingPreviousViewControllersTransitionCompleted(pageViewController: UIPageViewController, didFinishAnimating: boolean, previousViewControllers: NSArray<UIViewController>, transitionCompleted: boolean): void {`
`@@ -364,9 +362,6 @@ class UIPageViewControllerDelegateImpl extends NSObject implements UIPageViewCon`
`364`	`362`	`owner.selectedIndex = nextViewControllerIndex;`
`365`	`363`	`owner._canSelectItem = true;`
`366`	`364`	`}`
`367`		`-`
`368`		`- console.log("test");`
`369`		`- //`
`370`	`365`	`}`
`371`	`366`	`}`
`372`	`367`