Android /iPhone/iPad UI之常用图标尺寸规范

整合的相对比较全面了,如果不足可以指出在补充完整。

Android-App 常用图标尺寸规范

出自:http://www.cnblogs.com/libertycode/p/5666088.html

程序启动图标(Logo):

小屏ldpi() 36 x 36 px。

中屏mdpi(160dpi):48*48px

大屏hdpi(240dpi):72*72px

特大屏xhdpi(320dpi):96*96px

超大屏xxhdpi(480dpi):144*144px

 

底部菜单图标

中屏mdpi(160dpi):48*48px

大屏hdpi(240dpi):72*72px

特大屏xhdpi(320dpi):96*96px

超大屏xxhdpi(480dpi):144*144px

1. 大屏:
1. 完整图片(红色): 72 x 72 px
2. 图标(蓝色): 48 x 48 px
3. 图标外边框(粉色): 44 x 44 px

1. 中屏:
1. 完整图片: 48 x 48 px
2. 图标: 32 x 32 px
3. 图标外边框: 30 x 30 px

1. 小屏:
1. 完整图片: 36 x 36 px
2. 图标: 24 x 24 px
3. 图标外边框: 22 x 22 px

 

弹出对话框顶部图标

小屏 24 x 24 px Low density screen (ldpi)

中屏mdpi(160dpi):32*32px

大屏hdpi(240dpi):48*48px

特大屏xhdpi(320dpi):72*72px

超大屏xxhdpi(480dpi):89*89px

 

列表内部列表项图标

小屏 24 x 24 px Low density screen (ldpi)

中屏mdpi(160dpi):32*32px

大屏hdpi(240dpi):48*48px

特大屏xhdpi(320dpi):72*72px

超大屏xxhdpi(480dpi):89*89px

 

底部或顶部tab标签图标

小屏(ldpi) screens:
  完整图片: 24 x 24 px
  图标: 22 x 22 px

中屏mdpi(160dpi):

  完整图片: 32*32px

  图标:28*28px

大屏hdpi(240dpi):

  完整图片: 48*48px

  图标:42*42px

特大屏xhdpi(320dpi):

  完整图片: 72*72px

  图标:42*42px

超大屏xxhdpi(480dpi):

  完整图片: 32*32px

  图标:42*42px

 

底部状态栏图标

小屏ldpi (120 dpi) 18 x 18 px

中屏mdpi(160dpi):24*24px

大屏hdpi(240dpi):36*36px

特大屏xhdpi(320dpi):48*48px

超大屏xxhdpi(480dpi):60*60px


出自:http://tool.lanrentuku.com/guifan/ui.html

iPhone界面尺寸

设备 分辨率 PPI 状态栏高度 导航栏高度 标签栏高度
Android /iPhone/iPad UI之常用图标尺寸规范_第1张图片

iPhone6 plus设计版

1242×2208 px 401PPI 60px 132px 146px
Android /iPhone/iPad UI之常用图标尺寸规范_第2张图片

iPhone6 plus放大版

1125×2001 px 401PPI 54px 132px 146px
Android /iPhone/iPad UI之常用图标尺寸规范_第3张图片

iPhone6 plus物理版

1080×1920 px 401PPI 54px 132px 146px
Android /iPhone/iPad UI之常用图标尺寸规范_第4张图片

iPhone6

750×1334 px 326PPI 40px 88px 98px
Android /iPhone/iPad UI之常用图标尺寸规范_第5张图片

iPhone5 - 5C - 5S

640×1136 px 326PPI 40px 88px 98px
Android /iPhone/iPad UI之常用图标尺寸规范_第6张图片

iPhone4 - 4S

640×960 px 326PPI 40px 88px 98px
Android /iPhone/iPad UI之常用图标尺寸规范_第7张图片

iPhone & iPod Touch第一代、第二代、第三代

320×480 px 163PPI 20px 44px 49px
Android /iPhone/iPad UI之常用图标尺寸规范_第8张图片

iPhone图标尺寸:

设备 App Store 程序应用 主屏幕 Spotlight搜索 标签栏 工具栏和导航栏
Android /iPhone/iPad UI之常用图标尺寸规范_第9张图片

iPhone6 Plus (@3×)

1024×1024 px 180×180 px 114×114 px 87×87 px 75×75 px 66×66 px
Android /iPhone/iPad UI之常用图标尺寸规范_第10张图片

iPhone6 (@2×)

1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
Android /iPhone/iPad UI之常用图标尺寸规范_第11张图片

iPhone5 - 5C - 5S (@2×)

1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
Android /iPhone/iPad UI之常用图标尺寸规范_第12张图片

iPhone4 - 4S (@2×)

1024×1024 px 120×120 px 114×114 px 58×58 px 75×75 px 44×44 px
Android /iPhone/iPad UI之常用图标尺寸规范_第13张图片

iPhone & iPod Touch第一代、第二代、第三代

1024×1024 px 120×120 px 57×57 px 29×29 px 38×38 px 30×30 px

Android /iPhone/iPad UI之常用图标尺寸规范_第14张图片

iPad的设计尺寸

设备 尺寸 分辨率 状态栏高度 导航栏高度 标签栏高度
Android /iPhone/iPad UI之常用图标尺寸规范_第15张图片

iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2

2048×1536 px 264PPI 40px 88px 98px
Android /iPhone/iPad UI之常用图标尺寸规范_第16张图片

iPad 1 - 2

1024×768 px 132PPI 20px 44px 49px
Android /iPhone/iPad UI之常用图标尺寸规范_第17张图片

iPad Mini

1024×768 px 163PPI 20px 44px 49px

Android /iPhone/iPad UI之常用图标尺寸规范_第18张图片

iPad图标尺寸:

设备 App Store 程序应用 主屏幕 Spotlight搜索 标签栏 工具栏和导航栏
Android /iPhone/iPad UI之常用图标尺寸规范_第19张图片

iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2

1024×1024 px 180×180 px 144×144 px 100×100 px 50×50 px 44×44 px
Android /iPhone/iPad UI之常用图标尺寸规范_第20张图片

iPad 1 - 2

1024×1024 px 90×90 px 72×72 px 50×50 px 25×25 px 22×22 px
Android /iPhone/iPad UI之常用图标尺寸规范_第21张图片

iPad Mini

1024×1024 px 90×90 px 72×72 px 50×50 px 25×25 px 22×22 px

324234sdfsdfasdf撒打发士大夫撒打发士大夫Android /iPhone/iPad UI之常用图标尺寸规范_第22张图片

Android SDK模拟机的尺寸

屏幕大小 低密度(120) 中等密度(160) 高密度(240) 超高密度(320)

小屏幕

  QVGA(240×320)        480×640  

普通屏幕

WQVGA400(240×400) WQVGA432(240×432)   HVGA(320×480) WVGA800(480×800) WVGA854(480×854) 600×1024   640×960

大屏幕

WVGA800 *(480×800) WVGA854 *(480×854) WVGA800 *(480×800) WVGA854 *(480×854) 600x1024    

超大屏幕

   1024×600 1024×768 1280×768WXGA(1280×800) 1536×1152 1920×1152 1920×1200 2048×1536 2560×1600

Android的图标尺寸

屏幕大小 启动图标 操作栏图标 上下文图标 系统通知图标(白色) 最细笔画

320×480 px

48×48 px 32×32 px 16×16 px 24×24 px 不小于2 px

480×800px 480×854px 540×960px

72×72 px 48×48 px 24×24 px 36×36 px 不小于3 px

720×1280 px

48×48 dp 32×32 dp 16×16 dp 24×24 dp 不小于2 dp

1080×1920 px

144×144 px 96×96 px 48×48 px 72×72 px 不小于6 px

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手机分辨率和尺寸

设备 分辨率 尺寸 设备 分辨率 尺寸
Android /iPhone/iPad UI之常用图标尺寸规范_第23张图片

魅族MX2

4.4英寸 800×1280 px Android /iPhone/iPad UI之常用图标尺寸规范_第24张图片

魅族MX3

5.1英寸 1080×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第25张图片

魅族MX4

5.36英寸 1152×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第26张图片

魅族MX4 Pro未上市

5.5英寸 1536×2560 px
Android /iPhone/iPad UI之常用图标尺寸规范_第27张图片

三星GALAXY Note 4

5.7英寸 1440×2560 px Android /iPhone/iPad UI之常用图标尺寸规范_第28张图片

三星GALAXY Note 3

5.7英寸 1080×1920 px
Android /iPhone/iPad UI之常用图标尺寸规范_第29张图片

三星GALAXY S5

5.1英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第30张图片

三星GALAXY Note II

5.5英寸 720×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第31张图片

索尼Xperia Z3

5.2英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第32张图片

索尼XL39h

6.44英寸 1080×1920 px
Android /iPhone/iPad UI之常用图标尺寸规范_第33张图片

HTC Desire 820

5.5英寸 720×1280 px Android /iPhone/iPad UI之常用图标尺寸规范_第34张图片

HTC One M8

4.7英寸 1080×1920 px
Android /iPhone/iPad UI之常用图标尺寸规范_第35张图片

OPPO Find 7

5.5英寸 1440×2560 px Android /iPhone/iPad UI之常用图标尺寸规范_第36张图片

OPPO N1

5.9英寸 1080×1920 px
Android /iPhone/iPad UI之常用图标尺寸规范_第37张图片

OPPO R3

5英寸 720×1280 px Android /iPhone/iPad UI之常用图标尺寸规范_第38张图片

OPPO N1 Mini

5英寸 720×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第39张图片

小米M4

5英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第40张图片

小米红米Note

5.5英寸 720×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第41张图片

小米M3

5英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第42张图片

小米红米1S

4.7英寸 720×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第43张图片

小米M3S未上市

5英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第44张图片

小米M2S

4.3英寸 720×1280 px
Android /iPhone/iPad UI之常用图标尺寸规范_第45张图片

华为荣耀6

5英寸 1080×1920 px Android /iPhone/iPad UI之常用图标尺寸规范_第46张图片

锤子T1

4.95英寸 1080×1920 px
Android /iPhone/iPad UI之常用图标尺寸规范_第47张图片

LG G3

5.5英寸 1440×2560 px Android /iPhone/iPad UI之常用图标尺寸规范_第48张图片

OnePlus One

5.5英寸 1080×1920 px

主流浏览器的界面参数与份额

浏览器 状态栏 菜单栏 滚动条 市场份额(国内)
Android /iPhone/iPad UI之常用图标尺寸规范_第49张图片

Chrome 浏览器

22 px(浮动出现) 60 px 15 px 8%
Android /iPhone/iPad UI之常用图标尺寸规范_第50张图片

火狐浏览器

20 px 132 px 15 px 1%
Android /iPhone/iPad UI之常用图标尺寸规范_第51张图片

IE浏览器

24 px 120 px 15 px 35%
Android /iPhone/iPad UI之常用图标尺寸规范_第52张图片

360 浏览器

24 px 140 px 15 px 28%
Android /iPhone/iPad UI之常用图标尺寸规范_第53张图片

遨游浏览器

24 px 147 px 15 px 1%
Android /iPhone/iPad UI之常用图标尺寸规范_第54张图片

搜狗浏览器

25 px 163 px 15 px 5%

系统分辨率统计

分辨率 占有率 分辨率 占有率

1366×768

15%

1440×900

13%

1920×1080

11%

1600×900

5%

1280×800

4%

1280×1024

3%

1680×1050

2.8%

320×480

2.4%

480×800

2%

1280×768

1%



你可能感兴趣的:(android,ui,app,尺寸,ui)