跳到主要内容
版本:v3

@capacitor/status-bar

StatusBar API 提供了配置状态栏样式以及显示或隐藏它的方法。

安装

npm install @capacitor/status-bar
npx cap sync

iOS 说明

此插件要求在 Info.plist 中将 "View controller-based status bar appearance"(UIViewControllerBasedStatusBarAppearance)设置为 YES。请阅读 配置 iOS 寻求帮助。

状态栏可见性默认为可见,样式默认为 Style.Default。您可以通过在 Info.plist 中添加 UIStatusBarHidden 和/或 UIStatusBarStyle 来更改这些默认值。

setBackgroundColorsetOverlaysWebView 目前在 iOS 设备上不受支持。

示例

import { StatusBar, Style } from '@capacitor/status-bar';

// 仅 iOS
window.addEventListener('statusTap', function () {
console.log('statusbar tapped');
});

// 在透明状态栏下显示内容(仅 Android)
StatusBar.setOverlaysWebView({ overlay: true });

const setStatusBarStyleDark = async () => {
await StatusBar.setStyle({ style: Style.Dark });
};

const setStatusBarStyleLight = async () => {
await StatusBar.setStyle({ style: Style.Light });
};

const hideStatusBar = async () => {
await StatusBar.hide();
};

const showStatusBar = async () => {
await StatusBar.show();
};

API

setStyle(...)

setStyle(options: StyleOptions) => Promise<void>

设置状态栏的当前样式。

参数Type
options
StyleOptions

始于: 1.0.0


setBackgroundColor(...)

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

设置状态栏的背景颜色。

此方法仅在 Android 上受支持。

参数Type
options
BackgroundColorOptions

始于: 1.0.0


show(...)

show(options?: AnimationOptions | undefined) => Promise<void>

显示状态栏。

参数Type
options
AnimationOptions

始于: 1.0.0


hide(...)

hide(options?: AnimationOptions | undefined) => Promise<void>

隐藏状态栏。

参数Type
options
AnimationOptions

始于: 1.0.0


getInfo()

getInfo() => Promise<StatusBarInfo>

获取有关状态栏当前状态的信息。

返回:

Promise<StatusBarInfo>

始于: 1.0.0


setOverlaysWebView(...)

setOverlaysWebView(options: SetOverlaysWebViewOptions) => Promise<void>

设置状态栏是否应覆盖 WebView 以允许使用其下方的空间。

此方法仅在 Android 上受支持。

参数Type
options
SetOverlaysWebViewOptions

始于: 1.0.0


接口

StyleOptions

属性Type描述始于
style
Style
状态栏文字的样式。1.0.0

BackgroundColorOptions

属性Type描述始于
colorstring设置状态栏颜色的十六进制颜色。此选项仅在 Android 上受支持。1.0.0

AnimationOptions

属性Type描述始于
animation
Animation
显示或隐藏时使用的状态栏动画类型。此选项仅在 iOS 上受支持。1.0.0

StatusBarInfo

属性Type描述始于
visibleboolean状态栏是否可见。1.0.0
style
Style
当前状态栏样式。1.0.0
colorstring当前状态栏颜色。此选项仅在 Android 上受支持。1.0.0
overlaysboolean状态栏是否覆盖。此选项仅在 Android 上受支持。1.0.0

SetOverlaysWebViewOptions

属性Type描述始于
overlayboolean是否覆盖状态栏。1.0.0

枚举

Style

成员Value描述始于
Dark'DARK'深色背景上的浅色文字。1.0.0
Light'LIGHT'浅色背景上的深色文字。1.0.0
Default'DEFAULT'在 iOS 13 及更高版本上,样式基于设备外观。如果设备使用深色模式,状态栏文字将为浅色。如果设备使用浅色模式,状态栏文字将为深色。在 iOS 12 及更早版本上,状态栏文字将为深色。在 Android 上,默认值将是应用启动时的样式。1.0.0

Animation

成员Value描述始于
None'NONE'显示/隐藏时无动画。1.0.0
Slide'SLIDE'显示/隐藏时滑动动画。1.0.0
Fade'FADE'显示/隐藏时淡入淡出动画。1.0.0