图标尺寸 IOS7推出后,图标尺寸规范略有调整,为了得到更加精准的显示效果,大家可以参考参考下。 下表列出了图标的标准尺寸,按照此规范zuo作图,可以使图标能在搭载IOS7的多种设备中正确显示显示。 (单位:px)
描述 iPhone 5和iPod touch的尺寸(高清晰度) 大小为iPhone和iPod touch(高分辨率) iPad的尺寸为(高清晰度) 大小为iPad 2和iPad迷你(标准分辨率)
应用程序图标(应用程序所需的所有) 120×120 120×120 152×152 76×76
为App Store(应用程序所需的所有应用程序图标) 1024×1024 1024×1024 1024×1024 1024×1024
启动影像(所有的应用程序所需的) 640×1136 640×960 1536×2048(纵向) 2048×1536(横向) 768×1024(纵向) 1024×768(横向)
Spotlight搜索结果图标(推荐) 80×80 80×80 80×80 40×40
设置图标(推荐) 58×58 58×58 58×58 29×29
工具栏和导航栏图标(可选) 约44×44 约44×44 约44×44 约22×22
标签栏图标(可选) 约60×60(最大:96×64) 约60×60(最大:96×64) 约60×60(最大:96×64) 约30×30(最大:48×32)
默认报刊亭盖为App Store图标(书报亭应用程序所需) 至少为1024像素的最长边 至少为1024像素的最长边 至少为1024像素的最长边 至少为1024像素的最长边
网页剪辑图标(推荐的Web应用程序和网站) 120×120 120×120 144×144 72×72
所有图像和图标建议使用png格式,避免使用隔行扫描的PNG图像。 配色方面不需要限制web安全色调色板。 图标设计线条画,而激活图标则增加填充,未激活状态的线条消失或者反白。如下图:
欢迎大家关注我的微博@Gaoyoungor,与你分享更多关于设计。
字体字号 Helvetica Neue仍旧是iOS的默认字体,但普通文本通常是以细体字展示,而不是常规或粗体。需要突出强调的文本通常用的是中粗字体(例如,导航栏标题)。 默认字体大小
标题类型 默认字体大小 默认字体类型
UI布局 ·表单
·导航栏
竖屏模式
横屏模式导航栏缩短
IOS7 UI Transition Guide 笔记 1. 桌面启动应用程序图标更新到iphone:120X120px, ipad:152x152px;
2. 启动画面要添加回status bar(顶部zhuang状态栏);
3. view controller 用full-screen layout;
4. 重新设计bar button 图标(线条化);
5. 按钮要使用无边化(多为文字直接作为按钮);
6. 使用相对布局,auto layout,尽量不要写死坐标和大小(是否预示着大屏iphone的到来?);
7. 用户可自定义字号;
8. 注意底部手势的使用,IOS7将优先响应系统的控制面板(从底部上滑手势,唤出系统控制面板,软件内部谨慎使用);
9.尽量去特效化去拟物化,保持界面元素平滑和层次感(这就是简约设计的难点了);
10. 在application:didFinishLaunchingWithOptions:里判断版本 6 or 7 来载入相关资源(IOS6可以和IOS7呈现不同的UI效果);
11. 状态烂透明,其它bar都是半透明的;UIBarPositionTopAttached代表bar背景延伸到status bar,总高128px(导航栏高度高度加状态栏), UIBarPositionTop代表不延伸;
12. Navigation Bar 默认是半透明,底部有1像素的hairline;tintColor去定义barbutton,用barTintColor去定义bar 背景。如果要用自定义的返回按钮,需要做一个MASK图像作为切换过渡用。 NaviBar的下部阴影要用自定义图像和shadowImage来定义,不要用过长的带阴影部分的图像来做阴影,因为在IOS7上,多出的像素会首先放到statusbar;
13. Toolbar ,tintColor定义item,barTintColor定义背景,在top边有一条1像素hairline,UIToolbarPosition已经弃用了,用UIBarPosition代替;
14. barbuttons,使用图像有2种方式UIImageRenderingModeAlwaysTemplate(默认使用),UIImageRenderingModeAlwaysOriginal(使用它来设定不是用tinting)(这表明导航栏里面的按钮时可以用图片的,只是比较纠结);
15. activity view controller里的图标要用黑白和透明度表示,抗锯齿处理,不要用dropshadow。图标大小是70x70px,居中;
16. Ios7 的ImageView包含tintColor特性,在UIImageRenderingModeAlwaysTemplate模式下,tintColor会应用到该图片上;
17.slider在ios7里面可以用minimumTrackTintColor,maximumTrackTintColor, andthumbTintColor分别设定最小值颜色,最大值颜色,和触摸时颜色。如果设定成nil,就使用默认;
18. 切换按钮在ios7里面动感十足,可以用onTintColor, tintColor, andthumbTintColor设置开关和触摸样式;
19. Alert弹出框在ios7里面强制使用默认样式,如果你需要第三个按钮,将在默认2个按钮的上方显示
|