Repository navigation
bug: UI Overlap with System Navigation Buttons on Android 15 in 3-Button Navigation Mode #30355
Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v7.x
Current Behavior
I have designed a project using Ionic 7 and Capacitor 7, where I have implemented tabs navigation. When I build the Android APK and run it on Android 15, the UI/UX appears fine when gesture navigation is enabled. However, when I switch to 3-button navigation, the system navigation buttons overlap with the app's buttons, causing the UI to become distorted and negatively affecting the user experience.
Expected Behavior
App Height must be auto adjustable
Steps to Reproduce
Code Reproduction URL
Ionic Info
Ionic:
Ionic CLI : 7.2.0 (C:\Users\dell\AppData\Roaming\nvm\v22.5.1\node_modules@ionic\cli)
Ionic Framework : @ionic/angular 8.5.2
@angular-devkit/build-angular : 18.2.16
@angular-devkit/schematics : 18.2.16
@angular/cli : 18.2.16
@ionic/angular-toolkit : 11.0.1
Capacitor:
Capacitor CLI : 7.1.0
@capacitor/android : 7.1.0
@capacitor/core : 7.1.0
@capacitor/ios : not installed
Utility:
cordova-res : 0.15.4
native-run : 2.0.1
System:
NodeJS : v22.5.1 (C:\Program Files\nodejs\node.exe)
npm : 10.8.2
OS : Windows 10
Additional Information
No response
Activity
danielehrhardt commentedon Apr 12, 2025
Set your capacitor.config.ts ➤ android ➤ adjustMarginsForEdgeToEdge: 'auto',
thetaPC commentedon Oct 14, 2026
Thanks for the report, and sorry for the delay.
Verified on 9.0.7. This is the same issue as #30090: Android System WebView versions before 140 reported the safe area as
0on Android 15, so Ionic had nothing to pad the tab bar by. #30865 fixed it in v8.7.15: update to Capacitor 8 and Ionic 8.7.15 or later, with no extra configuration. If you need to stay on Capacitor 7 for now,android: { adjustMarginsForEdgeToEdge: 'auto' }incapacitor.config.tsfrom the earlier comment works, but take it out when you upgrade since Capacitor 8 removed it.Closing this as a duplicate of #30090, where the full details are.