跳到主要内容
版本:v6

@capacitor/status-bar

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

安装​

npm install @capacitor/status-bar@latest-6
npx cap sync

iOS 说明​

此插件需要在 Info.plist 中将 "View controller-based status bar appearance"(UIViewControllerBasedStatusBarAppearance)设置为 YES。阅读关于配置 iOS 的帮助信息。

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

setBackgroundColor 和 setOverlaysWebView 目前不支持 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>

设置状态栏的当前样式。

参数类型
options
StyleOptions

始于: 1.0.0


setBackgroundColor(...)​

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

设置状态栏的背景颜色。

此方法仅支持 Android。

参数类型
options
BackgroundColorOptions

始于: 1.0.0


show(...)​

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

显示状态栏。 在 iOS 上,如果状态栏初始是隐藏的并且初始样式设置为 UIStatusBarStyleLightContent,首次调用 show 时动画可能会出现 文本先显示为深色然后过渡到浅色的闪烁问题。建议 在首次调用时使用 Animation.None 作为动画。

参数类型
options
AnimationOptions

始于: 1.0.0


hide(...)​

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

隐藏状态栏。

参数类型
options
AnimationOptions

始于: 1.0.0


getInfo()​

getInfo() => Promise<StatusBarInfo>

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

返回:

Promise<StatusBarInfo>

始于: 1.0.0


setOverlaysWebView(...)​

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

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

此方法仅支持 Android。

参数类型
options
SetOverlaysWebViewOptions

始于: 1.0.0


接口​

StyleOptions​

属性类型描述始于
style
Style
状态栏文本的样式。1.0.0

BackgroundColorOptions​

属性类型描述始于
colorstring状态栏颜色被设置为此十六进制颜色。此选项仅支持 Android。1.0.0

AnimationOptions​

属性类型描述默认始于
animation
Animation
显示或隐藏时使用的状态栏动画类型。此选项仅支持 iOS。Animation.Fade1.0.0

StatusBarInfo​

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

SetOverlaysWebViewOptions​

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

枚举​

Style​

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

Animation​

成员值描述始于
None'NONE'显示/隐藏时无动画。1.0.0
Slide'SLIDE'显示/隐藏时的滑动动画。在 iOS 15+ 上无效。1.0.0
Fade'FADE'显示/隐藏时的淡入淡出动画。1.0.0