跳到主要内容
版本: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 来更改这些默认值。

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>

设置状态栏的当前样式。

参数类型
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
状态栏文本的 Style1.0.0

BackgroundColorOptions

属性类型描述自版本
colorstring设置状态栏颜色的十六进制颜色值。此选项仅在 Android 上受支持。1.0.0

AnimationOptions

属性类型描述默认值自版本
animation
Animation
显示或隐藏状态栏时使用的动画类型。此选项仅在 iOS 上受支持。Animation.Fade1.0.0
属性类型描述始于版本
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