iphone,ipad,android圖檔尺寸

①iPhone的設計尺寸

iPhone界面尺寸：

裝置	分辨率	狀态欄高度	導航欄高度	标簽欄(工具欄)高度
iPhone6 plus設計版	1242 × 2208	60px	132px	146px
iOS APP設計一稿支援iPhone5/iPhone6/Plus設計流程
一套完整的UI設計規範手冊（IOS版）
移動端界面設計之尺寸篇（淘寶版）
圖說: iPhone 6 (plus) 沒那麼容易搞定
iPhone6 plus實體版	1080 × 1920	54px	132px	146px
iOS APP設計一稿支援iPhone5/iPhone6/Plus設計流程
一套完整的UI設計規範手冊（IOS版）
移動端界面設計之尺寸篇（淘寶版）
圖說: iPhone 6 (plus) 沒那麼容易搞定
iPhone6	750 × 1334	40px	88px	98px(88px)
iPhone5s	640 × 1136	40px	88px	98px(88px)
iPhone5c	640 × 1136	40px	88px	98px(88px)
iPhone5	640 × 1136	40px	88px	98px(88px)
iPhone4s	640 × 960	40px	88px	98px(88px)
iPhone4	640 × 960	40px	88px	98px(88px)

iPhone圖示尺寸：

系統	分辨率	圓角大小
iOS 6-	90px - 1024px	約為圖示寬度 × 0.175
iOS 7+	90px - 1024px	約為圖示寬度 × 0.225

Asset	iPhone 6 Plus (@3x)	iPhone 6 and iPhone 5 (@2x)	iPhone 4s (@2x)	iPad and iPad mini (@2x)	iPad 2 and iPad mini (@1x)
App icon (required for all apps)	180 × 180	120 × 120	120 × 120	152 × 152	76 × 76
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	80 × 80	80 × 80	80 × 80	40 × 40
Settings icon (recommended)	87 × 87	58 × 58	58 × 58	58 × 58	29 × 29
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	76 × 76

轉載請注明來源： http://www.ui001.com/chicun/

②iPad的設計尺寸

iPad界面尺寸：

裝置	分辨率	狀态欄高度	導航欄高度	标簽欄高度
iPad6/iPad Air2	2048 × 1536	40px	88px	98px
iPad5/iPad Air/ipad mini 2	2048 × 1536	40px	88px	98px
iPad4/ipad mini	2048 × 1536	40px	88px	98px
iPad3/the new iPad	2048 × 1536	40px	88px	98px
iPad2	1024 × 768	20px	44px	49px
iPad1	1024 × 768	20px	44px	49px
iPad Mini	1024 × 768	20px	44px	49px

iPad圖示尺寸：

系統	分辨率	圓角大小
iOS 6-	90px - 1024px	約為圖示寬度 × 0.175
iOS 7+	90px - 1024px	約為圖示寬度 × 0.225

Asset	iPhone 6 Plus (@3x)	iPhone 6 and iPhone 5 (@2x)	iPhone 4s (@2x)	iPad and iPad mini (@2x)	iPad 2 and iPad mini (@1x)
App icon (required for all apps)	180 × 180	120 × 120	120 × 120	152 × 152	76 × 76
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	80 × 80	80 × 80	80 × 80	40 × 40
Settings icon (recommended)	87 × 87	58 × 58	58 × 58	58 × 58	29 × 29
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	76 × 76

轉載請注明來源： http://www.ui001.com/chicun/

③Android的設計尺寸

螢幕尺寸

指實際的實體尺寸，為螢幕對角線的測量。

為了簡單起見，Android把實際螢幕尺寸分為四個廣義的大小：小，正常，大，特大。

像素（PX）

代表螢幕上一個實體的像素點代表螢幕上一個實體的像素點。

螢幕密度

為解決Android裝置碎片化，引入一個概念DP，也就是密度。指在一定尺寸的實體螢幕上顯示像素的數量，通常指分辨率。 為了簡單起見，Android把螢幕密度分為了四個廣義的大小：低（120dpi）、中（160dpi）、高（240dpi）和超高（320dpi） 像素= DP * （ DPI / 160 ) 例如，在一個240dpi的螢幕裡，1DP等于1.5PX。

于設計來說，選取一個合适的尺寸作為正常大小和中等螢幕密度（尺寸的選取依據打算适配的硬體，建議參考現主流硬體分辨率），然後向下和向上 做小、大、特大和低、高、超高的尺寸與密度。

典型的設計尺寸

• 320dp：一個普通的手機螢幕（240X320，320×480，480X800）

• 480dp：一個中間平闆電腦像（480×800）

• 600dp：7寸平闆電腦（600x1024）

• 720dp：10寸平闆電腦（720x1280，800x1280）

相關閱讀

一套完整的UI設計規範手冊（Android版） 移動端界面設計之尺寸篇（淘寶版）

Android安卓系統dp/sp/px換算表

名稱	分辨率	比率 rate (針對320px)	比率 rate (針對640px)	比率 rate (針對750px)
idpi	240 × 320	0.75	0.375	0.32
mdpi	320 × 480	1	0.5	0.4267
hdpi	480 × 800	1.5	0.75	0.64
xhdpi	720 × 1280	2.25	1.125	1.042
xxhdpi	1080 × 1920	3.375	1.6875	1.5

主流Android手機分辨率和尺寸

裝置	分辨率	尺寸	裝置	分辨率	尺寸
三星Galaxy S3	4.8英寸	720 × 1280	三星Galaxy S4	5英寸	1080 × 1920
三星Galaxy S5	5.1英寸	1080 × 1920	三星Galaxy S6	4.5英寸	1200 × 1920
小米1	4英寸	480 × 854	小米1s	4英寸	480 × 854
小米2	4.3英寸	720 × 1280	小米2s	4.3英寸	720 × 1280
小米3	5英寸	1080 × 1920	小米3s(概念)	5英寸	1080 × 1920
小米4	5英寸	1080 × 1920	紅米	4.7英寸	720 × 1280
紅米Note	5.5英寸	720 × 1280
OPPO Find 7	5.5英寸	1440 × 2560	OPPO Find 7 輕裝版	5.5英寸	1080 × 1920
OPPO N1 mini	5英寸	720 × 1280	OPPO R3	5英寸	720 × 1280
OPPO R1S	5英寸	720 × 1280
錘子 Smartisan T1	4.95英寸	1080 × 1920
華為 Ascend P7	5英寸	1080 × 1920	華為 Ascend Mate7	6英寸	1080 × 1920
華為 榮耀6	5英寸	1080 × 1920	華為 Ascend Mate2	6.1英寸	720 × 1280
華為 C199	5.5英寸	720 × 1280
HTC One (M8)	5英寸	1080 × 1920	HTC Desire 820	5.5英寸	720 × 1280
魅族 MEIZU MX4	5.36英寸	1152 × 1920	魅族 MEIZU MX3	5.1英寸	1080 × 1800

轉載請注明來源： http://www.ui001.com/chicun/

④Web的設計尺寸

Windows XP工作列的高度30px  Windows 7工作列的高度40px

主流浏覽器的界面參數

浏覽器	狀态欄	菜單欄	滾動條
Chrome浏覽器	22px（浮動出現）	60px	15px
火狐浏覽器	狀态欄高度	導航欄高度	标簽欄高度
IE浏覽器	狀态欄高度	導航欄高度	标簽欄高度
360浏覽器	狀态欄高度	導航欄高度	标簽欄高度

系統分辨率統計

安全分辨率為1024 × 768 px  可建議大分辨率為1280 × 800 px

綜合分辨率及浏覽器下的統計資料

網頁寬度與首屏高度

安全寬度1002 px  可建議較大寬度1258 px

Window XP首屏大小580 px  Window 7 首屏大小710 px

轉載請注明來源： http://www.ui001.com/chicun/