@capawesome/capacitor-android-edge-to-edge-support 7.2.3 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -2,16 +2,24 @@
2
2
 
3
3
  Capacitor plugin to support [edge-to-edge](https://developer.android.com/develop/ui/views/layout/edge-to-edge) display on Android with advanced features like setting the background color of the status bar and navigation bar.
4
4
 
5
- | Before | After | Before | After |
6
- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
7
- | <image src="https://github.com/user-attachments/assets/1c42aa63-1191-4b9b-860f-ffc47881d815" width="200" /> | <image src="https://github.com/user-attachments/assets/a4df4e58-0c21-45b5-aadd-ca197308016a" width="200" /> | <image src="https://github.com/user-attachments/assets/22c94f95-a0c4-4ace-8a3b-3a0feabf9191" width="200" /> | <image src="https://github.com/user-attachments/assets/21ece022-fb74-4067-889b-6922ecd0e2a5" width="200" /> |
8
-
9
5
  <div class="capawesome-z29o10a">
10
6
  <a href="https://cloud.capawesome.io/" target="_blank">
11
- <img alt="Deliver Live Updates to your Capacitor app with Capawesome Cloud" src="https://cloud.capawesome.io/assets/banners/cloud-deploy-real-time-app-updates.png?t=1" />
7
+ <img alt="Deliver Live Updates to your Capacitor app with Capawesome Cloud" src="https://cloud.capawesome.io/assets/banners/cloud-build-and-deploy-capacitor-apps.png?t=1" />
12
8
  </a>
13
9
  </div>
14
10
 
11
+ | Before | After | Before | After |
12
+ | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
13
+ | <image src="https://github.com/user-attachments/assets/1c42aa63-1191-4b9b-860f-ffc47881d815" width="200" /> | <image src="https://github.com/user-attachments/assets/a4df4e58-0c21-45b5-aadd-ca197308016a" width="200" /> | <image src="https://github.com/user-attachments/assets/22c94f95-a0c4-4ace-8a3b-3a0feabf9191" width="200" /> | <image src="https://github.com/user-attachments/assets/21ece022-fb74-4067-889b-6922ecd0e2a5" width="200" /> |
14
+
15
+ **Attention:** Despite its name, this plugin doesn't enable edge-to-edge mode by default. Instead, it preserves the traditional app behavior by applying proper insets to the webview, preventing Android's edge-to-edge changes from affecting apps that haven't been designed to support it.
16
+
17
+ ## Compatibility
18
+
19
+ | Plugin Version | Capacitor Version | Status |
20
+ | -------------- | ----------------- | -------------- |
21
+ | 8.x.x | >=8.x.x | Active support |
22
+
15
23
  ## Installation
16
24
 
17
25
  ```bash
@@ -40,9 +48,11 @@ Otherwise, the web view will be resized to fit the screen, which may cause issue
40
48
  <docgen-config>
41
49
  <!--Update the source file JSDoc comments and rerun docgen to update the docs below-->
42
50
 
43
- | Prop | Type | Description | Since |
44
- | --------------------- | ------------------- | ------------------------------------------------------------------------------------------ | ----- |
45
- | **`backgroundColor`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar and navigation bar. | 7.1.0 |
51
+ | Prop | Type | Description | Since |
52
+ | ------------------------ | ------------------- | ----------------------------------------------------------------------------------------------------------- | ----- |
53
+ | **`backgroundColor`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar and navigation bar. | 7.1.0 |
54
+ | **`navigationBarColor`** | <code>string</code> | The hexadecimal color to set as the background color of the navigation bar area. Only available on Android. | 8.0.0 |
55
+ | **`statusBarColor`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar area. Only available on Android. | 8.0.0 |
46
56
 
47
57
  ### Examples
48
58
 
@@ -52,7 +62,9 @@ In `capacitor.config.json`:
52
62
  {
53
63
  "plugins": {
54
64
  "EdgeToEdge": {
55
- "backgroundColor": "#ffffff"
65
+ "backgroundColor": "#ffffff",
66
+ "navigationBarColor": "#000000",
67
+ "statusBarColor": "#ffffff"
56
68
  }
57
69
  }
58
70
  }
@@ -69,6 +81,8 @@ const config: CapacitorConfig = {
69
81
  plugins: {
70
82
  EdgeToEdge: {
71
83
  backgroundColor: "#ffffff",
84
+ navigationBarColor: "#000000",
85
+ statusBarColor: "#ffffff",
72
86
  },
73
87
  },
74
88
  };
@@ -84,7 +98,7 @@ The plugin **only needs to be installed**. It applies insets to the web view to
84
98
 
85
99
  ```typescript
86
100
  import { EdgeToEdge } from '@capawesome/capacitor-android-edge-to-edge-support';
87
- import { StatusBar, Style } from '@capacitor/status-bar';
101
+ import { SystemBars, SystemBarsStyle } from '@capacitor/status-bar';
88
102
 
89
103
  const enable = async () => {
90
104
  await EdgeToEdge.enable();
@@ -99,9 +113,14 @@ const getInsets = async () => {
99
113
  console.log('Insets:', result);
100
114
  };
101
115
 
102
- const setBackgroundColor = async () => {
103
- await EdgeToEdge.setBackgroundColor({ color: '#ffffff' });
104
- await StatusBar.setStyle({ style: Style.Light });
116
+ const setDarkStyle = async () => {
117
+ await SystemBars.setStyle({ style: SystemBarsStyle.Dark });
118
+ await EdgeToEdge.setBackgroundColor({ color: '#000000' });
119
+ };
120
+
121
+ const setLightStyle = async () => {
122
+ await SystemBars.setStyle({ style: SystemBarsStyle.Light });
123
+ await EdgeToEdge.setBackgroundColor({ color: '#FFFFFF' });
105
124
  };
106
125
  ```
107
126
 
@@ -109,10 +128,12 @@ const setBackgroundColor = async () => {
109
128
 
110
129
  <docgen-index>
111
130
 
112
- * [`enable()`](#enable)
113
131
  * [`disable()`](#disable)
132
+ * [`enable()`](#enable)
114
133
  * [`getInsets()`](#getinsets)
115
134
  * [`setBackgroundColor(...)`](#setbackgroundcolor)
135
+ * [`setNavigationBarColor(...)`](#setnavigationbarcolor)
136
+ * [`setStatusBarColor(...)`](#setstatusbarcolor)
116
137
  * [Interfaces](#interfaces)
117
138
 
118
139
  </docgen-index>
@@ -120,13 +141,13 @@ const setBackgroundColor = async () => {
120
141
  <docgen-api>
121
142
  <!--Update the source file JSDoc comments and rerun docgen to update the docs below-->
122
143
 
123
- ### enable()
144
+ ### disable()
124
145
 
125
146
  ```typescript
126
- enable() => Promise<void>
147
+ disable() => Promise<void>
127
148
  ```
128
149
 
129
- Enable the edge-to-edge mode.
150
+ Disable the edge-to-edge mode.
130
151
 
131
152
  Only available on Android.
132
153
 
@@ -135,13 +156,13 @@ Only available on Android.
135
156
  --------------------
136
157
 
137
158
 
138
- ### disable()
159
+ ### enable()
139
160
 
140
161
  ```typescript
141
- disable() => Promise<void>
162
+ enable() => Promise<void>
142
163
  ```
143
164
 
144
- Disable the edge-to-edge mode.
165
+ Enable the edge-to-edge mode.
145
166
 
146
167
  Only available on Android.
147
168
 
@@ -186,6 +207,44 @@ Only available on Android.
186
207
  --------------------
187
208
 
188
209
 
210
+ ### setNavigationBarColor(...)
211
+
212
+ ```typescript
213
+ setNavigationBarColor(options: SetNavigationBarColorOptions) => Promise<void>
214
+ ```
215
+
216
+ Set the background color of the navigation bar area.
217
+
218
+ Only available on Android.
219
+
220
+ | Param | Type |
221
+ | ------------- | ------------------------------------------------------------------------------------- |
222
+ | **`options`** | <code><a href="#setnavigationbarcoloroptions">SetNavigationBarColorOptions</a></code> |
223
+
224
+ **Since:** 8.0.0
225
+
226
+ --------------------
227
+
228
+
229
+ ### setStatusBarColor(...)
230
+
231
+ ```typescript
232
+ setStatusBarColor(options: SetStatusBarColorOptions) => Promise<void>
233
+ ```
234
+
235
+ Set the background color of the status bar area.
236
+
237
+ Only available on Android.
238
+
239
+ | Param | Type |
240
+ | ------------- | ----------------------------------------------------------------------------- |
241
+ | **`options`** | <code><a href="#setstatusbarcoloroptions">SetStatusBarColorOptions</a></code> |
242
+
243
+ **Since:** 8.0.0
244
+
245
+ --------------------
246
+
247
+
189
248
  ### Interfaces
190
249
 
191
250
 
@@ -205,8 +264,32 @@ Only available on Android.
205
264
  | ----------- | ------------------- | ------------------------------------------------------------------------------------------ | ----- |
206
265
  | **`color`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar and navigation bar. | 7.0.0 |
207
266
 
267
+
268
+ #### SetNavigationBarColorOptions
269
+
270
+ | Prop | Type | Description | Since |
271
+ | ----------- | ------------------- | -------------------------------------------------------------------------------- | ----- |
272
+ | **`color`** | <code>string</code> | The hexadecimal color to set as the background color of the navigation bar area. | 8.0.0 |
273
+
274
+
275
+ #### SetStatusBarColorOptions
276
+
277
+ | Prop | Type | Description | Since |
278
+ | ----------- | ------------------- | ---------------------------------------------------------------------------- | ----- |
279
+ | **`color`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar area. | 8.0.0 |
280
+
208
281
  </docgen-api>
209
282
 
283
+ ## FAQ
284
+
285
+ ### What about Capacitor 8's built-in edge-to-edge support?
286
+
287
+ Capacitor 8 introduced native edge-to-edge functionality through the internal `SystemBars` plugin. While this covers many common scenarios, this plugin addresses additional edge cases that aren't yet fully resolved in the Capacitor core implementation. We plan to deprecate this plugin once all edge cases are properly handled in Capacitor core.
288
+
289
+ ### Is this plugin compatible with Capacitor's SystemBars API?
290
+
291
+ Yes, this plugin is partially compatible with the new [SystemBars API](https://capacitorjs.com/docs/apis/system-bars) introduced in Capacitor 8. For example, methods like `setStyle()` from the SystemBars API are supported and can be used alongside this plugin without conflicts.
292
+
210
293
  ## Changelog
211
294
 
212
295
  See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/android-edge-to-edge-support/CHANGELOG.md).
@@ -1,8 +1,8 @@
1
1
  ext {
2
2
  junitVersion = project.hasProperty('junitVersion') ? rootProject.ext.junitVersion : '4.13.2'
3
- androidxAppCompatVersion = project.hasProperty('androidxAppCompatVersion') ? rootProject.ext.androidxAppCompatVersion : '1.7.0'
4
- androidxJunitVersion = project.hasProperty('androidxJunitVersion') ? rootProject.ext.androidxJunitVersion : '1.2.1'
5
- androidxEspressoCoreVersion = project.hasProperty('androidxEspressoCoreVersion') ? rootProject.ext.androidxEspressoCoreVersion : '3.6.1'
3
+ androidxAppCompatVersion = project.hasProperty('androidxAppCompatVersion') ? rootProject.ext.androidxAppCompatVersion : '1.7.1'
4
+ androidxJunitVersion = project.hasProperty('androidxJunitVersion') ? rootProject.ext.androidxJunitVersion : '1.3.0'
5
+ androidxEspressoCoreVersion = project.hasProperty('androidxEspressoCoreVersion') ? rootProject.ext.androidxEspressoCoreVersion : '3.7.0'
6
6
  }
7
7
 
8
8
  buildscript {
@@ -11,18 +11,18 @@ buildscript {
11
11
  mavenCentral()
12
12
  }
13
13
  dependencies {
14
- classpath 'com.android.tools.build:gradle:8.7.2'
14
+ classpath 'com.android.tools.build:gradle:8.13.0'
15
15
  }
16
16
  }
17
17
 
18
18
  apply plugin: 'com.android.library'
19
19
 
20
20
  android {
21
- namespace "io.capawesome.capacitorjs.plugins.androidedgetoedge"
22
- compileSdk project.hasProperty('compileSdkVersion') ? rootProject.ext.compileSdkVersion : 35
21
+ namespace = "io.capawesome.capacitorjs.plugins.androidedgetoedge"
22
+ compileSdk = project.hasProperty('compileSdkVersion') ? rootProject.ext.compileSdkVersion : 36
23
23
  defaultConfig {
24
- minSdkVersion project.hasProperty('minSdkVersion') ? rootProject.ext.minSdkVersion : 23
25
- targetSdkVersion project.hasProperty('targetSdkVersion') ? rootProject.ext.targetSdkVersion : 35
24
+ minSdkVersion project.hasProperty('minSdkVersion') ? rootProject.ext.minSdkVersion : 24
25
+ targetSdkVersion project.hasProperty('targetSdkVersion') ? rootProject.ext.targetSdkVersion : 36
26
26
  versionCode 1
27
27
  versionName "1.0"
28
28
  testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
@@ -34,7 +34,7 @@ android {
34
34
  }
35
35
  }
36
36
  lintOptions {
37
- abortOnError false
37
+ abortOnError = false
38
38
  }
39
39
  compileOptions {
40
40
  sourceCompatibility JavaVersion.VERSION_21
@@ -2,13 +2,17 @@ package io.capawesome.capacitorjs.plugins.androidedgetoedgesupport;
2
2
 
3
3
  import android.graphics.Color;
4
4
  import android.os.Build;
5
+ import android.view.Gravity;
5
6
  import android.view.View;
6
7
  import android.view.ViewGroup;
8
+ import android.widget.FrameLayout;
7
9
  import androidx.annotation.NonNull;
10
+ import androidx.annotation.Nullable;
8
11
  import androidx.core.graphics.Insets;
9
12
  import androidx.core.view.ViewCompat;
10
13
  import androidx.core.view.WindowInsetsCompat;
11
14
  import com.getcapacitor.Logger;
15
+ import java.lang.reflect.Constructor;
12
16
 
13
17
  public class EdgeToEdge {
14
18
 
@@ -18,11 +22,21 @@ public class EdgeToEdge {
18
22
  @NonNull
19
23
  private final EdgeToEdgePlugin plugin;
20
24
 
25
+ @Nullable
26
+ private View navigationBarOverlay;
27
+
28
+ @Nullable
29
+ private View statusBarOverlay;
30
+
21
31
  public EdgeToEdge(@NonNull EdgeToEdgePlugin plugin, @NonNull EdgeToEdgeConfig config) {
22
32
  this.config = config;
23
33
  this.plugin = plugin;
24
- // Apply insets to disable the edge-to-edge feature
25
- setBackgroundColor(config.getBackgroundColor());
34
+ // Create color overlays
35
+ createColorOverlays();
36
+ // Set colors from config
37
+ setStatusBarColor(config.getStatusBarColor());
38
+ setNavigationBarColor(config.getNavigationBarColor());
39
+ // Apply insets to enable the edge-to-edge feature
26
40
  applyInsets();
27
41
  }
28
42
 
@@ -40,7 +54,17 @@ public class EdgeToEdge {
40
54
  }
41
55
 
42
56
  public void setBackgroundColor(String color) {
43
- setBackgroundColor(Color.parseColor(color));
57
+ int parsedColor = Color.parseColor(color);
58
+ setStatusBarColor(parsedColor);
59
+ setNavigationBarColor(parsedColor);
60
+ }
61
+
62
+ public void setNavigationBarColor(String color) {
63
+ setNavigationBarColor(Color.parseColor(color));
64
+ }
65
+
66
+ public void setStatusBarColor(String color) {
67
+ setStatusBarColor(Color.parseColor(color));
44
68
  }
45
69
 
46
70
  private void applyInsets() {
@@ -64,6 +88,9 @@ public class EdgeToEdge {
64
88
  mlp.rightMargin = systemBarsInsets.right;
65
89
 
66
90
  view.setLayoutParams(mlp);
91
+
92
+ // Update color overlays based on current insets
93
+ updateColorOverlays(systemBarsInsets);
67
94
  }
68
95
  // Set listener
69
96
  ViewCompat.setOnApplyWindowInsetsListener(view, (v, windowInsets) -> {
@@ -87,6 +114,9 @@ public class EdgeToEdge {
87
114
 
88
115
  v.setLayoutParams(mlp);
89
116
 
117
+ // Update color overlays based on current insets
118
+ updateColorOverlays(systemBarsInsets);
119
+
90
120
  return WindowInsetsCompat.CONSUMED;
91
121
  });
92
122
  }
@@ -104,13 +134,105 @@ public class EdgeToEdge {
104
134
  view.setLayoutParams(mlp);
105
135
  // Reset listener
106
136
  ViewCompat.setOnApplyWindowInsetsListener(view, null);
137
+ // Remove color overlays
138
+ removeColorOverlays();
107
139
  }
108
140
 
109
- private void setBackgroundColor(int color) {
110
- View view = plugin.getBridge().getWebView();
111
- // Get parent view
112
- ViewGroup parent = (ViewGroup) view.getParent();
113
- // Set background color
114
- parent.setBackgroundColor(color);
141
+ private void createColorOverlays() {
142
+ View webView = plugin.getBridge().getWebView();
143
+ ViewGroup parent = (ViewGroup) webView.getParent();
144
+
145
+ if (statusBarOverlay == null) {
146
+ statusBarOverlay = new View(parent.getContext());
147
+ parent.addView(statusBarOverlay, 0); // Add behind webview
148
+ }
149
+
150
+ if (navigationBarOverlay == null) {
151
+ navigationBarOverlay = new View(parent.getContext());
152
+ parent.addView(navigationBarOverlay, 0); // Add behind webview
153
+ }
154
+ }
155
+
156
+ private void removeColorOverlays() {
157
+ View webView = plugin.getBridge().getWebView();
158
+ ViewGroup parent = (ViewGroup) webView.getParent();
159
+
160
+ if (statusBarOverlay != null) {
161
+ parent.removeView(statusBarOverlay);
162
+ statusBarOverlay = null;
163
+ }
164
+
165
+ if (navigationBarOverlay != null) {
166
+ parent.removeView(navigationBarOverlay);
167
+ navigationBarOverlay = null;
168
+ }
169
+ }
170
+
171
+ private void setNavigationBarColor(int color) {
172
+ if (navigationBarOverlay != null) {
173
+ navigationBarOverlay.setBackgroundColor(color);
174
+ }
175
+ }
176
+
177
+ private void setStatusBarColor(int color) {
178
+ if (statusBarOverlay != null) {
179
+ statusBarOverlay.setBackgroundColor(color);
180
+ }
181
+ }
182
+
183
+ private void updateColorOverlays(Insets systemBarsInsets) {
184
+ View webView = plugin.getBridge().getWebView();
185
+ ViewGroup parent = (ViewGroup) webView.getParent();
186
+
187
+ if (statusBarOverlay != null) {
188
+ // Position status bar overlay at top
189
+ ViewGroup.LayoutParams statusParams = createLayoutParams(
190
+ parent,
191
+ ViewGroup.LayoutParams.MATCH_PARENT,
192
+ systemBarsInsets.top,
193
+ Gravity.TOP
194
+ );
195
+ statusBarOverlay.setLayoutParams(statusParams);
196
+ }
197
+
198
+ if (navigationBarOverlay != null) {
199
+ // Position navigation bar overlay at bottom
200
+ ViewGroup.LayoutParams navParams = createLayoutParams(
201
+ parent,
202
+ ViewGroup.LayoutParams.MATCH_PARENT,
203
+ systemBarsInsets.bottom,
204
+ Gravity.BOTTOM
205
+ );
206
+ navigationBarOverlay.setLayoutParams(navParams);
207
+ }
208
+ }
209
+
210
+ private ViewGroup.LayoutParams createLayoutParams(ViewGroup parent, int width, int height, int gravity) {
211
+ String parentClassName = parent.getClass().getName();
212
+
213
+ // Handle CoordinatorLayout using reflection
214
+ if (parentClassName.contains("CoordinatorLayout")) {
215
+ try {
216
+ Class<?> layoutParamsClass = Class.forName("androidx.coordinatorlayout.widget.CoordinatorLayout$LayoutParams");
217
+ Constructor<?> constructor = layoutParamsClass.getConstructor(int.class, int.class);
218
+ ViewGroup.LayoutParams params = (ViewGroup.LayoutParams) constructor.newInstance(width, height);
219
+ // Set gravity using reflection
220
+ layoutParamsClass.getField("gravity").setInt(params, gravity);
221
+ return params;
222
+ } catch (Exception e) {
223
+ Logger.error("EdgeToEdge", "Failed to create CoordinatorLayout.LayoutParams", e);
224
+ }
225
+ }
226
+
227
+ // Handle FrameLayout
228
+ if (parent instanceof FrameLayout) {
229
+ FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(width, height);
230
+ params.gravity = gravity;
231
+ return params;
232
+ }
233
+
234
+ // Fallback to MarginLayoutParams
235
+ ViewGroup.MarginLayoutParams params = new ViewGroup.MarginLayoutParams(width, height);
236
+ return params;
115
237
  }
116
238
  }
@@ -4,13 +4,31 @@ import android.graphics.Color;
4
4
 
5
5
  public class EdgeToEdgeConfig {
6
6
 
7
- private int backgroundColor = Color.WHITE;
7
+ private int backgroundColor = Color.TRANSPARENT;
8
+ private int navigationBarColor = Color.TRANSPARENT;
9
+ private int statusBarColor = Color.TRANSPARENT;
8
10
 
9
11
  public int getBackgroundColor() {
10
12
  return this.backgroundColor;
11
13
  }
12
14
 
15
+ public int getNavigationBarColor() {
16
+ return this.navigationBarColor;
17
+ }
18
+
19
+ public int getStatusBarColor() {
20
+ return this.statusBarColor;
21
+ }
22
+
13
23
  public void setBackgroundColor(int backgroundColor) {
14
24
  this.backgroundColor = backgroundColor;
15
25
  }
26
+
27
+ public void setNavigationBarColor(int navigationBarColor) {
28
+ this.navigationBarColor = navigationBarColor;
29
+ }
30
+
31
+ public void setStatusBarColor(int statusBarColor) {
32
+ this.statusBarColor = statusBarColor;
33
+ }
16
34
  }
@@ -82,11 +82,64 @@ public class EdgeToEdgePlugin extends Plugin {
82
82
  });
83
83
  }
84
84
 
85
+ @PluginMethod
86
+ public void setNavigationBarColor(PluginCall call) {
87
+ String color = call.getString("color");
88
+ if (color == null) {
89
+ call.reject(ERROR_COLOR_MISSING);
90
+ return;
91
+ }
92
+ getActivity()
93
+ .runOnUiThread(() -> {
94
+ try {
95
+ implementation.setNavigationBarColor(color);
96
+ call.resolve();
97
+ } catch (Exception exception) {
98
+ call.reject(exception.getMessage());
99
+ }
100
+ });
101
+ }
102
+
103
+ @PluginMethod
104
+ public void setStatusBarColor(PluginCall call) {
105
+ String color = call.getString("color");
106
+ if (color == null) {
107
+ call.reject(ERROR_COLOR_MISSING);
108
+ return;
109
+ }
110
+ getActivity()
111
+ .runOnUiThread(() -> {
112
+ try {
113
+ implementation.setStatusBarColor(color);
114
+ call.resolve();
115
+ } catch (Exception exception) {
116
+ call.reject(exception.getMessage());
117
+ }
118
+ });
119
+ }
120
+
85
121
  private EdgeToEdgeConfig getEdgeToEdgeConfig() {
86
122
  EdgeToEdgeConfig config = new EdgeToEdgeConfig();
87
123
 
88
124
  try {
89
125
  String backgroundColor = getConfig().getString("backgroundColor");
126
+ String statusBarColor = getConfig().getString("statusBarColor");
127
+ String navigationBarColor = getConfig().getString("navigationBarColor");
128
+
129
+ // Backward compatibility: if backgroundColor is set but specific colors aren't, use it for both
130
+ if (statusBarColor == null && backgroundColor != null) {
131
+ config.setStatusBarColor(Color.parseColor(backgroundColor));
132
+ } else if (statusBarColor != null) {
133
+ config.setStatusBarColor(Color.parseColor(statusBarColor));
134
+ }
135
+
136
+ if (navigationBarColor == null && backgroundColor != null) {
137
+ config.setNavigationBarColor(Color.parseColor(backgroundColor));
138
+ } else if (navigationBarColor != null) {
139
+ config.setNavigationBarColor(Color.parseColor(navigationBarColor));
140
+ }
141
+
142
+ // Keep backgroundColor for any legacy code that might use it
90
143
  if (backgroundColor != null) {
91
144
  config.setBackgroundColor(Color.parseColor(backgroundColor));
92
145
  }
@@ -0,0 +1,28 @@
1
+ package io.capawesome.capacitorjs.plugins.androidedgetoedgesupport.classes.options;
2
+
3
+ import androidx.annotation.NonNull;
4
+ import com.getcapacitor.PluginCall;
5
+
6
+ public class SetNavigationBarColorOptions {
7
+
8
+ @NonNull
9
+ private final String color;
10
+
11
+ public SetNavigationBarColorOptions(@NonNull PluginCall call) throws Exception {
12
+ this.color = getColorFromCall(call);
13
+ }
14
+
15
+ @NonNull
16
+ public String getColor() {
17
+ return color;
18
+ }
19
+
20
+ @NonNull
21
+ private static String getColorFromCall(@NonNull PluginCall call) throws Exception {
22
+ String color = call.getString("color");
23
+ if (color == null) {
24
+ throw new Exception("color must be provided.");
25
+ }
26
+ return color;
27
+ }
28
+ }
@@ -0,0 +1,28 @@
1
+ package io.capawesome.capacitorjs.plugins.androidedgetoedgesupport.classes.options;
2
+
3
+ import androidx.annotation.NonNull;
4
+ import com.getcapacitor.PluginCall;
5
+
6
+ public class SetStatusBarColorOptions {
7
+
8
+ @NonNull
9
+ private final String color;
10
+
11
+ public SetStatusBarColorOptions(@NonNull PluginCall call) throws Exception {
12
+ this.color = getColorFromCall(call);
13
+ }
14
+
15
+ @NonNull
16
+ public String getColor() {
17
+ return color;
18
+ }
19
+
20
+ @NonNull
21
+ private static String getColorFromCall(@NonNull PluginCall call) throws Exception {
22
+ String color = call.getString("color");
23
+ if (color == null) {
24
+ throw new Exception("color must be provided.");
25
+ }
26
+ return color;
27
+ }
28
+ }
package/dist/docs.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "tags": [],
7
7
  "methods": [
8
8
  {
9
- "name": "enable",
9
+ "name": "disable",
10
10
  "signature": "() => Promise<void>",
11
11
  "parameters": [],
12
12
  "returns": "Promise<void>",
@@ -16,12 +16,12 @@
16
16
  "text": "7.2.0"
17
17
  }
18
18
  ],
19
- "docs": "Enable the edge-to-edge mode.\n\nOnly available on Android.",
19
+ "docs": "Disable the edge-to-edge mode.\n\nOnly available on Android.",
20
20
  "complexTypes": [],
21
- "slug": "enable"
21
+ "slug": "disable"
22
22
  },
23
23
  {
24
- "name": "disable",
24
+ "name": "enable",
25
25
  "signature": "() => Promise<void>",
26
26
  "parameters": [],
27
27
  "returns": "Promise<void>",
@@ -31,9 +31,9 @@
31
31
  "text": "7.2.0"
32
32
  }
33
33
  ],
34
- "docs": "Disable the edge-to-edge mode.\n\nOnly available on Android.",
34
+ "docs": "Enable the edge-to-edge mode.\n\nOnly available on Android.",
35
35
  "complexTypes": [],
36
- "slug": "disable"
36
+ "slug": "enable"
37
37
  },
38
38
  {
39
39
  "name": "getInsets",
@@ -64,6 +64,10 @@
64
64
  ],
65
65
  "returns": "Promise<void>",
66
66
  "tags": [
67
+ {
68
+ "name": "deprecated",
69
+ "text": "Use `setStatusBarColor()` and `setNavigationBarColor()` instead."
70
+ },
67
71
  {
68
72
  "name": "since",
69
73
  "text": "7.0.0"
@@ -74,6 +78,52 @@
74
78
  "SetBackgroundColorOptions"
75
79
  ],
76
80
  "slug": "setbackgroundcolor"
81
+ },
82
+ {
83
+ "name": "setNavigationBarColor",
84
+ "signature": "(options: SetNavigationBarColorOptions) => Promise<void>",
85
+ "parameters": [
86
+ {
87
+ "name": "options",
88
+ "docs": "",
89
+ "type": "SetNavigationBarColorOptions"
90
+ }
91
+ ],
92
+ "returns": "Promise<void>",
93
+ "tags": [
94
+ {
95
+ "name": "since",
96
+ "text": "8.0.0"
97
+ }
98
+ ],
99
+ "docs": "Set the background color of the navigation bar area.\n\nOnly available on Android.",
100
+ "complexTypes": [
101
+ "SetNavigationBarColorOptions"
102
+ ],
103
+ "slug": "setnavigationbarcolor"
104
+ },
105
+ {
106
+ "name": "setStatusBarColor",
107
+ "signature": "(options: SetStatusBarColorOptions) => Promise<void>",
108
+ "parameters": [
109
+ {
110
+ "name": "options",
111
+ "docs": "",
112
+ "type": "SetStatusBarColorOptions"
113
+ }
114
+ ],
115
+ "returns": "Promise<void>",
116
+ "tags": [
117
+ {
118
+ "name": "since",
119
+ "text": "8.0.0"
120
+ }
121
+ ],
122
+ "docs": "Set the background color of the status bar area.\n\nOnly available on Android.",
123
+ "complexTypes": [
124
+ "SetStatusBarColorOptions"
125
+ ],
126
+ "slug": "setstatusbarcolor"
77
127
  }
78
128
  ],
79
129
  "properties": []
@@ -174,6 +224,66 @@
174
224
  "type": "string"
175
225
  }
176
226
  ]
227
+ },
228
+ {
229
+ "name": "SetNavigationBarColorOptions",
230
+ "slug": "setnavigationbarcoloroptions",
231
+ "docs": "",
232
+ "tags": [
233
+ {
234
+ "text": "8.0.0",
235
+ "name": "since"
236
+ }
237
+ ],
238
+ "methods": [],
239
+ "properties": [
240
+ {
241
+ "name": "color",
242
+ "tags": [
243
+ {
244
+ "text": "8.0.0",
245
+ "name": "since"
246
+ },
247
+ {
248
+ "text": "\"#000000\"",
249
+ "name": "example"
250
+ }
251
+ ],
252
+ "docs": "The hexadecimal color to set as the background color of the navigation bar area.",
253
+ "complexTypes": [],
254
+ "type": "string"
255
+ }
256
+ ]
257
+ },
258
+ {
259
+ "name": "SetStatusBarColorOptions",
260
+ "slug": "setstatusbarcoloroptions",
261
+ "docs": "",
262
+ "tags": [
263
+ {
264
+ "text": "8.0.0",
265
+ "name": "since"
266
+ }
267
+ ],
268
+ "methods": [],
269
+ "properties": [
270
+ {
271
+ "name": "color",
272
+ "tags": [
273
+ {
274
+ "text": "8.0.0",
275
+ "name": "since"
276
+ },
277
+ {
278
+ "text": "\"#ffffff\"",
279
+ "name": "example"
280
+ }
281
+ ],
282
+ "docs": "The hexadecimal color to set as the background color of the status bar area.",
283
+ "complexTypes": [],
284
+ "type": "string"
285
+ }
286
+ ]
177
287
  }
178
288
  ],
179
289
  "enums": [],
@@ -186,6 +296,10 @@
186
296
  {
187
297
  "name": "backgroundColor",
188
298
  "tags": [
299
+ {
300
+ "text": "Use `statusBarColor` and `navigationBarColor` instead.",
301
+ "name": "deprecated"
302
+ },
189
303
  {
190
304
  "text": "7.1.0",
191
305
  "name": "since"
@@ -198,6 +312,38 @@
198
312
  "docs": "The hexadecimal color to set as the background color of the status bar and navigation bar.",
199
313
  "complexTypes": [],
200
314
  "type": "string | undefined"
315
+ },
316
+ {
317
+ "name": "navigationBarColor",
318
+ "tags": [
319
+ {
320
+ "text": "8.0.0",
321
+ "name": "since"
322
+ },
323
+ {
324
+ "text": "\"#000000\"",
325
+ "name": "example"
326
+ }
327
+ ],
328
+ "docs": "The hexadecimal color to set as the background color of the navigation bar area.\n\nOnly available on Android.",
329
+ "complexTypes": [],
330
+ "type": "string | undefined"
331
+ },
332
+ {
333
+ "name": "statusBarColor",
334
+ "tags": [
335
+ {
336
+ "text": "8.0.0",
337
+ "name": "since"
338
+ },
339
+ {
340
+ "text": "\"#ffffff\"",
341
+ "name": "example"
342
+ }
343
+ ],
344
+ "docs": "The hexadecimal color to set as the background color of the status bar area.\n\nOnly available on Android.",
345
+ "complexTypes": [],
346
+ "type": "string | undefined"
201
347
  }
202
348
  ],
203
349
  "docs": ""
@@ -4,30 +4,49 @@ declare module '@capacitor/cli' {
4
4
  /**
5
5
  * The hexadecimal color to set as the background color of the status bar and navigation bar.
6
6
  *
7
+ * @deprecated Use `statusBarColor` and `navigationBarColor` instead.
7
8
  * @since 7.1.0
8
9
  * @example "#ffffff"
9
10
  */
10
11
  backgroundColor?: string;
12
+ /**
13
+ * The hexadecimal color to set as the background color of the navigation bar area.
14
+ *
15
+ * Only available on Android.
16
+ *
17
+ * @since 8.0.0
18
+ * @example "#000000"
19
+ */
20
+ navigationBarColor?: string;
21
+ /**
22
+ * The hexadecimal color to set as the background color of the status bar area.
23
+ *
24
+ * Only available on Android.
25
+ *
26
+ * @since 8.0.0
27
+ * @example "#ffffff"
28
+ */
29
+ statusBarColor?: string;
11
30
  };
12
31
  }
13
32
  }
14
33
  export interface EdgeToEdgePlugin {
15
34
  /**
16
- * Enable the edge-to-edge mode.
35
+ * Disable the edge-to-edge mode.
17
36
  *
18
37
  * Only available on Android.
19
38
  *
20
39
  * @since 7.2.0
21
40
  */
22
- enable(): Promise<void>;
41
+ disable(): Promise<void>;
23
42
  /**
24
- * Disable the edge-to-edge mode.
43
+ * Enable the edge-to-edge mode.
25
44
  *
26
45
  * Only available on Android.
27
46
  *
28
47
  * @since 7.2.0
29
48
  */
30
- disable(): Promise<void>;
49
+ enable(): Promise<void>;
31
50
  /**
32
51
  * Return the insets that are currently applied to the webview.
33
52
  *
@@ -41,9 +60,26 @@ export interface EdgeToEdgePlugin {
41
60
  *
42
61
  * Only available on Android.
43
62
  *
63
+ * @deprecated Use `setStatusBarColor()` and `setNavigationBarColor()` instead.
44
64
  * @since 7.0.0
45
65
  */
46
66
  setBackgroundColor(options: SetBackgroundColorOptions): Promise<void>;
67
+ /**
68
+ * Set the background color of the navigation bar area.
69
+ *
70
+ * Only available on Android.
71
+ *
72
+ * @since 8.0.0
73
+ */
74
+ setNavigationBarColor(options: SetNavigationBarColorOptions): Promise<void>;
75
+ /**
76
+ * Set the background color of the status bar area.
77
+ *
78
+ * Only available on Android.
79
+ *
80
+ * @since 8.0.0
81
+ */
82
+ setStatusBarColor(options: SetStatusBarColorOptions): Promise<void>;
47
83
  }
48
84
  /**
49
85
  * @since 7.2.0
@@ -95,3 +131,27 @@ export interface SetBackgroundColorOptions {
95
131
  */
96
132
  color: string;
97
133
  }
134
+ /**
135
+ * @since 8.0.0
136
+ */
137
+ export interface SetNavigationBarColorOptions {
138
+ /**
139
+ * The hexadecimal color to set as the background color of the navigation bar area.
140
+ *
141
+ * @since 8.0.0
142
+ * @example "#000000"
143
+ */
144
+ color: string;
145
+ }
146
+ /**
147
+ * @since 8.0.0
148
+ */
149
+ export interface SetStatusBarColorOptions {
150
+ /**
151
+ * The hexadecimal color to set as the background color of the status bar area.
152
+ *
153
+ * @since 8.0.0
154
+ * @example "#ffffff"
155
+ */
156
+ color: string;
157
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"definitions.js","sourceRoot":"","sources":["../../src/definitions.ts"],"names":[],"mappings":"AAAA,wCAAwC","sourcesContent":["/// <reference types=\"@capacitor/cli\" />\n\ndeclare module '@capacitor/cli' {\n export interface PluginsConfig {\n EdgeToEdge?: {\n /**\n * The hexadecimal color to set as the background color of the status bar and navigation bar.\n *\n * @since 7.1.0\n * @example \"#ffffff\"\n */\n backgroundColor?: string;\n };\n }\n}\n\nexport interface EdgeToEdgePlugin {\n /**\n * Enable the edge-to-edge mode.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n enable(): Promise<void>;\n /**\n * Disable the edge-to-edge mode.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n disable(): Promise<void>;\n /**\n * Return the insets that are currently applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n getInsets(): Promise<GetInsetsResult>;\n /**\n * Set the background color of the status bar and navigation bar.\n *\n * Only available on Android.\n *\n * @since 7.0.0\n */\n setBackgroundColor(options: SetBackgroundColorOptions): Promise<void>;\n}\n\n/**\n * @since 7.2.0\n */\nexport interface GetInsetsResult {\n /**\n * The bottom inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n bottom: number;\n /**\n * The left inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n left: number;\n /**\n * The right inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n right: number;\n /**\n * The top inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n top: number;\n}\n\n/**\n * @since 7.0.0\n */\nexport interface SetBackgroundColorOptions {\n /**\n * The hexadecimal color to set as the background color of the status bar and navigation bar.\n *\n * @since 7.0.0\n * @example \"#ffffff\"\n * @example \"#000000\"\n */\n color: string;\n}\n"]}
1
+ {"version":3,"file":"definitions.js","sourceRoot":"","sources":["../../src/definitions.ts"],"names":[],"mappings":"AAAA,wCAAwC","sourcesContent":["/// <reference types=\"@capacitor/cli\" />\n\ndeclare module '@capacitor/cli' {\n export interface PluginsConfig {\n EdgeToEdge?: {\n /**\n * The hexadecimal color to set as the background color of the status bar and navigation bar.\n *\n * @deprecated Use `statusBarColor` and `navigationBarColor` instead.\n * @since 7.1.0\n * @example \"#ffffff\"\n */\n backgroundColor?: string;\n /**\n * The hexadecimal color to set as the background color of the navigation bar area.\n *\n * Only available on Android.\n *\n * @since 8.0.0\n * @example \"#000000\"\n */\n navigationBarColor?: string;\n /**\n * The hexadecimal color to set as the background color of the status bar area.\n *\n * Only available on Android.\n *\n * @since 8.0.0\n * @example \"#ffffff\"\n */\n statusBarColor?: string;\n };\n }\n}\n\nexport interface EdgeToEdgePlugin {\n /**\n * Disable the edge-to-edge mode.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n disable(): Promise<void>;\n /**\n * Enable the edge-to-edge mode.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n enable(): Promise<void>;\n /**\n * Return the insets that are currently applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n getInsets(): Promise<GetInsetsResult>;\n /**\n * Set the background color of the status bar and navigation bar.\n *\n * Only available on Android.\n *\n * @deprecated Use `setStatusBarColor()` and `setNavigationBarColor()` instead.\n * @since 7.0.0\n */\n setBackgroundColor(options: SetBackgroundColorOptions): Promise<void>;\n /**\n * Set the background color of the navigation bar area.\n *\n * Only available on Android.\n *\n * @since 8.0.0\n */\n setNavigationBarColor(options: SetNavigationBarColorOptions): Promise<void>;\n /**\n * Set the background color of the status bar area.\n *\n * Only available on Android.\n *\n * @since 8.0.0\n */\n setStatusBarColor(options: SetStatusBarColorOptions): Promise<void>;\n}\n\n/**\n * @since 7.2.0\n */\nexport interface GetInsetsResult {\n /**\n * The bottom inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n bottom: number;\n /**\n * The left inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n left: number;\n /**\n * The right inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n right: number;\n /**\n * The top inset that was applied to the webview.\n *\n * Only available on Android.\n *\n * @since 7.2.0\n */\n top: number;\n}\n\n/**\n * @since 7.0.0\n */\nexport interface SetBackgroundColorOptions {\n /**\n * The hexadecimal color to set as the background color of the status bar and navigation bar.\n *\n * @since 7.0.0\n * @example \"#ffffff\"\n * @example \"#000000\"\n */\n color: string;\n}\n\n/**\n * @since 8.0.0\n */\nexport interface SetNavigationBarColorOptions {\n /**\n * The hexadecimal color to set as the background color of the navigation bar area.\n *\n * @since 8.0.0\n * @example \"#000000\"\n */\n color: string;\n}\n\n/**\n * @since 8.0.0\n */\nexport interface SetStatusBarColorOptions {\n /**\n * The hexadecimal color to set as the background color of the status bar area.\n *\n * @since 8.0.0\n * @example \"#ffffff\"\n */\n color: string;\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@capawesome/capacitor-android-edge-to-edge-support",
3
- "version": "7.2.3",
3
+ "version": "8.0.0",
4
4
  "description": "Capacitor plugin to support edge-to-edge display on Android.",
5
5
  "main": "dist/plugin.cjs.js",
6
6
  "module": "dist/esm/index.js",
@@ -50,18 +50,18 @@
50
50
  "prepublishOnly": "npm run build"
51
51
  },
52
52
  "devDependencies": {
53
- "@capacitor/android": "7.0.0",
54
- "@capacitor/cli": "7.0.0",
55
- "@capacitor/core": "7.0.0",
56
- "@capacitor/docgen": "0.3.0",
53
+ "@capacitor/android": "8.0.0",
54
+ "@capacitor/cli": "8.0.0",
55
+ "@capacitor/core": "8.0.0",
56
+ "@capacitor/docgen": "0.3.1",
57
57
  "prettier": "3.4.2",
58
58
  "prettier-plugin-java": "2.6.7",
59
- "rimraf": "6.0.1",
60
- "rollup": "4.30.1",
61
- "typescript": "4.1.5"
59
+ "rimraf": "6.1.2",
60
+ "rollup": "4.53.3",
61
+ "typescript": "5.9.3"
62
62
  },
63
63
  "peerDependencies": {
64
- "@capacitor/core": ">=7.0.0"
64
+ "@capacitor/core": ">=8.0.0"
65
65
  },
66
66
  "capacitor": {
67
67
  "android": {