难以执行的伸缩Diner
现在，你需要对diner本身进行拉伸 - 包括背景和计数图片。
切回更小的屏幕尺寸 然后同时选中背景和计数视图: 分别是Image View – bg_wall.png 和 Image View – bg_counter.png. 它们已经有约束了，当屏幕增大时，这些视图会被拉伸。下面我们再来选中pin图标…
添加 Trailing Space to Superview 约束，如下图所示…
然后再点击外形切换按钮，来看看具体效果。
如上图，背景图片如预期的一样被扩大了，但是图片不够大，所以被居中显示了。当程序运行在4英寸的屏幕上时，你需要修改图片，但是这里没有这样的一种机制：“针对3.5英寸屏幕使用这个图片，而针对4英寸屏幕则使用别的图片”。因此，在这里需要通过编写代码进行处理。
在storyboard中，打开assistant view，通过control-drag counter和background UIView来创建IBoutlets，名字分别为 ibCounter 和 ibBackgroundImage.
接下来，在Supporting Files 群组中选择 iOSDiner-Prefix.pch 文件，并在底部的#endif 上面添加如下代码 (归功于StackOverflow):
通过上面这行代码你可以知道程序现在是否运行在大尺寸屏幕中。代码实际上就是通过当前屏幕的尺寸，减去iPhone 5的屏幕尺寸，如果结果是0，那么说明设备是iPhone 5。
下面在 IODViewController.m文件中使用这个宏。 将如下代码添加到viewWillAppear:最后：
上面的代码首先检查当前程序是否运行在iPhone 5上（大屏幕）；如果是的话，设置一个新的，大版本的图片。这里的图片已经存在于之前下载的starter工程中了。
在这里，可能你要问“不应该是
吗？嗯, 不是的. 请记住UIImage会自动的添加“@2x” 来寻找针对retina的图片。因此即使你工程中包含的是
图片, 最终选择使用图片时也不需要@“2x”。
编译并运行程序，效果如下图所示:
移开点，你挤到我了！
现在，程序有一个更大的背景了，但是右边的空间还是没有利用上。而这时，所有的东西都挤在左边了。下面就来对收银员位置重新定位一下，以利用额外的空间。
跟之前一样，确保使用3.5英寸的外形尺寸来编辑storyboard。现在选中Bill（视图的名字是 Image View – person.png) ，并添加一个新的 Trailing Space to SuperView pin 约束.
跟右箭头一样，Bill已经有一个Leading 约束了, 所以，如果现在切到4英寸的屏幕上，Bill将被拉伸。你知道的，Bill虽然是工作在一个快餐厅，但是他并没有那么胖！选中 Leading Space to: Image View 约束并将其删除掉。
再次切换一下外形尺寸。
非常棒！Bill现在被固定到右边，并利用上了更大的屏幕空间了。
注意: 描述区域（如上图现在是“Hamburger”）同样被固定到右边了。但是你并没有对其进行修改呀。这是怎么发生的呢？
这是因为这个图片被固定到文本标签上，而这个文本标签是被固定到Bill图片上的。因此当Bill的位置发生改变时，也会对描述文本控件和图片进行更新。
Auto Layout必须在iOS 6 中吗？
现在如果你将这个iOS Diner程序运行在iPhone5.1 Simulator上，程序在启动的时候就会crash（奔溃）掉，实际上， 实际上，只要你在storyboard上开启Auto Layout，那么就会发生这个错误。这也是为什么Auto Layout必须要在iOS 6中才支持。
对于这个程序可能不是一个大问题，因为此时大约有87%的用户已经在使用iOS 6了（ are using iOS 6），但是需要知道这点。
当你发布一个程序时，你需要决定程序将支持iOS最低的版本。针对全新的程序，你可能希望选择iOS 6，但是在本文中，是对已有的程序进行升级。如果你提高了支持的最低版本，可能当前的用户并没有升级到最新的iOS版本，那么就会遇到问题哦。
通常，你有两个选择:
1.你可以修改工程的部署目标（deployment target），指定你的程序运行所需要的iOS版本。
2.你可以让你的程序向后兼容。
下面我将对这两个选择都进行介绍。在本文中，你也可以只做一个，当然两个也行 — 如果你愿意的话，也可以忽略掉本节的全部内容！
修改部署目标（ deployment target）
要修改部署目标，可以这样操作：在工程导航面板中，选中 iOSDiner 工程，然后选中顶部的iOSDiner（在Project下面）. 接着选择 Info 选项卡，然后将 iOS Deployment Target 修改至6.0 (最新).
注意，你也可以直接在Targets列表中修改iOSDiner 生成的target，如下所示：
上面两种方法的区别是target中设置的值会替代project中设置的。如果你要生成多个target以部署到不同的平台版本上，这个方法非常有用。
使程序向后兼容
如果你希望让程序向后兼容，以支持更早的iOS版本，那么你将必须做更多的工作。如果你使用的是Storyboard（跟IOSDiner一样），那么最简单的方法就是创建2个不同的Storyboard，一个是使用Auto Layout，另外一个不使用。然后在程序启动的时候，告诉程序使用哪个Storyboard。
现在程序被设置为启动的时候自动加载一个storyboard。这涉及到工程的Main Storyboard.
要根据具体的iOS版本使用不同的storyboard，那么就不能在程序启动的时候自动加载一个storyboard了。要停止自动加载storyboard，可以这样操作：清除target中Summary 设置选项里面的 Main Storyboard 内容. 只需要清除当前的值就可以，如下图所示：
接着，选中 MainStoryboard.storyboard 然后选择 FileDuplicate…. 将新的文件命名为MainStoryboard-legacy.storyboard 并将其保存。
现在选中 MainStoryboard-legacy.storyboard, 将显示出来的编辑器设置为更小的外观尺寸，然后取消勾选 Use Autolayout.
现在打开 IODAppDelegate.m 文件，然后按照如下进行修改（来自 this 文章）
将下面的代码添加到 @implementation IODAppDelegate上面:
上面的代码定义了一个宏，当你在调用这个宏的时候，可以根据用当前设备中iOS版本跟指定的版本进行比较，以判断当前的设备版本是否比制定的版本还要新。
用下面的代码替换application:didFinishLaunchingWithOptions:
上面的代码会发生如下情况:
1.检查设备中运行的iOS版本。如果是最新的6.0，则加载开启了Auto Layout功能的storyboard。否则，加载没有开启Auto Layout功能的storyboard。
2.然后把storyboard创建的view controller设置给程序的window。
现在，你针对Auto Layout处理和设备的兼容，你已经有两个很好的选择了 – 但是现在还有一个大问题。
如何利用多余出来的空间呢
有了新的界面空间，屏幕将不在像之前那样拥挤了。 针对多出来的空间最好在美学上加强设计，而不是利用多出来的空间增加功能，如果你愿意的话，本文到现在已经完成了4英寸屏幕的匹配工作，你可以停止下来了。不过增加出来的空间你可以做什么呢？
如何使用新增的空间呢？一般来说你有两个选择：
首先，如果你的程序是数据驱动型（data-driven），你可以扩大视图，以显示更多的数据。在使用list或grid时，这非常游泳，比如Twitter程序。每屏中你可以添加另外的1到2个列表项。
另外一个选择就是利用额外的空间为程序增加功能。再看看Twitter程序，你可以在底部增加一个tab bar，通过这个tab bar可以访问一些经常需要访问或者难以访问到的功能。
现在，这里有一个很好的例子 djay for iPhone.：这个例子在额外的空间中增加了功能。
在老的3.5英寸用户界面上，开发者只能在屏幕中放置两个唱盘。用户要想访问类似查看BMP或者修改拍子速度（tempo）时，必须要修改程序的界面。
而针对新的iPhone 5，可以对程序显示的内容进行优化，一些基本的BMP信息和一个拍子速度可以全部放在一个视图中。
类似上面这样增强用户界面功能是很棒的，但是这样会引入一个非常棘手的问题：如何设计或者升级一个已有的程序，以适配老的3.5英寸和新的4英寸屏幕呢？
部分答案是取决于你的程序使用的是Storyboard还是.xib文件。如果都不是，而是使用代码创建UI，那么你可能需要使用类似之前IS_IPHONE5 这样的宏来获得屏幕的尺寸，然后对UI元素做出相应的调整。
如果你使用的是Storyboard，那么让程序向后兼容是非常容易的事情 — 创建多个Storyboard，然后在代码中使用像IS_IPHONE5这样的宏来判断当前设备需要加载哪个Storyboard。
何去何从？
恭喜! 你已经成功的将一个已经存在的程序升级到适配新的iPhone 5屏幕了，并对一些界面进行了调整，以利用上额外的空间，并为程序做了向后兼容处理，以适配早期的屏幕尺寸和iOS版本。如果现在之前的大屏幕吓到你了，那么现在你应该感觉良好啦！
现在，你需要对diner本身进行拉伸 - 包括背景和计数图片。
切回更小的屏幕尺寸 然后同时选中背景和计数视图: 分别是Image View – bg_wall.png 和 Image View – bg_counter.png. 它们已经有约束了，当屏幕增大时，这些视图会被拉伸。下面我们再来选中pin图标…
添加 Trailing Space to Superview 约束，如下图所示…
然后再点击外形切换按钮，来看看具体效果。
如上图，背景图片如预期的一样被扩大了，但是图片不够大，所以被居中显示了。当程序运行在4英寸的屏幕上时，你需要修改图片，但是这里没有这样的一种机制：“针对3.5英寸屏幕使用这个图片，而针对4英寸屏幕则使用别的图片”。因此，在这里需要通过编写代码进行处理。
在storyboard中，打开assistant view，通过control-drag counter和background UIView来创建IBoutlets，名字分别为 ibCounter 和 ibBackgroundImage.
接下来，在Supporting Files 群组中选择 iOSDiner-Prefix.pch 文件，并在底部的#endif 上面添加如下代码 (归功于StackOverflow):
通过上面这行代码你可以知道程序现在是否运行在大尺寸屏幕中。代码实际上就是通过当前屏幕的尺寸，减去iPhone 5的屏幕尺寸，如果结果是0，那么说明设备是iPhone 5。
下面在 IODViewController.m文件中使用这个宏。 将如下代码添加到viewWillAppear:最后：
上面的代码首先检查当前程序是否运行在iPhone 5上（大屏幕）；如果是的话，设置一个新的，大版本的图片。这里的图片已经存在于之前下载的starter工程中了。
在这里，可能你要问“不应该是
吗？嗯, 不是的. 请记住UIImage会自动的添加“@2x” 来寻找针对retina的图片。因此即使你工程中包含的是
图片, 最终选择使用图片时也不需要@“2x”。
编译并运行程序，效果如下图所示:
移开点，你挤到我了！
现在，程序有一个更大的背景了，但是右边的空间还是没有利用上。而这时，所有的东西都挤在左边了。下面就来对收银员位置重新定位一下，以利用额外的空间。
跟之前一样，确保使用3.5英寸的外形尺寸来编辑storyboard。现在选中Bill（视图的名字是 Image View – person.png) ，并添加一个新的 Trailing Space to SuperView pin 约束.
跟右箭头一样，Bill已经有一个Leading 约束了, 所以，如果现在切到4英寸的屏幕上，Bill将被拉伸。你知道的，Bill虽然是工作在一个快餐厅，但是他并没有那么胖！选中 Leading Space to: Image View 约束并将其删除掉。
再次切换一下外形尺寸。
非常棒！Bill现在被固定到右边，并利用上了更大的屏幕空间了。
注意: 描述区域（如上图现在是“Hamburger”）同样被固定到右边了。但是你并没有对其进行修改呀。这是怎么发生的呢？
这是因为这个图片被固定到文本标签上，而这个文本标签是被固定到Bill图片上的。因此当Bill的位置发生改变时，也会对描述文本控件和图片进行更新。
Auto Layout必须在iOS 6 中吗？
现在如果你将这个iOS Diner程序运行在iPhone5.1 Simulator上，程序在启动的时候就会crash（奔溃）掉，实际上， 实际上，只要你在storyboard上开启Auto Layout，那么就会发生这个错误。这也是为什么Auto Layout必须要在iOS 6中才支持。
对于这个程序可能不是一个大问题，因为此时大约有87%的用户已经在使用iOS 6了（ are using iOS 6），但是需要知道这点。
当你发布一个程序时，你需要决定程序将支持iOS最低的版本。针对全新的程序，你可能希望选择iOS 6，但是在本文中，是对已有的程序进行升级。如果你提高了支持的最低版本，可能当前的用户并没有升级到最新的iOS版本，那么就会遇到问题哦。
通常，你有两个选择:
1.你可以修改工程的部署目标（deployment target），指定你的程序运行所需要的iOS版本。
2.你可以让你的程序向后兼容。
下面我将对这两个选择都进行介绍。在本文中，你也可以只做一个，当然两个也行 — 如果你愿意的话，也可以忽略掉本节的全部内容！
修改部署目标（ deployment target）
要修改部署目标，可以这样操作：在工程导航面板中，选中 iOSDiner 工程，然后选中顶部的iOSDiner（在Project下面）. 接着选择 Info 选项卡，然后将 iOS Deployment Target 修改至6.0 (最新).
注意，你也可以直接在Targets列表中修改iOSDiner 生成的target，如下所示：
上面两种方法的区别是target中设置的值会替代project中设置的。如果你要生成多个target以部署到不同的平台版本上，这个方法非常有用。
使程序向后兼容
如果你希望让程序向后兼容，以支持更早的iOS版本，那么你将必须做更多的工作。如果你使用的是Storyboard（跟IOSDiner一样），那么最简单的方法就是创建2个不同的Storyboard，一个是使用Auto Layout，另外一个不使用。然后在程序启动的时候，告诉程序使用哪个Storyboard。
现在程序被设置为启动的时候自动加载一个storyboard。这涉及到工程的Main Storyboard.
要根据具体的iOS版本使用不同的storyboard，那么就不能在程序启动的时候自动加载一个storyboard了。要停止自动加载storyboard，可以这样操作：清除target中Summary 设置选项里面的 Main Storyboard 内容. 只需要清除当前的值就可以，如下图所示：
接着，选中 MainStoryboard.storyboard 然后选择 FileDuplicate…. 将新的文件命名为MainStoryboard-legacy.storyboard 并将其保存。
现在选中 MainStoryboard-legacy.storyboard, 将显示出来的编辑器设置为更小的外观尺寸，然后取消勾选 Use Autolayout.
现在打开 IODAppDelegate.m 文件，然后按照如下进行修改（来自 this 文章）
将下面的代码添加到 @implementation IODAppDelegate上面:
上面的代码定义了一个宏，当你在调用这个宏的时候，可以根据用当前设备中iOS版本跟指定的版本进行比较，以判断当前的设备版本是否比制定的版本还要新。
用下面的代码替换application:didFinishLaunchingWithOptions:
上面的代码会发生如下情况:
1.检查设备中运行的iOS版本。如果是最新的6.0，则加载开启了Auto Layout功能的storyboard。否则，加载没有开启Auto Layout功能的storyboard。
2.然后把storyboard创建的view controller设置给程序的window。
现在，你针对Auto Layout处理和设备的兼容，你已经有两个很好的选择了 – 但是现在还有一个大问题。
如何利用多余出来的空间呢
有了新的界面空间，屏幕将不在像之前那样拥挤了。 针对多出来的空间最好在美学上加强设计，而不是利用多出来的空间增加功能，如果你愿意的话，本文到现在已经完成了4英寸屏幕的匹配工作，你可以停止下来了。不过增加出来的空间你可以做什么呢？
如何使用新增的空间呢？一般来说你有两个选择：
首先，如果你的程序是数据驱动型（data-driven），你可以扩大视图，以显示更多的数据。在使用list或grid时，这非常游泳，比如Twitter程序。每屏中你可以添加另外的1到2个列表项。
另外一个选择就是利用额外的空间为程序增加功能。再看看Twitter程序，你可以在底部增加一个tab bar，通过这个tab bar可以访问一些经常需要访问或者难以访问到的功能。
现在，这里有一个很好的例子 djay for iPhone.：这个例子在额外的空间中增加了功能。
在老的3.5英寸用户界面上，开发者只能在屏幕中放置两个唱盘。用户要想访问类似查看BMP或者修改拍子速度（tempo）时，必须要修改程序的界面。
而针对新的iPhone 5，可以对程序显示的内容进行优化，一些基本的BMP信息和一个拍子速度可以全部放在一个视图中。
类似上面这样增强用户界面功能是很棒的，但是这样会引入一个非常棘手的问题：如何设计或者升级一个已有的程序，以适配老的3.5英寸和新的4英寸屏幕呢？
部分答案是取决于你的程序使用的是Storyboard还是.xib文件。如果都不是，而是使用代码创建UI，那么你可能需要使用类似之前IS_IPHONE5 这样的宏来获得屏幕的尺寸，然后对UI元素做出相应的调整。
如果你使用的是Storyboard，那么让程序向后兼容是非常容易的事情 — 创建多个Storyboard，然后在代码中使用像IS_IPHONE5这样的宏来判断当前设备需要加载哪个Storyboard。
何去何从？
恭喜! 你已经成功的将一个已经存在的程序升级到适配新的iPhone 5屏幕了，并对一些界面进行了调整，以利用上额外的空间，并为程序做了向后兼容处理，以适配早期的屏幕尺寸和iOS版本。如果现在之前的大屏幕吓到你了，那么现在你应该感觉良好啦！
扫一扫
6497
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
