做了一段UI設計,遇到了一些關於螢幕適配問題,自己通過尋找和個人理解做了一些總結(有問的)
iOS介面尺寸
裝置 |
解析度 |
狀態列高度 |
導覽列高度 |
標籤欄高度 |
iPhone6 plus/iPhone6s plus |
1242×2208 px (5.5 英寸) |
60px |
132px |
147px |
iPhone6、iPhone6s |
750×1334 px(4.7英寸) |
40px |
88px |
98px |
iPhone5/5s/5c |
640×1136 px |
40px |
88px |
98px |
iPhone4/4s |
640×960 px |
40px |
88px |
98px |
iPad3/4/Air/Air2/mini2 |
2048×1536 px |
40px |
88px |
98px |
iPad1/2 |
1024×768 px |
20px |
44px |
49px |
iPad mini |
1024×768 px |
20px |
44px |
49px |
表徵圖尺寸
裝置 |
App Store |
程式應用 |
主畫面 |
spotlight搜尋 |
標籤欄 |
工具列和導覽列 |
iPhone6/ 6s plus |
1024*1024px |
180*180px |
144*144px |
87*87 px |
75*75px |
66*66px |
iPhone6/6s |
1024*1024px |
120*120px |
144*144px |
58*58px |
75*75px |
44*44px |
iPhone5/5s/5c |
1024*1024px |
120*120px |
144*144px |
58*58px |
75*75px |
44*44px |
iPhone4/4s |
1024*1024px |
120*120px |
144*144px |
58*58px |
75*75px |
44*44px |
iPad3/4/Air/Air2/mini2 |
1024*1024px |
180*180px |
144*144px |
100*100px |
50*50px |
44*44px |
iPad1/2 |
1024*1024px |
90*90px |
72*72px |
50*50px |
25*25px |
22*22px |
iPad mini |
1024*1024px |
90*90px |
72*72px |
50*50px |
25*25px |
22*22px |
iPhone6Plus的@3x,iPhone6的@2x, iPhone5的@2x的介紹 1、iPhone6Plus是5.5英寸螢幕,1242x2208px-@3x的像素解析度,邏輯解析度是414x736pt-@1x。物理尺寸是1080x1920px。這個物理尺寸,也是安卓機目前最流行的大屏設計稿尺寸。
2、iPhone6是4.7英寸螢幕,750x1334px-@2x的像素解析度,邏輯解析度是375x667pt-@1x。
3、iPhone5是4英寸螢幕,640x1135px-@2x的像素解析度,邏輯解析度是320x568pt-@1x。 內部設計
1、所有能點擊的圖片不得小於44px(Retina需要88px)
2、單獨存在的組件必須是雙數尺寸
3、兩倍圖以@2x作為命名尾碼