android-edge-to-edge-support

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

Capacitor plugin to support edge-to-edge display on Android.

Before	After	Before	After

Installation

npm install @capawesome/capacitor-android-edge-to-edge-support
npx cap sync

Usage

The plugin only needs to be installed. It applies insets to the web view to support edge-to-edge display on Android. The plugin also provides a method to set the background color of the status bar and navigation bar. It's recommended to use this method in combination with the Status Bar plugin.

import { EdgeToEdge } from '@capawesome/capacitor-android-edge-to-edge-support';
import { StatusBar, Style } from '@capacitor/status-bar';

const setBackgroundColor = async () => {
  await EdgeToEdge.setBackgroundColor({ color: '#ffffff' });
  await StatusBar.setStyle({ style: Style.Light });
};

API

• setBackgroundColor(...)
• Interfaces

setBackgroundColor(...)

setBackgroundColor(options: SetBackgroundColorOptions) => Promise<void>

Set the background color of the status bar and navigation bar.

Only available on Android.

Param	Type
options	SetBackgroundColorOptions

Since: 7.0.0

---

Interfaces

SetBackgroundColorOptions

Prop	Type	Description	Since
color	string	The hexadecimal color to set as the background color of the status bar and navigation bar.	7.0.0

Changelog

See CHANGELOG.md.

License

See LICENSE.