Skip to content

fix(android-edge-to-edge-support): use Window color API when edge-to-edge is not enforced#839

Draft
robingenz wants to merge 2 commits into
mainfrom
fix/issue-838
Draft

fix(android-edge-to-edge-support): use Window color API when edge-to-edge is not enforced#839
robingenz wants to merge 2 commits into
mainfrom
fix/issue-838

Conversation

@robingenz
Copy link
Copy Markdown
Member

Summary

Restores setting the status bar and navigation bar colors on Android versions where edge-to-edge is not enforced (API <35, or API 35 with windowOptOutEdgeToEdgeEnforcement=true). On those versions, the plugin now uses the platform Window.setStatusBarColor / setNavigationBarColor APIs (plus FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS) — the same approach @capacitor/status-bar uses — instead of the overlay-view approach.

The overlay approach is still used on API 35+ when edge-to-edge is enforced, because the legacy Window color APIs are ignored there.

Why

On API <35 with decorFitsSystemWindows = true (the default), the DecorView auto-consumes system bar insets as padding before they reach the plugin's WebView listener. That made the plugin's overlay-positioning logic silently depend on another plugin (@capacitor/keyboard ≤ 8.0.1) keeping a no-op setOnApplyWindowInsetsListener on the root view, which happened to disable the auto-consumption.

When @capacitor/keyboard 8.0.2 added ViewCompat.onApplyWindowInsets(v, insets) inside that listener, insets started being re-applied as padding on the root view, shifting the nav bar overlay ABOVE the nav bar. When 8.0.3 moved the listener from root view to the content view, the DecorView resumed auto-consuming insets, so the overlay got a height of 0 and became invisible.

Using the platform Window color API on API <35 sidesteps the inset dispatch chain entirely, so the plugin no longer depends on any side effects of other plugins.

Changes

  • EdgeToEdge.java: runtime isEdgeToEdgeEnforced() check branches enable()/disable() between the overlay approach (enforced) and the legacy Window color API (not enforced). Split private color setters into setXxxColor(int) (store + apply) and applyXxxColor() (read current + branch).
  • EdgeToEdgeConfig.java: color fields switched from int defaulting to TRANSPARENT to nullable Integer. Lets the legacy path avoid clobbering the theme default when the user has not configured a color.
  • Removed the obsolete topInsetLikelyHandledBySystem heuristic in applyInsetsInternal — that path now only runs when edge-to-edge is enforced.

Test plan

  • API 31 emulator, @capacitor/keyboard@8.0.3setNavigationBarColor and setStatusBarColor work.
  • API 31 emulator, @capacitor/keyboard@8.0.1 — no regression.
  • API 35 emulator without opt-out — overlay approach still works (regression check).
  • API 35 emulator with windowOptOutEdgeToEdgeEnforcement=true — legacy path, bar colors set.
  • API 36 emulator — overlay approach used.
  • Keyboard show/hide on each of the above — webview layout correct, no double-counted bottom inset.

Close #838

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Apr 22, 2026

Open in StackBlitz

@capawesome/capacitor-age-signals

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-age-signals@839

@capawesome-team/capacitor-android-battery-optimization

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome-team/capacitor-android-battery-optimization@839

@capawesome/capacitor-android-dark-mode-support

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-android-dark-mode-support@839

@capawesome/capacitor-android-edge-to-edge-support

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-android-edge-to-edge-support@839

@capawesome-team/capacitor-android-foreground-service

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome-team/capacitor-android-foreground-service@839

@capawesome/capacitor-app-review

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-app-review@839

@capawesome/capacitor-app-shortcuts

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-app-shortcuts@839

@capawesome/capacitor-app-update

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-app-update@839

@capawesome/capacitor-apple-sign-in

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-apple-sign-in@839

@capawesome/capacitor-asset-manager

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-asset-manager@839

@capawesome/capacitor-background-task

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-background-task@839

@capawesome/capacitor-badge

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-badge@839

@capawesome/capacitor-cloudinary

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-cloudinary@839

@capawesome-team/capacitor-datetime-picker

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome-team/capacitor-datetime-picker@839

@capawesome-team/capacitor-file-opener

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome-team/capacitor-file-opener@839

@capawesome/capacitor-file-picker

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-file-picker@839

@capawesome/capacitor-google-sign-in

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-google-sign-in@839

@capawesome/capacitor-libsql

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-libsql@839

@capawesome/capacitor-live-update

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-live-update@839

@capawesome/capacitor-managed-configurations

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-managed-configurations@839

@capawesome/capacitor-photo-editor

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-photo-editor@839

@capawesome/capacitor-pixlive

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-pixlive@839

@capawesome/capacitor-posthog

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-posthog@839

@capawesome/capacitor-realtimekit

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-realtimekit@839

@capawesome/capacitor-screen-orientation

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-screen-orientation@839

@capawesome/capacitor-screenshot

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-screenshot@839

@capawesome/capacitor-square-mobile-payments

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-square-mobile-payments@839

@capawesome/capacitor-superwall

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-superwall@839

@capawesome/capacitor-torch

npm i https://pkg.pr.new/capawesome-team/capacitor-plugins/@capawesome/capacitor-torch@839

commit: 92e5bca

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug(android-edge-to-edge-support): Navigation bar color cannot be changed on API level 31 if @capacitor/keyboard>=8.0.2 is used

1 participant