nativescript-bottom-navigation
Version:
NativeScript plugin to add a bottom navigation component for Android & iOS
100 lines • 4.85 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var platform_1 = require("tns-core-modules/platform");
var application_1 = require("tns-core-modules/application");
var view_1 = require("tns-core-modules/ui/core/view");
var bottom_navigation_bar_base_1 = require("../base/bottom-navigation-bar.base");
var bottom_navigation_bar_delegate_1 = require("./bottom-navigation-bar.delegate");
var BottomNavigationBar = (function (_super) {
__extends(BottomNavigationBar, _super);
function BottomNavigationBar() {
return _super !== null && _super.apply(this, arguments) || this;
}
Object.defineProperty(BottomNavigationBar.prototype, "ios", {
get: function () {
return this.nativeView;
},
enumerable: true,
configurable: true
});
BottomNavigationBar.prototype.createNativeView = function () {
var nativeView = MDCBottomNavigationBar.alloc().init();
this._delegate = bottom_navigation_bar_delegate_1.BottomNavigationBarDelegate.initWithOwner(new WeakRef(this));
return nativeView;
};
BottomNavigationBar.prototype.initNativeView = function () {
this.createTabs(this._items);
this.nativeView.titleVisibility = this.titleVisibility;
this.nativeView.selectedItemTintColor = this.activeColor.ios;
this.nativeView.unselectedItemTintColor = this.inactiveColor.ios;
};
BottomNavigationBar.prototype.disposeNativeView = function () {
this._delegate = null;
};
BottomNavigationBar.prototype.onLoaded = function () {
_super.prototype.onLoaded.call(this);
this.nativeView.delegate = this._delegate;
};
BottomNavigationBar.prototype.onUnloaded = function () {
this.nativeView.delegate = null;
_super.prototype.onUnloaded.call(this);
};
BottomNavigationBar.prototype.layoutNativeView = function (left, top, right, bottom) {
if (!this.nativeViewProtected) {
return;
}
var bottomSafeArea = 0;
if (application_1.ios.window.safeAreaInsets) {
bottomSafeArea = application_1.ios.window.safeAreaInsets.bottom;
}
var viewSize = CGSizeMake(platform_1.screen.mainScreen.widthDIPs, platform_1.screen.mainScreen.heightDIPs);
var nativeViewSize = this.nativeView.sizeThatFits(viewSize);
var bottomBarHeight = nativeViewSize.height + bottomSafeArea;
var nativeView = this.nativeViewProtected;
var frame = CGRectMake(0, view_1.layout.toDeviceIndependentPixels(top), viewSize.width, bottomBarHeight);
this._setNativeViewFrame(nativeView, frame);
};
BottomNavigationBar.prototype.showBadge = function (index, value) {
var tabBarItem = this.nativeView.items[index];
tabBarItem.badgeValue = value ? "" + value : '';
};
BottomNavigationBar.prototype.removeBadge = function (index) {
var tabBarItem = this.nativeView.items[index];
tabBarItem.badgeValue = null;
};
BottomNavigationBar.prototype[bottom_navigation_bar_base_1.tabsProperty.setNative] = function (tabs) {
this.createTabs(tabs);
};
BottomNavigationBar.prototype[bottom_navigation_bar_base_1.titleVisibilityProperty.setNative] = function (titleVisibility) {
this.nativeView.titleVisibility = titleVisibility;
};
BottomNavigationBar.prototype[bottom_navigation_bar_base_1.activeColorCssProperty.setNative] = function (activeColor) {
this.nativeView.selectedItemTintColor = activeColor.ios;
};
BottomNavigationBar.prototype[bottom_navigation_bar_base_1.inactiveColorCssProperty.setNative] = function (inactiveColor) {
this.nativeView.unselectedItemTintColor = inactiveColor.ios;
};
BottomNavigationBar.prototype[view_1.backgroundColorProperty.setNative] = function (backgroundColor) {
this.nativeView.barTintColor = backgroundColor.ios;
};
BottomNavigationBar.prototype.createTabs = function (tabs) {
if (tabs) {
this._items = tabs;
}
var bottomNavigationTabs = this._items.map(function (tab, index) {
return UITabBarItem.alloc().initWithTitleImageTag(tab.title, tab.getNativeIcon(), index);
});
this.nativeView.items = new NSArray({ array: bottomNavigationTabs });
this.selectTabNative(this.selectedTabIndex);
};
BottomNavigationBar.prototype.selectTabNative = function (index) {
if (this.nativeView.items.count === 0) {
return;
}
this.nativeView.selectedItem = this.nativeView.items[index];
this.selectedTabIndex = index;
};
return BottomNavigationBar;
}(bottom_navigation_bar_base_1.BottomNavigationBarBase));
exports.BottomNavigationBar = BottomNavigationBar;
//# sourceMappingURL=bottom-navigation-bar.js.map