You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Android与iOS状态栏(Statusbar)动态修改实现方案咨询

如何在Android和iOS完整自定义状态栏(Status Bar)

作为应用开发新手,你完全可以实现比文字颜色更多的状态栏自定义!下面分平台给你详细方案,附带示例图参考:

Android 平台自定义方案

Android 允许你自定义状态栏的背景色、文字/图标颜色、是否隐藏,甚至添加自定义视图,具体实现分不同版本(Android 5.0+ 是关键节点):

1. 修改状态栏背景色

res/values/styles.xml(或针对高版本的 res/values-v21/styles.xml)中配置:

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- Android 5.0+ 状态栏背景色 -->
    <item name="android:statusBarColor">@color/custom_status_bar_color</item>
</style>

或者在代码中动态设置(适合运行时切换):

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    window.statusBarColor = ContextCompat.getColor(this, R.color.custom_status_bar_color)
}

示例图Android蓝色自定义背景状态栏

2. 自定义状态栏文字/图标颜色

除了系统默认的浅色/深色,Android 10+ 支持更灵活的颜色设置:

  • 基础切换(浅色/深色):
// 深色文字图标(适合浅色状态栏背景)
window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR
// 浅色文字图标(适合深色状态栏背景)
window.decorView.systemUiVisibility = 0
  • Android 10+ 自定义文字颜色:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
    val statusBarTextColor = ContextCompat.getColor(this, R.color.custom_text_color)
    window.statusBarColor = ContextCompat.getColor(this, R.color.custom_bg_color)
    window.isStatusBarContrastEnforced = false
    // 通过关闭强制对比度,实现自定义文字与背景的搭配
}

3. 添加自定义视图到状态栏

Android 允许你将布局延伸到状态栏下方,然后在布局顶部添加自定义视图模拟状态栏效果:

<!-- 在布局根节点添加属性 -->
android:fitsSystemWindows="false"
android:clipToPadding="false"

然后在布局顶部添加一个高度为 @dimen/status_bar_height 的视图,设置自定义背景和内容(比如图标、文字)。
示例图Android带自定义视图的状态栏

iOS 平台自定义方案

iOS 对状态栏的自定义同样灵活,支持背景色、文字颜色、隐藏,以及自定义内容(需要借助导航栏或自定义视图):

1. 修改状态栏背景色

iOS 本身没有直接设置状态栏背景的API,通常有两种实现方式:

// 方法1:通过导航栏继承背景色(使用UINavigationController时)
navigationController?.navigationBar.barTintColor = UIColor(red: 33/255, green: 150/255, blue: 243/255, alpha: 1)
navigationController?.navigationBar.isTranslucent = false
// 状态栏会自动继承导航栏的背景色
// 方法2:添加自定义视图覆盖状态栏区域
let statusBarView = UIView(frame: UIApplication.shared.statusBarFrame)
statusBarView.backgroundColor = UIColor.orange
view.addSubview(statusBarView)

示例图iOS蓝色自定义背景状态栏

2. 修改状态栏文字颜色

Info.plist 中设置 UIViewControllerBasedStatusBarAppearanceYES,然后在ViewController中重写:

override var preferredStatusBarStyle: UIStatusBarStyle {
    // 浅色文字(适合深色背景)
    return .lightContent
    // 深色文字(适合浅色背景)
    // return .darkContent
}

如果需要动态切换,调用:

setNeedsStatusBarAppearanceUpdate()

3. 自定义状态栏内容

iOS 可以通过隐藏系统状态栏,然后添加自定义UIView实现完全自定义的状态栏(比如添加按钮、进度条):

// 隐藏系统状态栏
override var prefersStatusBarHidden: Bool {
    return true
}
// 添加自定义状态栏视图
let customStatusBar = UIView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 47))
customStatusBar.backgroundColor = UIColor.purple
let label = UILabel(frame: CGRect(x: 16, y: 0, width: customStatusBar.bounds.width-32, height: customStatusBar.bounds.height))
label.text = "自定义状态栏"
label.textColor = .white
customStatusBar.addSubview(label)
view.addSubview(customStatusBar)

示例图iOS自定义内容状态栏

总结

不管是Android还是iOS,都可以实现完全自定义状态栏,从背景色、文字颜色到添加自定义内容都有成熟的方案。根据你的应用场景选择对应的实现方式即可,注意不同系统版本的兼容性哦!

内容的提问来源于stack exchange,提问作者Ahsan

火山引擎 最新活动