iOS How to set status bar style

68 篇文章 1 订阅

How to set status bar style


Globally

If you want to change the status bar style to all of your view controllers, you can do it globally with the help of Info.plist.

The default color of the status bar is black text.

Default status barDefault status bar

To change the status bar to white:

  1. Open you Info.plist.
  2. Add View controller-based status bar appearance key (UIViewControllerBasedStatusBarAppearance) and set value to No (false).
  3. Add Status bar style key (UIStatusBarStyle) and set value to Light Content (UIStatusBarStyleLightContent).

Light Content status bar styleLight Content status bar style

Status bar styleValueStatus bar text color
DefaultUIStatusBarStyleDefaultAutomatically chooses light or dark content based on the user interface style. Black text when traitCollection.userInterfaceStyle = UIUserInterfaceStyle.light and white text when traitCollection.userInterfaceStyle = UIUserInterfaceStyle.dark
Dark ContentUIStatusBarStyleDarkContentBlack text, intended for use on light backgrounds
Light ContentUIStatusBarStyleLightContentWhite text, intended for use on dark backgrounds

These two flags are from the old days of iOS, and the use case is quite limited. You can just set and forget, there is no way to change this afterward, so if your app has a different status bar style for some view controller, you might have to consider other methods. For a simple app, this might be what you are looking for.

imgPractical Sign in with Apple: Learn everything you need to know about Sign in with Apple to be able to integrate it in your existing app or a new one.

Style based on view controllers

By default, the status bar style will respect the view controller instance property, preferredStatusBarStyle. You just need to override preferredStatusBarStyle property in a view controller that you want to change the status bar style to return the style you want.

override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
}

The above example will set status bar text color to white.

preferredStatusBarStyle = .lightContentpreferredStatusBarStyle = .lightContent

If your status bar doesn’t change according to the value specified in preferredStatusBarStyle, check View controller-based status bar appearance key (UIViewControllerBasedStatusBarAppearance) in your Info.plist and make sure that it set to YES (true). Or you can simply remove the View controller-based status bar appearance key. The default behavior is already using a view controller-based status bar.

Style based on condition

If you need to change the status bar style dynamically, e.g., you want it to change based on the scrollable content, you can do that with the same property, preferredStatusBarStyle.

var preferredStatusBarStyle: UIStatusBarStyle

Since preferredStatusBarStyle is a get-only property, you can’t set the style directly, but you can control it with a help of simple variable and setNeedsStatusBarAppearanceUpdate() method.

var isDarkContentBackground = false // <1>

func statusBarEnterLightBackground() { // <2>
    isDarkContentBackground = false
    setNeedsStatusBarAppearanceUpdate()
}

func statusBarEnterDarkBackground() { // <3>
    isDarkContentBackground = true
    setNeedsStatusBarAppearanceUpdate() <4>
}

override var preferredStatusBarStyle: UIStatusBarStyle {
    if isDarkContentBackground { // <5>
        return .lightContent
    } else {
        return .darkContent
    }
}

<1> We declare a new variable to dictate current background color.
<2> A function to call when scrollable content under status bar become ligth. We simply set isDarkContentBackground to false.
<3> A function to call when scrollable content under status bar become dark. We set isDarkContentBackground to true.
<4> You need to call setNeedsStatusBarAppearanceUpdate() to notify the system that the value from preferredStatusBarStyle has changed.
<5> We return a status bar style based on isDarkContentBackground value.

Change status bar style based on variableChange status bar style based on variable

And If you call the setNeedsStatusBarAppearanceUpdate() method within an animation block, the changes will be animated along with the rest of the animation block and produce a nice fading effect.

func statusBarEnterLightBackground() { // 
    isDarkContentBackground = false
    UIView.animate(withDuration: 0.3) {
        self.setNeedsStatusBarAppearanceUpdate()
    }
}

func statusBarEnterDarkBackground() { // 
    isDarkContentBackground = true
    UIView.animate(withDuration: 0.3) {
        self.setNeedsStatusBarAppearanceUpdate()
    }
}

Animated status bar style changeAnimated status bar style change

原文地址

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

WMSmile

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值