I'm building a .NET MAUI app and facing an issue on Android — the TabBar (Shell tabs) overlaps with the system navigation bar at the bottom of the screen.
Here’s what happens:
- The tabs are partially hidden behind the Android navigation buttons.
- It looks fine on iOS, but only happens on Android devices
(especially with gesture navigation).
My setup:
- .NET MAUI 9.0
- Using Shell with TabBar and Tab pages.
- No custom renderer — using default Shell behavior
Example:
<TabBar Title="Send">
<Tab Title="Home">
<Tab.Icon>
<FontImageSource
FontFamily="Ficons"
Glyph="{DynamicResource IconHome1}"
Size="20" />
</Tab.Icon>
<ShellContent
Title="Home"
ContentTemplate="{DataTemplate views:HomePage}"
Route="HomePage" />
</Tab>
<Tab Title="Transactions">
<Tab.Icon>
<FontImageSource
FontFamily="Ficons"
Glyph="{DynamicResource IconChart1}"
Size="20" />
</Tab.Icon>
<ShellContent
Title="Transaction"
ContentTemplate="{DataTemplate views:TransactionPage}"
Route="TransactionPage" />
</Tab>
<Tab Title="Send">
<Tab.Icon>
<FontImageSource
FontFamily="Ficons"
Glyph="{DynamicResource IconSwap}"
Size="20" />
</Tab.Icon>
<ShellContent
Title="Send Money"
ContentTemplate="{DataTemplate views:SendMoneyPage}"
Route="SendMoneyPage" />
</Tab>
<Tab Title="Recipients">
<Tab.Icon>
<FontImageSource
FontFamily="Ficons"
Glyph="{DynamicResource IconGroups1}"
Size="20" />
</Tab.Icon>
<ShellContent
Title="Recipients"
ContentTemplate="{DataTemplate views:RecipientPage}"
Route="RecipientPage" />
</Tab>
<Tab Title="Profile">
<Tab.Icon>
<FontImageSource
FontFamily="Ficons"
Glyph="{DynamicResource IconUser21}"
Size="14" />
</Tab.Icon>
<ShellContent
Title="Profile"
ContentTemplate="{DataTemplate views:ProfilePage}"
Route="ProfilePage" />
</Tab>
</TabBar>
What I tried:
Setting Shell.TabBarBackgroundColor and Shell.TabBarHeight.
Using padding in MainPage.
Applying WindowCompat.SetDecorFitsSystemWindows(window, false) in MainActivity.
Adjusting safe area manually in XAML:
But that feels like a hack.
Question:
How can I correctly handle TabBar overlapping with the Android navigation bar in .NET MAUI so it respects system insets automatically?