从iOS手雷出发-总结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)

六、       
模块间

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

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

团队总结的适配方案,总结出来当分享了

参考文献:

iPhone 6 / 6 Plus 出现后,如何改进工作流以实现一份设计稿支持多个尺寸?

时间: 2024-11-05 18:29:16

从iOS手雷出发-总结iOS多设备UI适配规范方案的相关文章

如何为 iOS 10~12.1.2 的设备一键越狱

爱思助手Mac版最高已经支持 iOS 12.1.2 一键越狱,对于热衷为设备安装多种插件的用户来说是个重大利好消息,那么如何为 iOS 10~12.1.2 的设备一键越狱呢,我们一起来看看如何操作吧. 注意:越狱行为存在一定的风险,越狱前请首先为设备完成备份. 1.下载安装并打开爱思助手Mac 版,连接设备与电脑,前往「刷机越狱」,点按「一键越狱」标签页: 根据设备版本,点按「iOS 10~12.12 越狱」: 爱思助手将自动安装越狱工具 Unc0ver: 前往 iPhone「设置」-「通用」-

IOS Xcode 无法识别IOS device 突然发生的

今天 我用真机mini好好地 ,再想测试一下iphone 4  发生了意外 两个测试机都找不到设备了 但是 都在充电 还能连接 itune !!!! 我郁闷了 解决办法 是 Mac iTunes 重新更新  据说 itunes 有时候会犯病 影响Xcode  所以 得卸载 重新装 .然后就好使了. 心得:使用测试机 要正常插入 点击iTunes退出机器 . IOS Xcode 无法识别IOS device 突然发生的,布布扣,bubuko.com

iOS 9 时代,iOS 7 占比接近 10% 该何去何从?

iOS 9 时代.iOS 7 占比接近 10% 该何去何从? 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的漂亮人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则.出自本博客的文章拒绝转载或再转载,谢谢合作. 苹果应用商店 2015 年 11 月 30 日监測结果: 马克思告诉我们,运动是绝对

移动应用开发(IOS/android等)中一个通用的图片缓存方案讲解(附流程图)

在移动应用开发中,我们经常会遇到从网络请求图片到设备上展示的场景. 如果每次都重复发起请求,浪费流量.浪费电量,用户体验也不佳: 将图片持久化到磁盘也不失为一种策略:但每次从文件读取图片也存在一定的io开销,就算采用此策略,我们也需要控制磁盘缓存的容量,以免占用过多系统资源. 其实没有一个方案可以说是完美的方案,只有最适合自己业务需求的方案,才可以说是一个好方案. 我们下面所讲解的方案具备很强的通用性,设计思路简单而清晰: 1.假设每个网络图片的url具有唯一性,如果网络上的图片变化了,会引起输

【iOS官方文档翻译】iOS蓝牙的基本概念

之前写了[iOS官方文档翻译]iOS的蓝牙连接.数据接收及发送一文,介绍了怎样进行蓝牙通讯,但是很多基本概念没有进行解释,看起来可能有点吃力,所以现在再翻译一篇苹果对官方蓝牙4.0一些基本概念介绍的文章. 1.中心设备和外围设备以及它们在蓝牙通讯中的角色. 在所有的BLE( Bluetooth low energy,下文简称蓝牙4.0 )通讯中都涉及2个主要的角色:中心设备和外围设备.它是基于传统的客户-服务器(主从式)结构,一般来说,外围设备有其它设备需要的数据,中心设备使用外围设备提供的数据

iOS开发系列--IOS程序开发概览ios基础

iOS开发系列--IOS程序开发概览 2014-08-04 19:42 by KenshinCui, 72273 阅读, 81 评论, 收藏,  编辑 概览 终于到了真正接触IOS应用程序的时刻了,之前我们花了很多时间去讨论C语言.ObjC等知识,对于很多朋友而言开发IOS第一天就想直接看到成果,看到可以运行的IOS程序.但是这里我想强调一下,前面的知识是你日后开发IOS的基础,没有那些知识你开发IOS会很痛苦,现在很多开发人员做开发都是一知半解,程序质量确实令人担忧,所以还是希望大家能够熟练掌

ios是什么?ios有什么特点?

我们都知道现在手机系统以iOS和Android为主.但是仍然有许多人并不十分清楚iOS是什么?现在就来给大家说说iOS是什么意思? iOS是由苹果公司为iPhone开发的操作体系.它主要是给iPhone.iPod touch以及iPad运用.就像其根据的Mac OS X操作体系相同,它也是以Darwin为根底的.本来这个体系名为iPhone OS,直到2010年6月7日WWDC大会上宣布改名为iOS.iOS的体系架构分为四个层次:中心操作体系层(the Core OS layer),中心效劳层(

iOS 9.3 到 iOS 10.0 的开发API不同点

iOS 9.3 to iOS 10.0 API Differences Objective-C /usr/include Accelerate AudioToolbox AudioUnit AVFoundation AVKit CallKit (Added) CFNetwork CloudKit Contacts CoreBluetooth CoreData CoreFoundation CoreGraphics CoreImage CoreLocation CoreMedia CoreMoti

【译】iOS人性化界面指南(iOS Human Interface Guidelines)(一)

1. 引言1.1 译者自述 我是一个表达能力一般的开发员,不管是书面表达,还是语言表达.在很早以前其实就有通过写博客锻炼这方面能力的想法,但水平有限实在没有什么拿得出手的东西分享.自2015年7月以来因工作及个人的兴趣开始逐步转向iOS开发,在这期间系统的学习了下斯坦福桥大学Paul老爷子关于iOS7,iOS8的视频公开课及苹果官方的开发文档.当然也包括这篇<iOS Human Interface Guildlines> ,半年的学习下来碰到最大的问题就是遗忘,很多知识点学过没多久就忘记了,必