mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
feat(core): statusBarStyle ease of use and more control (#10859)
This commit is contained in:
@ -1,5 +1,5 @@
|
||||
import { isAccessibilityServiceEnabled } from '../../application';
|
||||
import { PageBase, actionBarHiddenProperty, statusBarStyleProperty, androidStatusBarBackgroundProperty } from './page-common';
|
||||
import { PageBase, actionBarHiddenProperty, androidStatusBarBackgroundProperty } from './page-common';
|
||||
import { View } from '../core/view';
|
||||
import { Color } from '../../color';
|
||||
import { ActionBar } from '../action-bar';
|
||||
@ -10,10 +10,6 @@ import { AndroidAccessibilityEvent, getLastFocusedViewOnPage } from '../../acces
|
||||
|
||||
export * from './page-common';
|
||||
|
||||
const SYSTEM_UI_FLAG_LIGHT_STATUS_BAR = 0x00002000;
|
||||
const STATUS_BAR_LIGHT_BCKG = -657931;
|
||||
const STATUS_BAR_DARK_BCKG = 1711276032;
|
||||
|
||||
export class Page extends PageBase {
|
||||
nativeViewProtected: org.nativescript.widgets.GridLayout;
|
||||
|
||||
@ -69,19 +65,6 @@ export class Page extends PageBase {
|
||||
}
|
||||
}
|
||||
|
||||
private getClosestWindow() {
|
||||
// When it comes to modals, check if page has a parent as it may not be the modal root view itself
|
||||
const view = this.parent ?? this;
|
||||
const dialogFragment = (<any>view)._dialogFragment;
|
||||
if (dialogFragment) {
|
||||
const dialog = dialogFragment.getDialog();
|
||||
if (dialog) {
|
||||
return dialog.getWindow();
|
||||
}
|
||||
}
|
||||
return this._context.getWindow();
|
||||
}
|
||||
|
||||
[actionBarHiddenProperty.setNative](value: boolean) {
|
||||
// in case the actionBar is not created and actionBarHidden is changed to true
|
||||
// the actionBar will be created by updateActionBar
|
||||
@ -90,44 +73,10 @@ export class Page extends PageBase {
|
||||
}
|
||||
}
|
||||
|
||||
[statusBarStyleProperty.getDefault](): {
|
||||
color: number;
|
||||
systemUiVisibility: number;
|
||||
} {
|
||||
if (SDK_VERSION >= 21) {
|
||||
const window = this.getClosestWindow();
|
||||
const decorView = window.getDecorView();
|
||||
|
||||
return {
|
||||
color: (<any>window).getStatusBarColor(),
|
||||
systemUiVisibility: decorView.getSystemUiVisibility(),
|
||||
};
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
[statusBarStyleProperty.setNative](value: 'dark' | 'light' | { color: number; systemUiVisibility: number }) {
|
||||
if (SDK_VERSION >= 21) {
|
||||
const window = this.getClosestWindow();
|
||||
const decorView = window.getDecorView();
|
||||
|
||||
if (value === 'light') {
|
||||
(<any>window).setStatusBarColor(STATUS_BAR_LIGHT_BCKG);
|
||||
decorView.setSystemUiVisibility(SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
|
||||
} else if (value === 'dark') {
|
||||
(<any>window).setStatusBarColor(STATUS_BAR_DARK_BCKG);
|
||||
decorView.setSystemUiVisibility(0);
|
||||
} else {
|
||||
(<any>window).setStatusBarColor(value.color);
|
||||
decorView.setSystemUiVisibility(value.systemUiVisibility);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[androidStatusBarBackgroundProperty.getDefault](): number {
|
||||
if (SDK_VERSION >= 21) {
|
||||
const window = this.getClosestWindow();
|
||||
return (<any>window).getStatusBarColor();
|
||||
return window.getStatusBarColor();
|
||||
}
|
||||
|
||||
return null;
|
||||
@ -136,7 +85,7 @@ export class Page extends PageBase {
|
||||
if (SDK_VERSION >= 21) {
|
||||
const window = this.getClosestWindow();
|
||||
const color = value instanceof Color ? value.android : value;
|
||||
(<any>window).setStatusBarColor(color);
|
||||
window.setStatusBarColor(color);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
8
packages/core/ui/page/index.d.ts
vendored
8
packages/core/ui/page/index.d.ts
vendored
@ -65,14 +65,6 @@ export declare class Page extends PageBase {
|
||||
*/
|
||||
public backgroundSpanUnderStatusBar: boolean;
|
||||
|
||||
/**
|
||||
* Gets or sets the style of the status bar.
|
||||
*
|
||||
* @nsProperty
|
||||
*/
|
||||
// @ts-ignore
|
||||
public statusBarStyle: 'light' | 'dark';
|
||||
|
||||
/**
|
||||
* Gets or sets the color of the status bar in Android.
|
||||
*
|
||||
|
||||
@ -2,7 +2,7 @@ import { isAccessibilityServiceEnabled } from '../../application';
|
||||
import type { Frame } from '../frame';
|
||||
import { BackstackEntry, NavigationType } from '../frame/frame-interfaces';
|
||||
import { View, IOSHelper } from '../core/view';
|
||||
import { PageBase, actionBarHiddenProperty, statusBarStyleProperty } from './page-common';
|
||||
import { PageBase, actionBarHiddenProperty } from './page-common';
|
||||
|
||||
import { profile } from '../../profiling';
|
||||
import { layout } from '../../utils/layout-helper';
|
||||
@ -349,7 +349,11 @@ class UIViewControllerImpl extends UIViewController {
|
||||
public get preferredStatusBarStyle(): UIStatusBarStyle {
|
||||
const owner = this._owner?.deref();
|
||||
if (owner) {
|
||||
return owner.statusBarStyle === 'dark' ? UIStatusBarStyle.LightContent : UIStatusBarStyle.Default;
|
||||
if (SDK_VERSION >= 13) {
|
||||
return owner.statusBarStyle === 'light' ? UIStatusBarStyle.LightContent : UIStatusBarStyle.DarkContent;
|
||||
} else {
|
||||
return owner.statusBarStyle === 'dark' ? UIStatusBarStyle.LightContent : UIStatusBarStyle.Default;
|
||||
}
|
||||
} else {
|
||||
return UIStatusBarStyle.Default;
|
||||
}
|
||||
@ -557,21 +561,6 @@ export class Page extends PageBase {
|
||||
}
|
||||
}
|
||||
|
||||
[statusBarStyleProperty.getDefault](): UIBarStyle {
|
||||
return UIBarStyle.Default;
|
||||
}
|
||||
[statusBarStyleProperty.setNative](value: string | UIBarStyle) {
|
||||
const frame = this.frame;
|
||||
if (frame) {
|
||||
const navigationBar = (<UINavigationController>frame.ios.controller).navigationBar;
|
||||
if (typeof value === 'string') {
|
||||
navigationBar.barStyle = value === 'dark' ? UIBarStyle.Black : UIBarStyle.Default;
|
||||
} else {
|
||||
navigationBar.barStyle = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public accessibilityScreenChanged(refocus = false): void {
|
||||
if (!isAccessibilityServiceEnabled()) {
|
||||
return;
|
||||
|
||||
@ -63,13 +63,6 @@ export class PageBase extends ContentView {
|
||||
}
|
||||
}
|
||||
|
||||
get statusBarStyle(): 'light' | 'dark' {
|
||||
return this.style.statusBarStyle;
|
||||
}
|
||||
set statusBarStyle(value: 'light' | 'dark') {
|
||||
this.style.statusBarStyle = value;
|
||||
}
|
||||
|
||||
public get androidStatusBarBackground(): Color {
|
||||
return this.style.androidStatusBarBackground;
|
||||
}
|
||||
@ -214,15 +207,6 @@ export const enableSwipeBackNavigationProperty = new Property<PageBase, boolean>
|
||||
});
|
||||
enableSwipeBackNavigationProperty.register(PageBase);
|
||||
|
||||
/**
|
||||
* Property backing statusBarStyle.
|
||||
*/
|
||||
export const statusBarStyleProperty = new CssProperty<Style, 'light' | 'dark'>({
|
||||
name: 'statusBarStyle',
|
||||
cssName: 'status-bar-style',
|
||||
});
|
||||
statusBarStyleProperty.register(Style);
|
||||
|
||||
/**
|
||||
* Property backing androidStatusBarBackground.
|
||||
*/
|
||||
|
||||
Reference in New Issue
Block a user