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

当前 iOS 设备不支持 setBackgroundColor 和 setOverlaysWebView 方法。

示例​

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

// 仅 iOS 有效
window.addEventListener('statusTap', function () {
  console.log('状态栏被点击');
});

// 让内容显示在透明状态栏下方（仅 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>

显示状态栏。

参数类型
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

Interfaces​

StyleOptions​

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

BackgroundColorOptions​

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

AnimationOptions​

属性类型描述版本
animation
Animation
显示/隐藏时使用的状态栏动画类型。仅 iOS 支持此选项。1.0.0

StatusBarInfo​

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

SetOverlaysWebViewOptions​

属性类型描述版本
overlayboolean是否让状态栏覆盖 WebView。1.0.0

Enums​

Style​

成员值描述版本
Dark'DARK'深色背景配浅色文字。1.0.0
Light'LIGHT'浅色背景配深色文字。1.0.0
Default'DEFAULT'iOS 13 及以上版本根据设备外观自动适配：深色模式使用浅色文字，浅色模式使用深色文字。iOS 12 及以下版本固定使用深色文字。Android 平台使用应用启动时的默认样式。1.0.0

Animation​

成员值描述版本
None'NONE'显示/隐藏时不使用动画。1.0.0
Slide'SLIDE'使用滑动动画。1.0.0
Fade'FADE'使用淡入淡出动画。1.0.0

Contents

编辑此页