@nativescript-community/ui-material-bottom-navigation
Version:
Material Design Bottom Navigation bars allow movement between primary destinations in an app. Tapping on a bottom navigation icon takes you directly to the associated view or refreshes the currently active view.
140 lines • 5.46 kB
JavaScript
import { TabContentItem } from '@nativescript-community/ui-material-core-tabs/tab-content-item';
import { PRIMARY_COLOR, TabNavigation } from '@nativescript-community/ui-material-core-tabs/tab-navigation/index.android';
import { TabStrip } from '@nativescript-community/ui-material-core-tabs/tab-strip';
import { TabStripItem } from '@nativescript-community/ui-material-core-tabs/tab-strip-item';
import { TabsPosition } from '@nativescript-community/ui-material-core-tabs/tab-navigation/index-common';
import { CSSType, Utils } from '@nativescript/core';
export { TabContentItem, TabStrip, TabStripItem };
// eslint-disable-next-line no-redeclare
let BottomNavigationBar;
function initializeNativeClasses() {
if (BottomNavigationBar) {
return;
}
var BottomNavigationBarImplementation = /** @class */ (function (_super) {
__extends(BottomNavigationBarImplementation, _super);
function BottomNavigationBarImplementation(context, owner) {
var _this = _super.call(this, context) || this;
_this.owner = owner;
return global.__native(_this);
}
BottomNavigationBarImplementation.prototype.onSelectedPositionChange = function (position, prevPosition) {
var owner = this.owner;
if (!owner) {
return;
}
owner.onTabsBarSelectedPositionChange(position, prevPosition);
};
BottomNavigationBarImplementation.prototype.onTap = function (position) {
var owner = this.owner;
if (!owner) {
return false;
}
return owner.onTabsBarTap(position);
};
return BottomNavigationBarImplementation;
}(com.nativescript.material.core.BottomNavigationBar));
BottomNavigationBar = BottomNavigationBarImplementation;
}
let BottomNavigation = class BottomNavigation extends TabNavigation {
constructor() {
super(...arguments);
this.tabsPosition = TabsPosition.Bottom;
this.animationEnabled = false;
this.swipeEnabled = false;
}
updateTabsBarItemAt(position, itemSpec) {
this.mTabsBar.updateItemAt(position, itemSpec);
}
setTabsBarSelectedIndicatorColors(colors) {
// nothing to do
}
getTabBarItemView(index) {
return this.mTabsBar.getViewForItemAt(index);
}
getTabBarItemTextView(index) {
return this.mTabsBar.getTextViewForItemAt(index);
}
createNativeTabBar(context) {
initializeNativeClasses();
const tabsBar = new BottomNavigationBar(context, this);
const primaryColor = Utils.android.resources.getPaletteColor(PRIMARY_COLOR, context);
if (primaryColor) {
tabsBar.setBackgroundColor(primaryColor);
}
tabsBar.setSelectedPosition(this.selectedIndex);
return tabsBar;
}
setTabBarItems(tabItems) {
this.mTabsBar.setItems(tabItems);
}
selectTabBar(oldIndex, newIndex) {
this.mTabsBar.setSelectedPosition(newIndex);
}
onLoaded() {
super.onLoaded();
if (!this.tabStrip && this.mTabsBar) {
// manually set the visibility, so that the grid layout remeasures
this.mTabsBar.setVisibility(android.view.View.GONE);
}
// if (this._attachedToWindow) {
// this.changeTab(this.selectedIndex);
// }
}
// _onAttachedToWindow(): void {
// super._onAttachedToWindow();
// // this.changeTab(this.selectedIndex);
// }
updateAndroidItemAt(index, spec) {
// that try catch is fix for an android NPE error on css change which navigated in (not the current fragment)
try {
if (this.mTabsBar) {
this.mTabsBar.updateItemAt(index, spec);
}
}
catch (err) { }
}
setTabBarBackgroundColor(value) {
super.setTabBarBackgroundColor(value);
// this.updateTabStripItems();
}
// private updateTabStripItems(): void {
// this.tabStrip.items.forEach((tabStripItem: TabStripItem) => {
// if (tabStripItem.nativeView) {
// const tabItemSpec = this.createTabItemSpec(tabStripItem);
// this.updateAndroidItemAt(tabStripItem._index, tabItemSpec);
// }
// });
// }
_setItemsColors(items) {
items.forEach((item) => {
if (item.nativeView) {
this._setItemColor(item);
}
});
}
setTabBarSelectedItemColor(value) {
super.setTabBarSelectedItemColor(value);
this._setItemsColors(this.tabStrip.items);
}
setTabBarUnSelectedItemColor(value) {
super.setTabBarUnSelectedItemColor(value);
this._setItemsColors(this.tabStrip.items);
}
onTabsBarSelectedPositionChange(position, prevPosition) {
this.mViewPager.setCurrentItem(position, this.animationEnabled);
const tabStripItems = this.tabStrip && this.tabStrip.items;
if (position >= 0 && tabStripItems && tabStripItems[position]) {
tabStripItems[position]._emit(TabStripItem.selectEvent);
}
if (prevPosition >= 0 && tabStripItems && tabStripItems[prevPosition]) {
tabStripItems[prevPosition]._emit(TabStripItem.unselectEvent);
}
this._setItemsColors(this.tabStrip.items);
}
};
BottomNavigation = __decorate([
CSSType('BottomNavigation')
], BottomNavigation);
export { BottomNavigation };
//# sourceMappingURL=index.android.js.map