403 Forbidden
403 Forbidden细节是魔鬼，设计在于细节
Product was successfully added to your cart
&& 读。设计
IOS和安卓ui设计常用尺寸及基本知识
图标的圆角半径是多少？
（注：现在IOS图标是不需要再画圆角了，直接方形就OK）
括弧里面是对应的半径大小
App store(Retina屏) ─────────────1024px（160px）
iTunes Artwork
─────────────512px (90px)
App (iPhone4s) ──────────────────114px (20px)
App (iPhone5s) ──────────────────120px(22px)
App icon(iPad) ────────────────────72px (12px)
App icon(iPhone 3G/3GS) ───────────────57px(10px)
Spotlight/Settings icon icon(iPhone4) ──────────58px (10px)
Spotlight/Settings icon icon(iPhone 3G/3GS/iPad) ──── 29px (9px)
iPhone、iPad、Android 常用尺寸
—————————————————————–
APPLE APP STORE ICON:512 x 512 PX
(圆角弧度80px)
iPhone 5 App Icon：120 x 120 PX
(圆角弧度22px)
iPhone 4 App Icon：114 x 114 PX
(圆角弧度20px)
iPhone 3GS App Icon：57 x 57 PX
(圆角弧度22px)
iPhone 5 326ppi 4英寸PX
iPhone 4 App ：960 x 640PX （时,高度还需要减去状态栏40PX）
iPhone 3GS App ：480x 320PX
iPhone的尺寸()
iPhone界面尺寸：
状态栏高度
导航栏高度
标签栏(工具栏)高度
iPhone6 plus设计版
1242 × 2208
iOS APP设计一稿支持iPhone5/iPhone6/Plus设计流程
iPhone6 plus物理版
1080 × 1920
iOS APP设计一稿支持iPhone5/iPhone6/Plus设计流程
750 × 1334
98px(88px)
640 × 1136
98px(88px)
640 × 1136
98px(88px)
640 × 1136
98px(88px)
640 × 960
98px(88px)
640 × 960
98px(88px)
iPhone图标尺寸：
约为图标宽度 × 0.175
约为图标宽度 × 0.225
iPhone 6 Plus (@3x)
iPhone 6 and iPhone 5 (@2x)
iPhone 4s (@2x)
iPad and iPad mini (@2x)
iPad 2 and iPad mini (@1x)
(required for all s)
180 × 180
120 × 120
120 × 120
152 × 152
App icon for the App Store
(required for all s)
1024 × 1024
1024 × 1024
1024 × 1024
1024 × 1024
1024 × 1024
Launch file or image
(required for all apps)
Use a launch file
(see Launch Images)
For iPhone 6, use a launch file
(see Launch Images)
For iPhone 5, 640 × 1136
640 × 960
1536 × 2048 (portrait)
2048 × 1536 (landscape)
768 × 1024 (portrait)
1024 × 768 (landscape)
Spotlight search results icon
(recommended)
120 × 120
Settings icon
(recommended)
Toolbar and navigation bar icon
(optional)
About 66 × 66
About 44 × 44
About 44 × 44
About 44 × 44
About 22 × 22
Tab bar icon
(optional)
About 75 × 75
(maximum: 144 × 96)
About 50 × 50
(maximum: 96 × 64)
About 50 × 50
(maximum: 96 × 64)
About 50 × 50
(maximum: 96 × 64)
About 25 × 25
(maximum: 48 × 32)
Default Newsstand cover icon for the App Store
(required for Newsstand apps)
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 512 pixels on the longest edge
Web clip icon
(recommended for web apps and websites)
180 × 180
120 × 120
120 × 120
152 × 152
iPad的设计尺寸
iPad界面尺寸：
状态栏高度
导航栏高度
标签栏高度
iPad6/iPad Air2
2048 × 1536
iPad5/iPad Air/ipad mini 2
2048 × 1536
iPad4/ipad mini
2048 × 1536
iPad3/the new iPad
2048 × 1536
1024 × 768
1024 × 768
1024 × 768
iPad图标尺寸：
约为图标宽度 × 0.175
约为图标宽度 × 0.225
iPhone 6 Plus (@3x)
iPhone 6 and iPhone 5 (@2x)
iPhone 4s (@2x)
iPad and iPad mini (@2x)
iPad 2 and iPad mini (@1x)
(required for all apps)
180 × 180
120 × 120
120 × 120
152 × 152
App icon for the App Store
(required for all apps)
1024 × 1024
1024 × 1024
1024 × 1024
1024 × 1024
1024 × 1024
Launch file or image
(required for all apps)
Use a launch file
(see Launch Images)
For iPhone 6, use a launch file
(see Launch Images)
For iPhone 5, 640 × 1136
640 × 960
1536 × 2048 (portrait)
2048 × 1536 (landscape)
768 × 1024 (portrait)
1024 × 768 (landscape)
Spotlight search results icon
(recommended)
120 × 120
Settings icon
(recommended)
Toolbar and navigation bar icon
(optional)
About 66 × 66
About 44 × 44
About 44 × 44
About 44 × 44
About 22 × 22
Tab bar icon
(optional)
About 75 × 75
(maximum: 144 × 96)
About 50 × 50
(maximum: 96 × 64)
About 50 × 50
(maximum: 96 × 64)
About 50 × 50
(maximum: 96 × 64)
About 25 × 25
(maximum: 48 × 32)
Default Newsstand cover icon for the App Store
(required for Newsstand apps)
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 1024 pixels on the longest edge
At least 512 pixels on the longest edge
Web clip icon
(recommended for web apps and websites)
180 × 180
120 × 120
120 × 120
152 × 152
Android的设计尺寸：
指实际的物理尺寸，为屏幕对角线的测量。
为了简单起见，Android把实际屏幕尺寸分为四个广义的大小：小，正常，大，特大。
像素（PX）
代表屏幕上一个物理的像素点代表屏幕上一个物理的像素点。
为解决Android设备碎片化，引入一个概念DP，也就是密度。指在一定尺寸的物理屏幕上显示像素的数量，通常指分辨率。 为了简单起见，Android把屏幕密度分为了四个广义的大小：低（120dpi）、中（160dpi）、高（240dpi）和超高（320dpi） 像素= DP * （ DPI / 160 ) 例如，在一个240dpi的屏幕里，1DP等于1.5PX。
于设计来说，选取一个合适的尺寸作为正常大小和中等屏幕密度（尺寸的选取依据打算适配的硬件，建议参考现主流硬件分辨率），然后向下和向上 做小、大、特大和低、高、超高的尺寸与密度。
典型的设计尺寸
o 320dp：一个普通的屏幕（240X320，320×480，480X800）
o 480dp：一个中间平板电脑像（480×800）
o 600dp：7寸平板电脑（600×1024）
o 720dp：10寸平板电脑（720××1280）
对于分辨率繁多的android设备，为了方便原生应用的界面适配，Google按照dpi大小将它们分成了4中模式（MDPI、HDPI、XHDPI和XXHDPI，现在 Android 4.3 已经有了XXXHDPI）：
屏幕DIP类型:
ICON尺寸：
随便说一下现在安卓设计稿尺寸设定：
一般PS新建 1080 x 1920的尺寸，也就是对应该安卓的xxhdpi ,所以切图也是放入程序中的xxhdpi文件夹 下。所以基本上一套图就可以了，如果时间充足，做多套尺寸的图自然没什么坏处。虽然只出大尺寸的图，但设计时一定好考虑好小屏幕适配问题，还要对部分切图进行调整重切，因为有些图等比缩小时会出现糊，或不好看的现象。
安卓的点九图 点9切法 查看这篇文章：
Android安卓系统dp/sp/px换算表
比率 rate (针对320px)
比率 rate (针对640px)
比率 rate (针对750px)
240 × 320
320 × 480
480 × 800
720 × 1280
1080 × 1920
主流Android分辨率和尺寸
三星Galaxy S3
720 × 1280
三星Galaxy S4
1080 × 1920
三星Galaxy S5
1080 × 1920
三星Galaxy S6
1200 × 1920
480 × 854
480 × 854
720 × 1280
720 × 1280
1080 × 1920
小米3s(概念)
1080 × 1920
1080 × 1920
720 × 1280
720 × 1280
OPPO Find 7
1440 × 2560
OPPO Find 7 轻装版
1080 × 1920
OPPO N1 mini
720 × 1280
720 × 1280
720 × 1280
锤子 Smartisan T1
1080 × 1920
华为 Ascend P7
1080 × 1920
华为 Ascend Mate7
1080 × 1920
华为 荣耀6
1080 × 1920
华为 Ascend Mate2
720 × 1280
720 × 1280
HTC One (M8)
1080 × 1920
HTC Desire 820
720 × 1280
魅族 MEIZU MX4
1152 × 1920
魅族 MEIZU MX3
1080 × 1800
相关文章：
打开微信“扫一扫”，将本文章分享到朋友圈
闽ICP备号-1
(C) 2014 蓝色早晨声明：本站所述言论、本章、截图均来自网络或仅代表个人观点，版权归原作者所有，在此只是加以分享。如有冒犯，请来信说明。如题，会不会同一款软件出现多套不同的适应方案？空间布局会不会因屏幕尺寸的不同而不同？等等的相关疑问。。。=================================希望还可以有一个人再开个问题是
iOS的APP在系统中如何适应iPhone 5s/6/6 Plus三种屏幕的尺寸？
从iPhone 6 开始 iOS 的 UI 设计方式更像 web 而不是 app，不同尺寸的 iPhone 上 UI 的结构是一样的，各 UIView 的位置尺寸会有所不同。比如同样的一段文本，iPhone 5S 上要显示5行， iPhone 6 Plus 上可能只要三行，显示它们的 UITextView 的尺寸就会不同。苹果从 iOS 6 开始提供了 Auto Layout ，（），他的作用类似 web 中的 CSS，可以用排版语言对 UIView 进行布局，我们只要表达出 UIView 应该靠左、靠右、居中、边距多少等信息，Auto Layout 根据设备尺寸自动计算各 UIView 的 frame。以前 UI 设计喜欢用绝对定位，因为 iPhone 6 之前所有 iPhone 的宽度都是 320 points（注意，不是 pixels），从 iPhone 6 开始将有不同的尺寸（所以叫 Resizeable iPhone），如果用绝对定位就需要针对每种设备做调整，设计师会骂娘的。还有就是 app 的 Launch Image，因为设备尺寸增多，再结合横屏竖屏，导致的结果是一个 app 要有 n 多个 Launch Image，iOS 8 开始提供了 Launch Screen 的概念，现在可以用一个 xib 文件来作为 Launch Screen，然后用 Interface Builder 对 Launch Screen 进行设计，因为可以使用 Auto Layout，所以我们只需要一个 xib 文件都可以应对所有尺寸的 iPhone。以前一直觉得 iOS 的 UI 开发不如 Android，通过手工计算 frame 位置来布局简直是石器时代的做法，现在 iPhone 虽然尺寸变多了，不过因为有了成熟的 Auto Layout， UI 的设计和开发变的反而比以前更容易。
在 iPhone 6/plus 发布之后是否要为单手操作优化可能将会是一个挺大的麻烦。&br&&br&首先来看个 Apple 为 iPhone 5 拍的一个广告吧：&br&&a class=&video-box& href=&///?target=http%3A///v_show/id_XNzg1ODAxNjc2.html& target=&_blank&&
&img class=&thumbnail& src=&/41B730DE33A02EE2F6EF33C6B79-79AA-0106-C8AE-69F2E3350550&&&span class=&content&&
&span class=&title&&iPhone 5 - TV Ad - Thumb - Commercial (720p)&span class=&z-ico-extern-gray&&&/span&&span class=&z-ico-extern-blue&&&/span&&/span&
&span class=&url&&&span class=&z-ico-video&&&/span&/v_show/id_XNzg1ODAxNjc2.html&/span&
&/a&&br&上面的视频拍摄背景是西方人，亚洲人的手则没有那么大，女性更小。大部分应用在 iPhone 5/5s 发布之后针对拉长脸的 iPhone 所做的也只是「适配」而已，并未对增大的高度做任何事情。根据 &a href=&///?target=http%3A///mt/archives/2013/02/how-do-users-really-hold-mobile-devices.php& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&UXmatters&i class=&icon-external&&&/i&&/a& 2013 年的数据，有大约 49% 的人使用单手握持。右手单手握持有下面两种方式：即设备右下角抵在手心和靠下一点点。&br&&br&&img src=&/05a2bbe9baccb_b.jpg& data-rawwidth=&474& data-rawheight=&314& class=&origin_image zh-lightbox-thumb& width=&474& data-original=&/05a2bbe9baccb_r.jpg&&&br&&br&在 iPhone 5/5s 时代，我所了解到针对这多出来的高度做了一些事情的 App 是 Instagram，见下图。&br&&br&&img src=&/6a0f7be7b97a2aaacc80c4a68bbb87d9_b.jpg& data-rawwidth=&665& data-rawheight=&579& class=&origin_image zh-lightbox-thumb& width=&665& data-original=&/6a0f7be7b97a2aaacc80c4a68bbb87d9_r.jpg&&&img src=&/bc912f0bbc5b511ccd535c_b.jpg& data-rawwidth=&667& data-rawheight=&496& class=&origin_image zh-lightbox-thumb& width=&667& data-original=&/bc912f0bbc5b511ccd535c_r.jpg&&&br&这是 Instagram 在 iPhone 4/4s（下） 和 iPhone 5/5s（上） 的不同截图，宽度不变只拉长脸的 iPhone 对 Instagram 带来的影响有两点：&br&&ul&&li&因为照片是方形的，宽度不变长度增加会使得留白的面积变大&br&&/li&&li&长度增加顶部按钮的点击会变得困难&br&&/li&&/ul&因此 Instagram 为此做了两套布局，在 iPhone 4/4s 所有的自定义操作置于顶部，在 iPhone 5/5s 上操作按钮置于底部，同时将按钮间距和留白增大。&br&&br&时间来到 2014 年，手持设备的方式发生了变化，单手握持手机的比例变小了，而且是变的非常小。这个原因可能是大屏幕的手机越来越多，诸多应用并未对单手做优化，同时一只手在安全握持手机的同时拇指已经没有太大的活动空间，因此人们自己寻找到了一些方式来使用自己的设备。&br&&br&&img src=&/ca3ca0a990406bdfbe6bc4c3eeaf5ca9_b.jpg& data-rawwidth=&461& data-rawheight=&498& class=&origin_image zh-lightbox-thumb& width=&461& data-original=&/ca3ca0a990406bdfbe6bc4c3eeaf5ca9_r.jpg&&&br&当然这不代表就可以不考虑单手握持的用户了，还是得看自己的应用类型和使用场景。比如 A 是一个阅读类应用，应用活跃时间都是早晚高峰时间；B 应用是一个移动社区应用，应用活跃时间是晚上 10 点左右，那听起来 A 应用或许需要考虑一下单手握持的情况，而 B 应用就没有那么大的单手握持需求了。&br&&br&下图是 Scott Hurff 绘制的在上面 A 类握持方式下的操作示意图。需要注意的是如果你的应用主要用户是亚洲人，那个图可能需要修改，比如红色区域可能会更大，尤其在 iPhone 6 plus 上。如果你的主要用户还是女性，那红色区域还会变得更大，绿色区域变的更小并且会更靠右一些，因此点击困难的问题不仅仅会出现在顶部的按钮中，在某些情况下居左的按钮在点击时也可能会遇到问题。&br&&img src=&/2ccb57ff7a2b774ed8d22_b.jpg& data-rawwidth=&1378& data-rawheight=&700& class=&origin_image zh-lightbox-thumb& width=&1378& data-original=&/2ccb57ff7a2b774ed8d22_r.jpg&&&br&&br&下面的图是在 B 类单手握持情况下的 iPhone 6 和 plus 的操作示意图。&br&&img src=&/82c730f044c0c0ee13916dd7bdd0bff4_b.jpg& data-rawwidth=&2226& data-rawheight=&2283& class=&origin_image zh-lightbox-thumb& width=&2226& data-original=&/82c730f044c0c0ee13916dd7bdd0bff4_r.jpg&&&br&&br&所以 iPhone 6 和 iPhone 6 plus 的上市可能会使得「要不要为单手握持做优化」成为一个问题。当然，可能的情况是大部分应用都不会为这个问题做任何事情，但是对于阅读、资讯等功能单一、沉浸感良好并且无需大量输入的应用还是可以为此做些事情的。&br&&br&居中底部的类 Path 的扇形菜单和长按滑动菜单可能会是一些不错的选择。
在 iPhone 6/plus 发布之后是否要为单手操作优化可能将会是一个挺大的麻烦。首先来看个 Apple 为 iPhone 5 拍的一个广告吧：上面的视频拍摄背景是西方人，亚洲人的手则没有那么大，女性更小。大部分应用在 iPhone 5/5s 发布之后针对拉长脸的 iPhone 所做的…
一定要做一个功能“滑动返回上一级界面”，不然大拇指要去左上角点返回会累死累抽筋
一定要做一个功能“滑动返回上一级界面”，不然大拇指要去左上角点返回会累死累抽筋
已有帐号？
无法登录？
社交帐号登录
爱好潜水、摄影和设计的程序员