跳到主要内容
版本:0.80

StatusBar

用于控制应用状态栏的组件。状态栏通常位于屏幕顶部,显示当前时间、Wi‑Fi 和蜂窝网络信息、电池电量和/或其他状态图标。

与 Navigator 一起使用

可以同时挂载多个 StatusBar 组件。属性会按照 StatusBar 组件的挂载顺序进行合并。

命令式 API

在不适合使用组件的情况下,也提供了通过组件上的静态函数暴露的命令式 API。不过,不建议针对同一属性同时使用静态 API 和组件,因为通过静态 API 设置的任何值都会在下一次渲染时被组件设置的值覆盖。


参考

常量

currentHeight
Android

状态栏的高度,如果存在刘海屏,则包括刘海高度。


属性

animated

状态栏属性更改之间的过渡是否应当动画化。支持 backgroundColorbarStylehidden 属性。

TypeRequiredDefault
booleanNofalse

backgroundColor
Android

状态栏的背景色。

注意

由于 Android 15 引入的边到边强制要求,在 API 级别 35 中设置状态栏背景色已被弃用,设置后将不会生效。你可以在这里阅读更多关于我们的 边到边建议

TypeRequiredDefault
colorNodefault system StatusBar background color, or 'black' if not defined

barStyle

设置状态栏文本的颜色。

在 Android 上,这仅会对 API 23 及以上版本产生影响。

TypeRequiredDefault
StatusBarStyleNo'default'

hidden

状态栏是否隐藏。

TypeRequiredDefault
booleanNofalse

networkActivityIndicatorVisible
iOS

网络活动指示器是否应当可见。

TypeDefault
booleanfalse

showHideTransition
iOS

使用 hidden 属性显示和隐藏状态栏时的过渡效果。

TypeDefault
StatusBarAnimation'fade'

translucent
Android

状态栏是否半透明。将 translucent 设为 true 时,应用会在状态栏下方绘制内容。当使用半透明状态栏颜色时,这很有用。

注意

由于 Android 15 引入的边到边强制要求,在 API 级别 35 中将状态栏设置为半透明已被弃用,设置后将不会生效。你可以在这里阅读更多关于我们的 边到边建议

TypeDefault
booleanfalse

方法

popStackEntry()

React TSX
static popStackEntry(entry: StatusBarProps);

获取并移除堆栈中的最后一个 StatusBar 条目。

Parameters:

NameTypeDescription
entry
Required
anypushStackEntry 返回的条目。

pushStackEntry()

React TSX
static pushStackEntry(props: StatusBarProps): StatusBarProps;

将一个 StatusBar 条目压入堆栈。完成后应将返回值传递给 popStackEntry

Parameters:

NameTypeDescription
props
Required
any包含要在堆栈条目中使用的 StatusBar 属性的对象。

replaceStackEntry()

React TSX
static replaceStackEntry(
entry: StatusBarProps,
props: StatusBarProps
): StatusBarProps;

用新的属性替换现有的 StatusBar 堆栈条目。

Parameters:

NameTypeDescription
entry
Required
any要替换的 pushStackEntry 返回的条目。
props
Required
any包含要在替换后的堆栈条目中使用的 StatusBar 属性的对象。

🗑️ setBackgroundColor()
Android

React TSX
static setBackgroundColor(color: ColorValue, animated?: boolean);

设置状态栏的背景色。

注意

由于 Android 15 引入的边到边强制要求,在 API 级别 35 中设置状态栏背景色已被弃用,设置后将不会生效。你可以在这里阅读更多关于我们的 边到边建议

Parameters:

NameTypeDescription
color
Required
string背景色。
animatedboolean为样式更改添加动画。

setBarStyle()

React TSX
static setBarStyle(style: StatusBarStyle, animated?: boolean);

设置状态栏样式。

Parameters:

NameTypeDescription
style
Required
StatusBarStyle要设置的状态栏样式。
animatedboolean为样式更改添加动画。

setHidden()

React TSX
static setHidden(hidden: boolean, animation?: StatusBarAnimation);

显示或隐藏状态栏。

Parameters:

NameTypeDescription
hidden
Required
boolean隐藏状态栏。
animation
iOS
StatusBarAnimation更改状态栏隐藏属性时的动画。

🗑️ setNetworkActivityIndicatorVisible()
iOS

Deprecated

状态栏网络活动指示器在 iOS 13 及更高版本中不受支持。未来版本中将移除此功能。

React TSX
static setNetworkActivityIndicatorVisible(visible: boolean);

控制网络活动指示器的可见性。

Parameters:

NameTypeDescription
visible
Required
boolean显示指示器。

setTranslucent()
Android

React TSX
static setTranslucent(translucent: boolean);

控制状态栏的半透明性。

注意

由于 Android 15 引入的边到边强制要求,在 API 级别 35 中将状态栏设置为半透明已被弃用,设置后将不会生效。你可以在这里阅读更多关于我们的 边到边建议

Parameters:

NameTypeDescription
translucent
Required
boolean设为半透明。

类型定义

StatusBarAnimation

用于 iOS 上过渡的状态栏动画类型。

Type
enum

常量:

ValueTypeDescription
'fade'string淡入淡出动画
'slide'string滑动动画
'none'string无动画

StatusBarStyle

状态栏样式类型。

Type
enum

常量:

ValueTypeDescription
'default'string默认状态栏样式(iOS 为深色,Android 为浅色)
'light-content'string白色文本和图标
'dark-content'string深色文本和图标(Android 需要 API>=23)