Tabs View with Sub Footer

Ionic Framework ionic-v3
1

I’d like to add a subfooter to my tabs view so each tab has the same footer.

My structure is

<ion-nav root="myTabsPage"></ion-nav>


<ion-tabs color="toolbar">
  <ion-tab [root]="tab2Root" tabTitle="Music" tabIcon="microphone"></ion-tab>
  <ion-tab [root]="tab1Root" tabTitle="Video" tabIcon="videocam"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="News" tabIcon="paper"></ion-tab>
  <ion-tab [root]="tab4Root" tabTitle="Profile" tabIcon="people"></ion-tab>
</ion-tabs>

How can I make it so I havea subfooter above the tabs that is the same on every page.

I’ve tried adding

<ion-footer>
  <ion-toolbar color="secondary">
    <ion-title>Footer</ion-title>
  </ion-toolbar>
</ion-footer>

Then giving the footer a bottom padding. But I’m not sure if this will hold up in al scenarios for all devices.

Any input would help. Thanks.

2

I’m looking for the answer to this too… Any help would be appreciated!! I’ll post back if I figure something out.

3

We are also facing a bottom padding to footer in tabs page on iOS devices. Any help would be appreciated.