状态栏
状态栏 API 提供了配置状态栏样式以及显示或隐藏状态栏的方法。
iOS 注意事项
此插件要求在 Info.plist 中将 "View controller-based status bar appearance"(UIViewControllerBasedStatusBarAppearance)设置为 YES。请阅读配置 iOS 获取帮助。
状态栏可见性默认为可见,样式默认为 StatusBarStyle.Light。您可以通过在 Info.plist 中添加 UIStatusBarHidden 和/或 UIStatusBarStyle 来更改这些默认值。
setBackgroundColor 和 setOverlaysWebView 目前不支持 iOS 设备。
事件
- statusTap
示例
// 事件(仅 iOS)
window.addEventListener('statusTap', function () {
console.log('状态栏被点击');
});
// API
import { Plugins, StatusBarStyle } from '@capacitor/core';
const { StatusBar } = Plugins;
export class StatusBarExample {
isStatusBarLight = true;
changeStatusBar() {
StatusBar.setStyle({
style: this.isStatusBarLight ? StatusBarStyle.Dark : StatusBarStyle.Light,
});
this.isStatusBarLight = !this.isStatusBarLight;
// 在透明状态栏下显示内容(仅 Android)
StatusBar.setOverlaysWebView({
overlay: true,
});
}
hideStatusBar() {
StatusBar.hide();
}
showStatusBar() {
StatusBar.show();
}
}
API
setStyle(...)
setStyle(options: StatusBarStyleOptions) => Promise<void>
设置状态栏的当前样式
| 参数 | 类型 |
|---|---|
options | |
setBackgroundColor(...)
setBackgroundColor(options: StatusBarBackgroundColorOptions) => Promise<void>
设置状态栏的背景颜色
| 参数 | 类型 |
|---|---|
options | |
show(...)
show(options?: StatusBarAnimationOptions) => Promise<void>
显示状态栏
| 参数 | 类型 |
|---|---|
options | |
hide(...)
hide(options?: StatusBarAnimationOptions) => Promise<void>
隐藏状态栏
| 参数 | 类型 |
|---|---|
options | |
getInfo()
getInfo() => Promise<StatusBarInfoResult>
获取状态栏当前状态的信息
返回:
Promise<StatusBarInfoResult>
setOverlaysWebView(...)
setOverlaysWebView(options: StatusBarOverlaysWebviewOptions) => Promise<void>
设置状态栏是否应覆盖 webview,以允许使用设备"刘海"周围的空间。
| 参数 | 类型 |
|---|---|
options | |
接口
StatusBarStyleOptions
| 属性 | 类型 |
|---|---|
style | |
StatusBarBackgroundColorOptions
| 属性 | 类型 |
|---|---|
color | string |
StatusBarAnimationOptions
| 属性 | 类型 | 描述 |
|---|---|---|
animation | | 仅 iOS。显示或隐藏时使用的状态栏动画类型。 |
StatusBarInfoResult
| 属性 | 类型 |
|---|---|
visible | boolean |
style | |
color | string |
overlays | boolean |
StatusBarOverlaysWebviewOptions
| 属性 | 类型 |
|---|---|
overlay | boolean |
枚举
StatusBarStyle
| 成员 | 值 | 描述 |
|---|---|---|
Dark | "DARK" | 深色背景上的浅色文字。 |
Light | "LIGHT" | 浅色背景上的深色文字。 |
StatusBarAnimation
| 成员 | 值 | 描述 |
|---|---|---|
None | "NONE" | 显示/隐藏时无动画。 |
Slide | "SLIDE" | 显示/隐藏时滑动动画。 |
Fade | "FADE" | 显示/隐藏时淡入淡出动画。 |