UI设计尺寸规范最新最全UI设计规范.docx

UI设计尺寸规范最新最全UI设计规范.docx

《UI设计尺寸规范最新最全UI设计规范.docx》由会员分享，可在线阅读，更多相关《UI设计尺寸规范最新最全UI设计规范.docx（9页珍藏版）》请在冰豆网上搜索。

UI设计尺寸规范最新最全UI设计规范

UI设计规范：

IOS、Android系统主流尺寸整理

iPhone界面尺寸

设备

分辨率

PPI

状态栏高度

导航栏高度

标签栏高度

iPhone6P、6SP、7P

iPhone6P、6SP、7P

1242×2208px

401PPI

60px

132px

146px

iPhone6-6S-7

iPhone6-6S-7

750×1334px

326PPI

40px

88px

98px

iPhone5-5C-5S

iPhone5-5C-5S

640×1136px

326PPI

40px

88px

98px

iPhone4-4S

iPhone4-4S

640×960px

326PPI

40px

88px

98px

iPhone&iPodTouch第一代、第二代、第三代

320×480px

163PPI

20px

44px

49px

iPhone图标尺寸：

设备

AppStore

程序应用

主屏幕

Spotlight搜索

标签栏

工具栏和导航栏

1024×1024

180×180

114×114

75×75

iPhone6P-6SP-7（@3×）

px

px

px

87×87px

px

66×66px

1024×1024

120×120

114×114

75×75

iPhone6-6S-7（@2×）

px

px

px

58×58px

px

44×44px

1024×1024

120×120

114×114

75×75

iPhone5-5C-5S（@2×）

px

px

px

58×58px

px

44×44px

1024×1024

120×120

114×114

75×75

iPhone4-4S（@2×）

px

px

px

58×58px

px

44×44px

iPhone&iPodTouch第一代、第

1024×1024

120×120

38×38

二代、第三代

px

px

57×57px

29×29px

px

30×30px

iPad的设计尺寸

设备

尺寸

iPad3-4-5-6–Air-Air2-mini2

iPad1-2

iPadMini

iPad图标尺寸：

设备

2048×1536px

1024×768px

1024×768px

iPad1-2

分辨率

状态栏高度

导航栏高度

标签栏高度

264PPI

40px

88px

98px

132PPI

20px

44px

49px

163PPI

20px

44px

49px

AppStore

程序应用

主屏幕

Spotlight搜索

标签栏

工具栏\

导航栏

1024×1024px

180×180

144×144

100×100

50×50

44×44

px

px

px

px

px

1024×1024px

90×90

72×72

50×50px

25×25

22×22

px

px

px

px

iPad3-4-5-6-Air-Air2-mini2

1024×1024px

90×90px

72×72px

50×50px

25×25px

22×22px

iPadMini

AndroidSDK模拟机的尺寸

屏幕大小

低密度（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×11521920×1152

1920×1200

2048×1536

2560×1600

Android的图标尺寸

屏幕大小

启动图标

操作栏图标

上下文图标

系统通知图标

（白色）

最细笔画

320×480px

48×48px

32×32px

16×16px

24×24px

不小于2px

480×800px

480×854px

72×72px

48×48px

24×24px

36×36px

不小于3px

540×960px

720×1280px

48×48dp

32×32dp

16×16dp

24×24dp

不小于2dp

1080×1920px

144×144px

96×96px

48×48px

72×72px

不小于6px

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

设备

分辨率

4.4英寸

魅族MX2

尺寸

设备

分辨率

尺寸

800×1280px

魅族MX3

5.1英寸

1080×1280px

魅族MX4

三星GALAXYNote4

三星GALAXYS5

索尼XperiaZ3

HTCDesire820

OPPOFind7

OPPOR3

小米M4

小米M3

小米M3S

5.36英寸

1152×1920px

5.7英寸

1440×2560px

5.1英寸

1080×1920px

5.2英寸

1080×1920px

5.5英寸

720×1280px

5.5英寸

1440×2560px

5英寸

720×1280px

5英寸

1080×1920px

5英寸

1080×1920px

5英寸

1080×1920px

5英寸

1080×1920px

魅族MX4Pro未上市

三星GALAXYNote3

三星GALAXYNoteII

索尼XL39h

HTCOneM8

OPPON1

OPPON1Mini

小米红米Note

小米红米1S

小米M2S

5.5英寸

1536×2560px

5.7英寸

1080×1920px

5.5英寸

720×1280px

6.44英寸

1080×1920px

4.7英寸

1080×1920px

5.9英寸

1080×1920px

5英寸

720×1280px

5.5英寸

720×1280px

4.7英寸

720×1280px

4.3英寸

720×1280px

4.95英寸

1080×1920px

5.5英寸

LGG3

1440×2560px

5.5英寸

1080×1920

px

OnePlusOne

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

浏览器

Chrome浏览器

火狐浏览器

IE浏览器

360浏览器

遨游浏览器

搜狗浏览器

状态栏

菜单栏

滚动条

市场份额（国内浮动）

22px（浮动出现）

60px

15px

42.1%

20px

132px

15px

1%

24px

120px

15px

34%

24px

140px

15px

28%

24px

147px

15px

1%

25px

163px

15px

3.8%

系统分辨率统计

分辨率

占有率

分辨率

占有率

1920×1080

13.8%

1366×768

10.2%

360×640

7.9%

1440×900

7.7%

720×1280

6.4%

1024×768

5.1%

320×568

3.7%

1600×900

3.5%

1080×1920

3.3%

375×667

3.2%