0. 状态条
状态条几乎是iOS6到iOS7之后讨论得比较多的一个UI关注点,以下对常见的问题点整理了一下:
- iOS7下无法通过修改属性直接做到iOS7以前的效果,wantsFullScreenLayout的作用也彻底无效了;如果非要做成和iOS6相同相似的样子,可以用比较麻烦的布局手段来实现,但这是苹果所极力不支持的
- 样式和布局等是不同的方面,互相没有直接影响
- iOS7中只有2个样式可用:UIStatusBarStyleDefault(模糊透明背景+黑色前景文字)、UIStatusBarStyleLightContent(模糊透明背景+白色前景文字),其它样式均不生效,其中前者适用于浅色背景view,后者适用于神色背景view,这里所谓的“背景view”就是会显示在状态栏下面(后面)那层view
- 容器Controller,比如UINavigationController可能会对基于ViewController的状态栏样式设置产生影响
- iOS7之后,状态栏的属性可以通过“基于ViewController”和使用UIApplication对象动态设置两种方式来决定,前者需要在ViewController中实现prefer…方法,后者则可以调用application对象的setStatusBar…方法进行动态控制;这两种方式是互斥的,不能一起用
- 如果想控制启动页面的状态栏样式或者显示/隐藏,可通过Info.plist中的key-value设置
1. NavigationBar、TabBar和edgesForExtendedLayout属性
在iOS7中,有个不成文的布局规则,当导航条(navigation bar)遇到了状态条(status bar),系统会自动连接成一个高度为64(状态条的20+导航条的44)的半透明结合体顶部Bar。而如果导航条没有挨到状态条(我只能说这种状况很少见),则高度还按自己单独的44计算。
默认情况下,用UINavigationController包装过的controller的view会自动延伸到屏幕顶端,在如上所说的64高度连接体顶部Bar出现的情况下,content view的上部64高度部分会被半透明地遮盖住。
默认情况下,使用UITabBarController情况类似,底部的44部分会被半透明形式遮盖住。
而这正是edgesForExtendedLayout属性发挥作用的地方,可以通过对content view controller对象的此属性设置UIRectEdgeNone的值,保证content view的任何部分都不被导航条或者TabBar遮盖。ToolBar应该也是类似的。
2. UIScrollView的contentInset自动匹配
我们知道iPhone的屏幕尺寸在不断变大,可是就算变得再大,也总有更多的内容,让一屏不能展示完全。这也正是UIScrollView的价值所在。
在iOS7中,在存在status bar、navigation bar,或者tab bar、tool bar的情况下,我们可能要担心,content view中的scroll view的上边、下边部分会不会被以半透明的形式覆盖掉。
实际上,这是不必担心的。首先,上面提到的edgesForExtendedLayout属性可以帮我们把content view只控制在可视范围内。另外,在iOS7中,UIViewController还提供了一个automaticallyAdjustsScrollViewInsets属性。它可以使得scroll view的上下部分仍然在各种Bar的后面以半透明的形式显示出来,同时scroll的主题内容不被bar遮盖。
在实际使用的时候,本人发现并不是任何时候都是这样的,能够生效的前提条件是UIScrollView对象是作为content view controller的root view或者是view0。
UITableView和UICollectionView是UIScrollView的子类,因此同样适用。
3. 其它
由于苹果官方文档中,对本文涉及到的内容只是略提,并未详述。本文内容主要是对Jared Sinclair老兄blog内容的翻译,不过其中也结合了很多其它实践、试验过程中的要点,将其丰富化详细化。
此外,破船之家的blog也有一片文章,里面涉及到了各种bar style和layout之外的内容,如tintColor的使用等,供参考:http://beyondvincent.com/blog/2013/11/03/120-customize-navigation-status-bar-ios-7/
本文详细解析了iOS7中状态栏与导航栏的布局规则、属性使用及控制方法,包括如何通过ViewController和UIApplication对象动态设置状态栏样式,以及如何避免状态栏遮挡内容视图的问题。
1240

被折叠的 条评论
为什么被折叠?



