Ion-tabs didn't cover full height of the screen

I am creating a ionic+ application. My problem is I have using ion-tabs . That tabs didn’t occupy full height of my mobile screen what I want to do for that . I would add below that comparison images other apps between my app.

How to make full width of my tabs bottom and top
Like another apps

Not 100% clear what you are asking but sounds like you want your app to bleed into the status bar (have the status bar transparent on top of your app). For this, you would use the @capacitor/status-bar plugin.

StatusBar.setStyle({ style: Style.Dark })
StatusBar.setOverlaysWebView({ overlay: true })

after using that plugin . my top bar was fine. But the bottom tab didn’t cover full height and not transparent like another app .

That plugin I believe only configures the status bar. The bottom is considered the navigation bar. More info here - Android system bars  |  Mobile  |  Android Developers

1 Like

Thanks for your rply . I will use that .

Thank you sir for those links, you made my day :slight_smile:

.

To make ion-tabs cover the full screen height, set height: to 100% for ion-tabs, adjust the ion-tab-bar height, and ensure ion-content fills the remaining space. Verify parent elements also have full height. I was overwhelmed with multiple assignments, so I used Case Study Writing Service: Trusted by Students to get help with my case study. The service provided me with a well-researched and well-written case study that met all my requirements. The writer followed my instructions carefully and delivered the final product on time. The quality of the work was exceptional, and I received positive feedback from my professor. I’m very pleased with the results and would highly recommend this service.