A nativescript implementation the material bottom navigation layout with animation effect. For iOS and Android
npm i --save nativescript-nbmaterial-bottomnav

Nativescript implementation of the Material Bottom Navigation

The module implement Bottom Navigation Layout on both iOS and Android.
You can add a shit animation to nav items by adding "shifted" class to the component. Icon and Title extends nativescript Label. You can use a font library like material-icons or font-awesome.

If you want to use it as a root navigator your app.ts must looks like:

import "./bundle-config";
import {startWithMenu} from 'nativescript-nbmaterial-bottomnav';

startWithMenu({ moduleName: 'home/home-page' }, "menu/menu-page");

"moduleName" is your first screen.

And menu-page looks like:

<Page xmlns="" 

<bnav:BottomNavigation autoselect="false" select="selectNav" id="bottomnav" class="shifted">
<bnav:Icon text="dashboard" />
<bnav:Title text="Home"/>
<bnav:Icon text="add"/>
<bnav:Title text="Ajouter" />
<bnav:Icon text="favorite"/>
<bnav:Title text="Consulter" />


See all modules here