Menu
I created a simple ionic-tabs that shows my icons at the top of the screen. I tried to wrap it in a ionic-footer-bar in order to have it placed at the bottom of the screen with no success. The tabs disappear when I do that. How should I accomplish the looks I want?
<ion-footer-bar> <ion-tabs class="tabs-icon-only tabs-stable"> ... </ion-tabs> </ion-footer-bar> 
280
Adding Tabs Bar in Ionic Application The tab navigation is created by adding the ion-tabs having ion-tab-bar inside it which creates a tab bar on position defined in the slot property. Each tab button is created using the ion-tab-button with tab property which is the path of tab page resulting navigation.
All tabs can be changed by setting the value of tabsLayout on the <ion-tabs> element, or in your app's config. For example, this is useful if you want to show tabs with a title only on Android, but show icons and a title for iOS.
Each ion-tab-button will activate one of the tabs when pressed. In order to link the ion-tab-button to the ion-tab container, a matching tab property should be set on each component. The ion-tab-button and ion-tab above are linked by the common tab property.
Since the beta 14 of Ionic (http://blog.ionic.io/the-final-beta/), there are some config variables that now default to their platform values, which means that they will try to behave according to the platform that they are built on. In the case of tabs, for iOS the default is to display on bottom, and Android on top.
You can easily "hard set" the location for all platforms by setting the tabs.position function in the $ionicConfigProvider, inside your config function like this:
MyApp.config(['$ionicConfigProvider', function($ionicConfigProvider) { $ionicConfigProvider.tabs.position('bottom'); // other values: top }]); You can check documentation here
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With