Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(android): Add Statusbar.setOverlaysWebView method #2597

Merged
merged 10 commits into from
Mar 19, 2020
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,13 @@
@NativePlugin()
public class StatusBar extends Plugin {

private int currentStatusbarColor;

public void load() {
// save initial color of the status bar
currentStatusbarColor = getActivity().getWindow().getStatusBarColor();
}

@PluginMethod()
public void setStyle(final PluginCall call) {
final String style = call.getString("style");
Expand Down Expand Up @@ -57,7 +64,10 @@ public void run() {
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
try {
window.setStatusBarColor(Color.parseColor(color.toUpperCase()));
final int parsedColor = Color.parseColor(color.toUpperCase());
window.setStatusBarColor(parsedColor);
// update the local color field as well
currentStatusbarColor = parsedColor;
call.success();
} catch (IllegalArgumentException ex) {
call.error("Invalid color provided. Must be a hex string (ex: #ff0000");
Expand Down Expand Up @@ -114,6 +124,38 @@ public void getInfo(final PluginCall call) {
data.put("visible", (decorView.getSystemUiVisibility() & View.SYSTEM_UI_FLAG_FULLSCREEN) != View.SYSTEM_UI_FLAG_FULLSCREEN);
data.put("style", style);
data.put("color", String.format("#%06X", (0xFFFFFF & window.getStatusBarColor())));
data.put("overlaysWebview", (decorView.getSystemUiVisibility() & View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN) == View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change the name to overlaid or overlays

Suggested change
data.put("overlaysWebview", (decorView.getSystemUiVisibility() & View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN) == View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
data.put("overlaid", (decorView.getSystemUiVisibility() & View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN) == View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);

call.resolve(data);
}

@PluginMethod()
public void setOverlaysWebView(final PluginCall call) {
final Boolean overlays = call.getBoolean("overlay", true);
getBridge().executeOnMainThread(new Runnable() {
@Override
public void run() {
if (overlays) {
// Sets the layout to a fullscreen one that does not hide the actual status bar, so the webview is displayed behind it.
View decorView = getActivity().getWindow().getDecorView();
int uiOptions = decorView.getSystemUiVisibility();
uiOptions = uiOptions | View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
decorView.setSystemUiVisibility(uiOptions);
currentStatusbarColor = getActivity().getWindow().getStatusBarColor();
getActivity().getWindow().setStatusBarColor(Color.TRANSPARENT);

call.success();
} else {
// Sets the layout to a normal one that displays the webview below the status bar.
View decorView = getActivity().getWindow().getDecorView();
int uiOptions = decorView.getSystemUiVisibility();
uiOptions = uiOptions & ~View.SYSTEM_UI_FLAG_LAYOUT_STABLE & ~View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
decorView.setSystemUiVisibility(uiOptions);
// recover the previous color of the status bar
getActivity().getWindow().setStatusBarColor(currentStatusbarColor);

call.success();
}
}
});
}
}
10 changes: 10 additions & 0 deletions core/src/core-plugin-definitions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1608,6 +1608,11 @@ export interface StatusBarPlugin extends Plugin {
* Get info about the current state of the status bar
*/
getInfo(): Promise<StatusBarInfoResult>;
/**
* Set whether or not the status bar should overlay the webview to allow usage of the space
* around a device "notch"
*/
setOverlaysWebView(options: StatusBarOverlaysWebviewOptions): Promise<void>;
}

export interface StatusBarStyleOptions {
Expand All @@ -1633,6 +1638,11 @@ export interface StatusBarInfoResult {
visible: boolean;
style: StatusBarStyle;
color?: string;
overlaysWebview: boolean;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change the name to overlaid or overlays, and make it optional because iOS doesn't return it

Suggested change
overlaysWebview: boolean;
overlaid?: boolean;

}

export interface StatusBarOverlaysWebviewOptions {
overlay: boolean;
}

export interface StoragePlugin extends Plugin {
Expand Down
4 changes: 4 additions & 0 deletions ios/Capacitor/Capacitor/Plugins/StatusBar.swift
Original file line number Diff line number Diff line change
Expand Up @@ -75,5 +75,9 @@ public class CAPStatusBarPlugin: CAPPlugin {
])
}
}

@objc func setOverlaysWebView(_ call: CAPPluginCall) {
call.unimplemented()
}
}

5 changes: 5 additions & 0 deletions site/docs-md/apis/status-bar/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,11 @@ export class StatusBarExample {
style: this.isStatusBarLight ? StatusBarStyle.Dark : StatusBarStyle.Light
});
this.isStatusBarLight = !this.isStatusBarLight;

// Display content under transparent status bar (Android only)
Statusbar.setOverlaysWebView({
enabled: true
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

forgot to change the new name here

Suggested change
enabled: true
overlay: true

})
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing ; at the end

Suggested change
})
});

}

hideStatusBar() {
Expand Down