iOS 7 适配

注意没，是与statusBar重叠了。

下面我们做一些修改，修改AppDelegate中的window的rootViewController值：

我们的button到哪儿去了，其实它是被Navigation Bar档住了。细心的读者可能会问，你刚才不是说了Navigation Bar是半透明的吗？即然是半透明的为何我看不到button呢？ 的确Navigation Bar是半透明的，不过透明度不高，然后看不清后成的button.如果你不相信，你可以再一个黑色的view看看效果。将下面代码放入 viewDidLoad

现在可以清楚的看到Navigation Bar后面的view， 可以看到，UIViewController的view是全屏的坐标系了。

这样与我们iOS6与以前的坐标不一样了，以前是从Navigation Bar底部开始计算y值的，现在却是从Status Bar开始计算y值。

不要着急，苹果公司有解决方案：将下面代码放在viewDidLoad中

现在坐标就是开始从Navigation Bar开始计算了。然而这种情况只适合在Navigation Bar的情况，如果没有Navigation Bar, 坐标仍然是从Status Bar顶部开始计算的。

如果底部有Tab Bar的情况呢，如果要兼容以前的frame设置，那么就需要设置UIViewController的edgesForExtendedLayout为UIRectEdgeNone。

代码如何适配iOS7

如果我们的代码没有用storyboard, 没有用xib,纯代码的情况，如果要适配iOS7，那么上面只是介绍了有Navigation Bar, Tool Bar的情况，如果只是单纯的View,那么我们的代码运行在iOS7上，会有向上20px偏移，这需要手动修改：

不过第二种方法有问题，当你Rotate Simulator的时候你将会看到问题，Status Bar位置将不动。所以我不推荐用第二种方法，可以写一个UIViewController的category方法，然后调用方法一中的代码。这样对全工 程进行修改以适配iOS7.

下面介绍一下xib的方法

新建一个UIViewController的子类，叫TestViewController，选中创建xib文件 然后，在在AppDelegate中将window的rootViewController换成我们新建的TestViewController实例，代 码如下：

现在我们在xib中拖入一个button，frame为(177, 0, 73, 44)?
由于iOS7中扁平化设计了，button没有了边框，等一下我们会用xcode5+ios7来运行本程序，为了更清楚的看清frame，在此我将 button的边框显示出来，前面代码生成的button也是显示了边框的，我们关系一个UIButton的变量textBtn到代码中,并用代码再生成 一个button

关闭xocde4.5与Simulator,然后用xcode5打开用iOS7的效果：?
对比可以看出，iOS7是全屏的模式。 这样一来，从iOS6中升级过来的程序，布局就不正确了，有20px的偏移，上面介绍了用代码解决的方法，在这儿我们先用代码的方法来试试，在viewWillAppear中加入以下代码：

其中代码加入的button，下移了20px, 可是xib中拖入的button还是以status bar顶为y＝0开始计算frame.这可能是由于我们用到了auto layout, 所以xib有自己的frame计算方式. 代码生成的没有用auto layout约束，则受到了上面代码的影响。 我们在xocde5中选择xib，如果是xcode4.6创建的xib, xcode5会提示你升级，我们选择升级，如果你选择了忽略也没关系，可以在右边的open in下拉列表中选择xcode5. xcode5对xib做了很多优化，相比以前的xib，xcode5的xib文件不但小，而且功能更强大。 我们禁用xib的autolayout试试，再运行：?
这下由于没有auto layout的作用，都开始从status bar下面开始计算frame了。

如果你的程序view全是xib，没有用代码生成，那么这儿还有一种解决方法，()条件是xib中没有开启autolayout)不用代码控制self.view.bounds,所以我们先将viewDidLoad中的

细心的你可能发现了，右边较之前的版本多一些内容。多了一个ios6/ios7 Deltas.它就是用来做iOS6的xib适配到iOS7用的东西。 由于iOS7中，全屏的模式，所以我们需要设置我们的＋20,这样才从status bar底部开始显示。现在我们将我们的button的y值设为20.如图：?
xcode5+ios7运行效果：?
由于它的frame是从20开始的，细心的读者可能会有疑问了，如果我们运行在iOS7以前的设备上，由于frame是从20开始的，不是我们想要的效果。的确是这样的，下面是iOS6上运行的效果：?
是从status bar下面20px.
也就是说适配工作不成功。 等等，刚才我们说的ios6/ios7 Deltas,现在是时候出场了。 现在我们在将Deltas中y值设为-20.?
再运行到iOS6的设备上，效果如下：?

小结： 从iOS7以前的工程适配到iOS7，且没有用autolayout,

1. 在viewDidLoad中加入以下代码完成短配工作

运行程序效果：

可以看到是垂直方向上距status bar底部是45px，距右边是186px.

现在我们用xcode5打开这个工程。会提示Upgrade storyboard，我们点击Upgrade. Upgrade后，你会发现，垂直方向上有变化了，约束是从顶部开始，不是从status bar底部开始计算。这也我们想要的结果不一样，我们还是希望约束是从status bar底部开始计算。

仔细看看storyboard中的View Controller， 你会发现，这儿多了两个东东，分别是Top Layout Guide，Bottom Layout Guide.?

选在我们的button,按住control键，然后拖到Top Layout Guide上，在弹出的对话框选择Vertical spacing

这样又建立了一个垂直约束，你会发现这个约束是从Status bar底部开始计算的。这个约束有点像是我们需要的，?
但是这个约束距status bar是25px,我们想要的是45px. 那只需要修改一下，将25px改为45px?
你会发现有storyboard中有红色提示，这说明约束条件发生了冲突，因为垂直约束的值都为45，显示冲突了。由于我们只需要status bar底部开始计算的那个约束，所以我们将旧的那个删掉即可。?

现在分别选择iOS6/iOS7来运行。都是距status bar下面45px显示button. 适配工程完成。

顺便介绍一下xcode5中，用xib或storyboard布局的时候，preview iOS7与iOS7以前版本的效果。 快捷键：option+command+enter 打开Assistant editor,然后选择右边的automatic->preview->xxxxx(preview)

然后在出现的画面下面有一个切换iOS7与以前版本的切换开关

这样可以方例你实时的查看布局效果以适配不同版本的iOS.

最后： auto layout是好东西，虽然只有>iOS6的版本才支持，但是我还是建意大家用auto layout,因为以后苹果也可能出现多种屏幕，到时候代码修改量将会减少。

参考：https://developer.apple.com/library/ios/qa/qa1797/_index.html

查看更多 下一篇