How to hide tabs bar


#1

Hey
I’m trying to hide a tabs bar but I couldn’t the tabs still show even after I navigate to the next window and made it a root page, to be more clear when I logout and go to the home page the tabs are still there !
here is my code :

  logout(){
    console.log('logging out');
    this.storage.clear();
    console.log('logged out');
    this.navCtrl.setRoot(HomePage);
  }

#2

you can try this
hide tab


#3

Thanks , that did the trick !!


#4

I think the idea marked as the “solution” is crazy. A better way to do this is from the app component, as described here.

The reason you are still seeing the tabs is because you are calling setRoot on a navigation stack that is still within the confines of the tabs-hosting page. Doing it from the app component breaks out of this.


#5

@rapropos What happens if after setting the root page from within app component, we press the back button? Will we return to the tabs page (the expected behavior), or will the application exit?

p.s. I tested it. Your approach is great, except in the new root page when we press the back button the application exits, while I expected to return to the tabs page.


#6

There seems to be a built-in method to hide tabs on sub pages:

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

#7

thank you, it works like charm.


#8

can i hide tabs for some specific pages ??