iOS多设备UI适配规范方案

iOS5.0于本周提交App Store，这两天iOS手雷成员各自都在总结。如果你仅仅认为首页/搜索改版是主要需求，那你就错了，其实iPhone6、iPhone6Plues的适配才是重点。
随着苹果发布iPhone6、iPhone6Plues，过去只属于Android设备的移动App多种设备尺寸适配问题，iOS的适配问题终于还是来了。
研发GG表示蛋疼。。。（根本是库克没调研清楚，小道消息说iPhone8又要回归4寸屏）
由于经验不足，发版过程界面适配BUG一直反复。为了将来不再受制于界面适配影响工作进度，总结5.0的经验之后，今天手雷iOS小伙伴们坐下来一起定制了这份UI规范。

以iPhone6为标准，对iPhone其他分辨率，制定了不同类型的适配方案。
首先了解iPhone主流设备：



将控件分为这几类：
一、 文字流
文字流控件定义了一种方案：
1、 字号、行高都不变；
2、 行数，是否定行需看具体内容；
3、 控件整体以iPhone6为标准，进行等比缩放。iPhone6在此基础上乘以1.10倍，iPhone5在此基础上除以1.17。

二、 弹性控件
方法一：控件不变、间距变；



（如淘宝底部导航）

方法二：间距不变，缩放控件；



（如手雷轮播图下四个入口）

方法三：左对齐，间距和控件都不变；如App Store中“精品推荐”效果
（家里打不开store，无法截图 /(ㄒoㄒ)/~~）

三种方案中，方案一最适合手雷这个产品，方案二为辅助。
方案三目前没用，最为备选。

三、 图片
方案一：像轮播图、广告图，这类横向拉通的图片需要做多套图，保持图片高度不变；



方案二：小图，则进行等比缩放。以iPhone6为标准，进行等比缩放。iPhone6在此基础上乘以1.10倍，iPhone5在此基础上除以1.17。

四、 两种控件叠加
后三种情况，在很多同行分享的博客上并没有提到，或许他们笼统的归纳到前三种之中，但我们还是觉得需要单独定义。

两种控件叠加的情况就要分视觉设计来分类了：
若与上层控件与底部密切关联较强，就可按等比的方案来操作。



（手雷“热门资源”模块中的叠加效果）

若关联性不够强，则可以上层控件大小不变，间距也不变而仅缩放下层控件。



（搜索中的图标没变，输入框等比拉伸）

五、 Table View
1、 左右固定；
2、 中间拉伸；
3、 高度不变；



（手雷我的首页list）

六、 模块间
保持模块间高度不变，不需要过多处理。



---------------------------------