《UI设计尺寸规范UI设计规范.docx》由会员分享,可在线阅读,更多相关《UI设计尺寸规范UI设计规范.docx(12页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、UI设计尺寸规范UI设计规范 U I设计尺寸规范U I设 计规范 GE GROUP system office room 【GEIHUA16H-GEIHUA GEIHUA8Q8- iPhone界面尺寸 设备分辨率PPI 状态栏高度导航栏高度标签栏高度 iPhone6P、6SP、7P 12422208 px 401PPI 60px 132px 146px iPhone6 - 6S - 7 7501334 px 326PPI 40px 88px 98px iPhone5 - 5C - 5S 6401136 px 326PPI 40px 88px 98px iPhone4 - 4S 640960 p
2、x 326PPI 40px 88px 98px iPhone & iPod Touch 第一代、第二代、第三代 320480 px 163PPI 20px 44px 49px UI设计规范:IOS、Android系统主流尺寸整理 iPhone图标尺寸: 设备App Store 程序应用主屏幕Spotlight搜索标签栏工具栏和导航栏 iPhone6P - 6SP - 7(3)10241024 px 180180 px 114114 px 8787 px 7575 px 6666 px iPhone6 - 6S - 7 (2)10241024 px 120120 px 114114 px 585
3、8 px 7575 px 4444 px iPhone5 - 5C - 5S (2)10241024 px 120120 px 114114 px 5858 px 7575 px 4444 px iPhone4 - 4S (2)10241024 px 120120 px 114114 px 5858 px 7575 px 4444 px iPhone & iPod Touch第一代、第 二代、第三代10241024 px 120120 px 5757 px 2929 px 3838 px 3030 px iPad的设计尺寸 设备尺寸分辨率状态栏高度导航栏高度标签栏高度 iPad 3 - 4 -
4、 5 - 6 Air - Air2 - mini2 20481536 px 264PPI 40px 88px 98px iPad 1 - 2 1024768 px 132PPI 20px 44px 49px iPad Mini 1024768 px 163PPI 20px 44px 49px iPad图标尺寸: 设备App Store 程序应用主屏幕Spotlight搜索标签栏 工具栏 导航栏 iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2 10241024 px 180180 px 144144 px 100100 px 5050 px 4444 px iPa
5、d 1 - 2 10241024 px 9090 px 7272 px 5050 px 2525 px 2222 px iPad Mini 10241024 px 9090 px 7272 px 5050 px 2525 px 2222 px Android SDK模拟机的尺寸 屏幕大小低密度(120)中等密度(160)高密度(240)超高密度(320)小屏幕QVGA(240320)480640 普通屏幕WQVGA400 (240400) WQVGA432 (240432) HVGA(320480) WVGA800(480800) WVGA854(480854) 6001024 640960
6、大屏幕WVGA800 * (480800) WVGA854 * (480854) WVGA800 *(480800) WVGA854 *(480854) 600x1024 超大屏幕1024600 1024768 1280768WXGA (1280800)15361152 19201152 19201200 20481536 25601600 Android的图标尺寸 屏幕大小启动图标操作栏图标上下文图标系统通知图标 (白色) 最细笔画 320480 px 4848 px 3232 px 1616 px 2424 px 不小于2 px 480800px 480854px 540960px 727
7、2 px 4848 px 2424 px 3636 px 不小于3 px 7201280 px 4848 dp 3232 dp 1616 dp 2424 dp 不小于2 dp 10801920 px 144144 px 9696 px 4848 px 7272 px 不小于6 px Android安卓系统dp/sp/px换算表 名称分辨率 比率 rate (针对320px) 比率 rate (针对640px) 比率 rate (针对750px) idpi 240320 0.75 0.375 0.32 mdpi 320480 1 0.5 0.4267 hdpi 480800 1.5 0.75 0
8、.64 xhdpi 7201280 2.25 1.125 1.042 xxhdpi 10801920 3.375 1.6875 1.5 主流Android手机分辨率和尺寸 设备分辨率尺寸设备分辨率尺寸 魅族MX2 4.4英寸8001280 px 魅族MX3 5.1英寸 10801280 px 魅族MX4 5.36英 寸 11521920 px 魅族MX4 Pro未上市 5.5英寸 15362560 px 5.7英寸14402560 px 5.7英寸 10801920 px 三星GALAXY Note 4 三星GALAXY Note 3 三星GALAXY S5 5.1英寸10801920 px
9、三星GALAXY Note II 5.5英寸7201280 px 索尼Xperia Z3 5.2英寸10801920 px 索尼XL39h 6.44英寸 10801920 px HTC Desire 820 5.5英寸7201280 px HTC One M8 4.7英寸 10801920 px OPPO Find 7 5.5英寸14402560 px OPPO N1 5.9英寸 10801920 px OPPO R3 5英寸7201280 px OPPO N1 Mini 5英寸7201280 px 小米M4 5英寸10801920 px 小米红米Note 5.5英寸7201280 px 小米
10、M3 5英寸10801920 px 小米红米1S 4.7英寸7201280 px 小米M3S 5英寸10801920 px 小米M2S 4.3英寸7201280 px 华为荣耀6 5英寸10801920 px 锤子T1 4.95英寸 10801920 px LG G3 5.5英寸14402560 px OnePlus One 5.5英寸 10801920 px 主流浏览器的界面参数与份额 浏览器状态栏菜单栏滚动条 市场份额(国内浮动) Chrome 浏览器 22 px(浮动出现)60 px 15 px 42.1% 火狐浏览器 20 px 132 px 15 px 1% IE浏览器 24 px 120 px 15 px 34% 360 浏览器 24 px 140 px 15 px 28% 遨游浏览器 24 px 147 px 15 px 1% 搜狗浏览器 25 px 163 px 15 px 3.8% 系统分辨率统计 分辨率占有率分辨率占有率 19201080 13.8% 1366768 10.2% 360640 7.9% 1440900 7.7%