javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-14 18:12:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(ios-bot-nav): incorrect layout on orientation change (#7927)

Browse Source
This commit is contained in:
Martin Yankov
2019-10-23 13:31:19 +03:00
committed by Manol Donev
parent 7e87fe0018
commit c9bfec1cbe
6 changed files with 54 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
nativescript-core/ui/bottom-navigation/bottom-navigation.android.ts
View File

@ -547,8 +547,8 @@ export class BottomNavigation extends TabNavigationBase {
}
const tabItems = new Array<org.nativescript.widgets.TabItemSpec>();
items.forEach((item, i, arr) => {
(<any>item).index = i;
items.forEach((tabStripItem, i, arr) => {
tabStripItem._index = i;
if (items[i]) {
const tabItemSpec = this.createTabItemSpec(items[i]);
tabItems.push(tabItemSpec);
@ -699,7 +699,7 @@ export class BottomNavigation extends TabNavigationBase {
}
public setTabBarIconColor(tabStripItem: TabStripItem, value: number | Color): void {
const index = (<any>tabStripItem).index;
const index = tabStripItem._index;
const tabBarItem = this._bottomNavigationBar.getViewForItemAt(index);
const imgView = <android.widget.ImageView>tabBarItem.getChildAt(0);
const drawable = this.getIcon(tabStripItem);

51
nativescript-core/ui/bottom-navigation/bottom-navigation.ios.ts
View File

@ -72,12 +72,19 @@ class UITabBarControllerImpl extends UITabBarController {
public viewWillTransitionToSizeWithTransitionCoordinator(size: CGSize, coordinator: UIViewControllerTransitionCoordinator): void {
super.viewWillTransitionToSizeWithTransitionCoordinator(size, coordinator);
UIViewControllerTransitionCoordinator.prototype.animateAlongsideTransitionCompletion
.call(coordinator, null, () => {
.call(coordinator, () => {
const owner = this._owner.get();
if (owner && owner.items) {
// owner.items.forEach(tabItem => tabItem._updateTitleAndIconPositions()); TODO:
if (owner && owner.tabStrip && owner.tabStrip.items) {
const tabStrip = owner.tabStrip;
tabStrip.items.forEach(tabStripItem => {
updateBackgroundPositions(tabStrip, tabStripItem);
const index = tabStripItem._index;
const tabBarItemController = this.viewControllers[index];
updateTitleAndIconPositions(tabStripItem, tabBarItemController.tabBarItem, tabBarItemController);
});
}
});
}, null);
}
// Mind implementation for other controllers
@ -213,6 +220,26 @@ class UINavigationControllerDelegateImpl extends NSObject implements UINavigatio
}
}
function updateBackgroundPositions(tabStrip: TabStrip, tabStripItem: TabStripItem) {
let bgView = (<any>tabStripItem).bgView;
if (!bgView) {
const index = tabStripItem._index;
const width = tabStrip.nativeView.frame.size.width / tabStrip.items.length;
const frame = CGRectMake(width * index, 0, width, tabStrip.nativeView.frame.size.width);
bgView = UIView.alloc().initWithFrame(frame);
tabStrip.nativeView.insertSubviewAtIndex(bgView, 0);
(<any>tabStripItem).bgView = bgView;
} else {
const index = tabStripItem._index;
const width = tabStrip.nativeView.frame.size.width / tabStrip.items.length;
const frame = CGRectMake(width * index, 0, width, tabStrip.nativeView.frame.size.width);
bgView.frame = frame;
}
const backgroundColor = tabStripItem.style.backgroundColor;
bgView.backgroundColor = backgroundColor instanceof Color ? backgroundColor.ios : backgroundColor;
}
function updateTitleAndIconPositions(tabStripItem: TabStripItem, tabBarItem: UITabBarItem, controller: UIViewController) {
if (!tabStripItem || !tabBarItem) {
return;
@ -345,21 +372,11 @@ export class BottomNavigation extends TabNavigationBase {
}
public setTabBarItemBackgroundColor(tabStripItem: TabStripItem, value: UIColor | Color): void {
if (!this.tabStrip) {
if (!this.tabStrip || !tabStripItem) {
return;
}
let bgView = (<any>tabStripItem).bgView;
if (!bgView) {
const index = (<any>tabStripItem).index;
const width = this.tabStrip.nativeView.frame.size.width / this.tabStrip.items.length;
const frame = CGRectMake(width * index, 0, width, this.tabStrip.nativeView.frame.size.width);
bgView = UIView.alloc().initWithFrame(frame);
this.tabStrip.nativeView.insertSubviewAtIndex(bgView, 0);
(<any>tabStripItem).bgView = bgView;
}
bgView.backgroundColor = value instanceof Color ? value.ios : value;
updateBackgroundPositions(this.tabStrip, tabStripItem);
}
public setTabBarItemColor(tabStripItem: TabStripItem, value: UIColor | Color): void {
@ -509,7 +526,7 @@ export class BottomNavigation extends TabNavigationBase {
applyStatesToItem(tabBarItem, states);
controller.tabBarItem = tabBarItem;
(<any>tabStripItem).index = i;
tabStripItem._index = i;
tabStripItem.setNativeView(tabBarItem);
}

6
nativescript-core/ui/tab-navigation-base/tab-strip-item/tab-strip-item.d.ts vendored
View File

@ -37,6 +37,12 @@ export class TabStripItem extends View {
public static tapEvent: string;
//@private
/**
* @private
*/
_index: number;
/**
* @private
*/

3
nativescript-core/ui/tab-navigation-base/tab-strip-item/tab-strip-item.ts
View File

@ -26,6 +26,7 @@ export class TabStripItem extends View implements TabStripItemDefinition, AddChi
public image: Image;
public label: Label;
public _index: number;
private _title: string;
private _iconSource: string;
@ -211,7 +212,7 @@ export class TabStripItem extends View implements TabStripItemDefinition, AddChi
const parent = <TabStrip>this.parent;
const tabStripParent = parent && <TabNavigationBase>parent.parent;
if ((<any>this).index === tabStripParent.selectedIndex &&
if (this._index === tabStripParent.selectedIndex &&
!(isIOS && tabStripParent instanceof Tabs)) {
this._goToVisualState("highlighted");
}

10
nativescript-core/ui/tabs/tabs.android.ts
View File

@ -617,10 +617,10 @@ export class Tabs extends TabsBase {
}
const tabItems = new Array<org.nativescript.widgets.TabItemSpec>();
items.forEach((item: TabStripItem, i, arr) => {
(<any>item).index = i;
const tabItemSpec = this.createTabItemSpec(item);
(<any>item).tabItemSpec = tabItemSpec;
items.forEach((tabStripItem: TabStripItem, i, arr) => {
tabStripItem._index = i;
const tabItemSpec = this.createTabItemSpec(tabStripItem);
(<any>tabStripItem).tabItemSpec = tabItemSpec;
tabItems.push(tabItemSpec);
});
@ -808,7 +808,7 @@ export class Tabs extends TabsBase {
}
public setTabBarIconColor(tabStripItem: TabStripItem, value: number | Color): void {
const index = (<any>tabStripItem).index;
const index = tabStripItem._index;
const tabBarItem = this._tabsBar.getViewForItemAt(index);
const imgView = <android.widget.ImageView>tabBarItem.getChildAt(0);
const drawable = this.getIcon(tabStripItem);

8
nativescript-core/ui/tabs/tabs.ios.ts
View File

@ -848,11 +848,11 @@ export class Tabs extends TabsBase {
const tabBarItems = [];
items.forEach((item: TabStripItem, i) => {
(<any>item).index = i;
const tabBarItem = this.createTabBarItem(item, i);
items.forEach((tabStripItem: TabStripItem, i) => {
tabStripItem._index = i;
const tabBarItem = this.createTabBarItem(tabStripItem, i);
tabBarItems.push(tabBarItem);
item.setNativeView(tabBarItem);
tabStripItem.setNativeView(tabBarItem);
});
this.tabBarItems = tabBarItems;