Hide tabs bar programmatically


#1

Hi folks,

Is there a way to hide the tabs bar programmatically from a custom component?

My custom component is in the footer and I would like to hide the tabs bar when this component is visible.

Thanks.


#2

The easiest way is to push the controller onto the root nav controller. This way the controller will be loaded as a new full screen page.

this.nav.rootNav.push(myPage);


#3

No it is not a Page component, it is a custom component that needs to be displayed in the footer bar.


#4

I understand, still this is the only way to “hide” the tab bar at the moment


#5

There is no method currently to hide the tabs bar, but it’s on our list of TODOs for post 2.0 final


#6

Thanks @mhartington for the heads up. Keep up the good work.


#7

Just put tabsHideOnSubPages in your config like this:

@NgModule({
  declarations: [ MyApp ],
  imports: [
    IonicModule.forRoot(MyApp, {
      tabsHideOnSubPages: true,
    }, {}
  )],
  bootstrap: [IonicApp],
  entryComponents: [ MyApp ],
  providers: []
})