iPhone、iPad、Android UI常用设计尺寸

news/2025/1/12 10:54:57/

iPhone:

-----------------------------------------------------------------

APPLE APP STORE ICON:512 x 512 PX
iPhone 4 App Icon:114 x 114 PX
iPhone 3GS App Icon:57 x 57 PX
iPhone 5 326ppi 4英寸 1136*640PX
iPhone 4 App UI:960 x 640PX (设计时,高度还需要减去状态栏40PX)
iPhone 3GS App UI:480x 320PX

 

 

描述

iPhone & iPod (px)

163ppi

高清屏iPhone4 (px)

326ppi

iPad (px)

132ppi

高清屏iPad (px)

264ppi

桌面程序图标

57 x 57

114 x 114

72 x 72

144 x 144

AppStore图标

512 x 512

1024 x 1024

512 x 512

1024 x 1024

启动画面

320 x 480

640 x 960

768 x 1004 (竖)

1024 x 748 (横)

1536 x 2008 (竖)

2048 x 1496 (横)

设计与Spotlight搜索(推荐拥有)

29 x 29

58 x 58

50 x 50(Spotlight搜索结果)

29 x 29 (设置)

100 x 100(Spotlight搜索结果)

58 x 58 (设置)

文档图标(自定义文档类型时用)

22 x 29

44 x 58

64 x 64

320 x 320

128 x 128

640 x 640

网页桌面快捷方式 (推荐所有网站使用)

57 x 57

114 x 114

72 x 72

144 x 144

工具栏与导航栏图标(可选)

约20 x 20

约40 x 40

约20 x 20

约40 x 40

选项卡图标(可选)

约30 x 30

约60 x 60

约30 x 30

约60 x 60

AppStore中默认报摊封面图标

长边至少512 px

长边至少1024 px

长边至少512 px

长边至少1024 px

 

 

关于iphone设计的官方指导:
http://developer.apple.com/library/iOS/#documentation/UserExperience/Conceptual/MobileHIG/IconsImages/IconsImages.html

 

iPad:
-----------------------------------------------------------------
iPad 3:2048 x 1536PX (2倍于iPad2)
iPad 2:1024 x 768PX


Android:
-----------------------------------------------------------------
设计常用术语:

 

常用术语

说明

备注

Screen size(屏幕尺寸)

指的是手机实际的物理尺寸,即屏幕的对角线长度,比如常用的3.5英寸,3.7英寸

摩托罗拉milestone手机是3.7英寸

Aspect Ratio(长宽比率)

指的是实际的物理尺寸长宽比率,分为long和nolong

Milestone是16:9,属于long

Resolution(分辨率)

和电脑的分辨率概念一样,指手机屏幕纵、横方向像素个数

Milestone是854*480

DPI(dot per inch)

每英寸像素数,如120dpi,160dpi等,假设QVGA(320*240)分辨率的屏幕物理尺寸是(2英寸*1.5英寸),dpi=160;

在 DPI为 240的屏幕上, 1个 DIP等于 1.5个物理像素

可以反映屏幕的清晰度,用于缩放UI的

Density(密度)

屏幕里像素值浓度,resolution/Screen size可以反映出手机密度

 

Density-independent pixel (dip)

指的是逻辑密度计算单位,dip和具体像素值的对应公式是dip/pixel=dpi值/160

 

 

 

 

屏幕分辨率范围 :

屏幕

低密度( 120), ldpi

中密度( 160), mdpi

高密度( 240), hdpi

小屏幕

QVGA(240×320)

2.6~ 3.0寸

 

 

普通屏幕

WQVG(240×400), 3.2~ 3.5寸;

FWQV(240×432), 3.5~ 3.8寸

HVGA(320× 480)3.0~ 3.5寸

WVGA(480× 800)3.3~ 4.0寸 ;

FWVGA(480×854) 3.5~ 4.0寸

大屏幕

 

WVGA(480× 800)4.8~ 5.5寸;

FWVG(480×854) 5.0~ 5.8寸

 

 

 

Android中图标尺寸:
AndroidManifest.xml中指定图标,名字不一定非叫icon
<application android:icon="@drawable/icon" android:label="@string/app_name">) I9 X" B! K1 C) B1 r& ?) W& T* o
2.0以后有三种尺寸,分别为36*36/48*48/72*72( n, F; H) x1 R) [! O
你会看到drawable-hdpi/drawable-ldpi/drawable-mdpi不同的目录用来存储不同尺寸的图标,在AndroidManifest.xml中只需要写@drawable/icon就可以,它会根据屏幕分辨率去找不同目录下的图标

类型 hdpi mdpi ldpi
ICON 72*72 48*48 36*36
Notification图标 48*48 32*32 24*24
标签Tab图标 48*48 32*32 24*24

转载于:https://www.cnblogs.com/HeroLe/p/3715922.html


http://www.ppmy.cn/news/452300.html

相关文章

摩托罗拉Z8 短信铃声设置和主题安装方法

摩托罗拉Z8 短信铃声设置和主题安装方法 .P1H/|2x-u3p"]Mo爱好者论坛控制面板--->文件夹---->更多----->编辑-------->信息------>开启-------->选择已有的或是查找声音-------->然后就到你的文件里面了&#xff0c;自己选择吧 #R:f;I!x,}&X:K3…

【PyTorch】关于张量的连续性(contiguous)

文章目录 引入&#xff1a;view和reshape有什么区别问题1&#xff1a;什么叫满足连续性的张量问题2&#xff1a;如何判断一个张量是否满足连续性条件问题3&#xff1a;为什么有些操作需要连续的张量方法1&#xff1a;不连续的张量转成连续张量问题4&#xff1a;为什么reshape可…

性能测试调优模型、思想和技术

最近阅读《软件性能测试、分析与调优实践之路》一书&#xff0c;个人认为性能调优章节为整部书的精华&#xff0c;该章节包括了性能测试调优模型、调优思想和调优技术。下面是摘抄整理自书中内容&#xff1a; 调优模型 下图为互联网中常见的用户请求的分层转发和处理的过程&a…

Apache Hudi初探(一)(与flink的结合)

背景 和Spark的使用方式不同&#xff0c;flink结合hudi的方式&#xff0c;是以SPI的方式&#xff0c;所以不需要像使用Spark的方式一样,Spark的方式如下&#xff1a; spark.sql.extensionsorg.apache.spark.sql.hudi.HoodieSparkSessionExtension spark.sql.catalog.spark_ca…

【MySQL】模式分解专题

文章目录 规范化模式分解规范化模式分解 规范化模式分解——学生关系(学号,姓名,年龄,性别,系别,系主任) 已知关系模式:学生(学号,姓名,年龄,性别,系别,系主任),一个学生隶属于一个系,一个系只有一个系主任。 请分析关系模式,回答问题: (1)写出函数依赖集…

如何安装PHP框架

目录 什么是PHP框架 第一步 安装PHP依赖包 第二步 导入PHP相关包 第三步 解包并切换进指定目录 第四步 在PHP目录内编译安装 第五步 编译 第六步 拷贝配置文件进行编辑 第七步 修改时区 第八步 修改文件指定路径 第九步 将命令加入指定目录进行识别 第十步 进入配置…

团队介绍 | 魅动 Magic Motion

团队介绍 | 魅动 Magic Motion 团队介绍 | 魅动 Magic Motion 魅动 Magic Motion 是专注于研发、设计和生产智能化私密生活用品的创新品牌。魅动 Magic Motion 将无线移动通信技术与私密生活产品相结合&#xff0c;开发与智能手机实现无缝连接&#xff0c;通过智能手机的免费Ap…

no rule to process file 'xxx/.../jquery.js' of type sourcecode.javascript for architecture i386

解决的办法&#xff1a;将Targets ->Build Phases-> Compile Sources 中的js文件拖拽到Copy Bundle Resource即可 详细解释可以来豫中有宋的博客看看