探究Android的多分辨率支持以及各种类型图标尺寸大小

news2024/11/18 0:36:56

 

术语和概念 
屏幕尺寸 
屏幕的物理尺寸,以屏幕的对角线长度作为依据(比如 2.8寸, 3.5寸)。 
简而言之, Android把所有的屏幕尺寸简化为三大类:大,正常,和小。 
程序可以针对这三种尺寸的屏幕提供三种不同的布局方案,然后系统会负责把你的布局方案以合适的方式渲染到对应的屏幕上,这个过程是不需要程序员用代码来干预的。 

屏幕长宽比 
屏幕的物理长度与物理宽度的比例。程序可以为制定长宽比的屏幕提供制定的素材,只需要用系统提供的资源分类符long和 notlong。 

分辨率 
屏幕上拥有的像素的总数。注意,虽然大部分情况下分辨率都被表示为“宽度×长度”,但分辨率并不意味着屏幕长宽比。在 Android系统中,程序一般并不直接处理分辨率。 

密度 
以屏幕分辨率为基础,沿屏幕长宽方向排列的像素。 
密度较低的屏幕,在长和宽方向都只有比较少的像素,而高密度的屏幕通常则会有很多 ——甚至会非常非常多——像素排列在同一区域。屏幕的密度是非常重要的,举个例子,长宽以像素为单位定义的界面元素(比如一个按钮),在低密度的屏幕上会 显得很大,但在高密度的屏幕上则会显得很小。 

密度无关的像素( DIP ) 
指一个抽象意义上的像素,程序用它来定义界面元素。它作为一个与实际密度无关的单位,帮助程序员构建一个布局方案(界面元素的宽度,高度,位置)。 
一个与密度无关的像素,在逻辑尺寸上,与一个位于像素密度为 160DPI的屏幕上的像素是一致的,这也是Android平台所假定的默认显示设备。在运行的时候,平台会以目标屏幕的密度作为基准,“透明地”处理所有需要的DIP缩放操作。要把密度无关像素转换为屏幕像素,可以用这样一个简单的公式: pixels = dips * (density / 160)。举个例子,在 DPI为 240的屏幕上, 1个 DIP等于 1.5个物理像素。我们强烈推荐你用 DIP来定义你程序的界面布局,因为这样可以保证你的 UI在各种分辨率的屏幕上都可以正常显示。 

Terms and concepts
Screen size
The physical size of the screen is based on the diagonal length of the screen (e.g. 2.8 inches, 3.5 inches).
In short, Android simplifies all screen sizes into three broad categories: large, normal, and small.
The program can provide three different layout schemes for these three screen sizes, and then the system will be responsible for rendering your layout scheme to the corresponding screen in a suitable way, this process does not require programmer code intervention.

Screen aspect ratio
The ratio of the physical length to the physical width of the screen. The program can provide the specified materials for the screen with the specified aspect ratio, using only the system-provided resource classifiers long and notlong.

Resolution
The total number of pixels you have on the screen. Note that while resolution is expressed as "width x length" in most cases, resolution does not imply a screen aspect ratio. In Android, programs don't usually deal directly with resolution.

density
Pixels arranged along the length and width of the screen based on the screen resolution.
A lower-density screen has fewer pixels in both width and length, while a higher-density screen usually has many -- even very, very many -- pixels arranged in the same area. The density of the screen is very important, for example, an interface element (such as a button) whose length and width are defined in pixels will appear large on a low density screen, but will appear small on a high density screen.

Density-independent pixels (DIP)
An abstract pixel that a program uses to define an interface element. It acts as a unit independent of actual density to help programmers build a layout scheme (width, height, position of interface elements).
A density-independent pixel is logically the same size as a pixel on a screen with a pixel density of 160DPI, which is the default display device assumed by the Android platform. At runtime, the platform "transparently" handles all required DIP scaling operations based on the density of the target screen. To convert density-independent pixels to screen pixels, use a simple formula: pixels = dips * (density / 160). For example, on a screen with a DPI of 240, 1 DIP equals 1.5 physical pixels. We strongly recommend that you use DIP to define the layout of your application's interface, as this will ensure that your UI will display properly on a variety of screen resolutions.

 

 支持的屏幕分辨率范围 
1.5及更早版本的 Android系统,在设计的时候假定系统只会运行在一种分辨率的设备上—— HVGA( 320× 480)分辨率,尺寸为 3.2寸。由于系统只能工作在一种屏幕上,开发人员就可以针对那个屏幕来编写自己的程序,而无需去考虑程序在其他屏幕上的显示问题。 
但自从 Android 1.6以来,系统引入了对多种尺寸、多种分辨率屏幕的支持,以此满足拥有各种配置的新平台的运行需求。这就意味着开发人员在针对 Android 1.6或更新版系统开发程序的时候,需要为自己的程序在多种分辨率的屏幕上良好显示作出额外的设计。 
为了简化程序员面在对各种分辨率时的困扰,也为了具备各种分辨率的平台都可以直接运行这些程序, Android平台将所有的屏幕以密度和分辨率为分类方式,各自分成了三类: 
·三种主要的尺寸:大,正常,小; 
·三种不同的密度:高( hdpi),中( mdpi)和低( ldpi)。 
如果需要的话,程序可以为各种尺寸的屏幕提供不同的资源(主要是布局),也可以为 各种密度的屏幕提供不同的资源(主要是位图)。除此以外,程序不需要针对屏幕的尺寸或者密度作出任何额外的处理。在执行的时候,平台会根据屏幕本身的尺寸 与密度特性,自动载入对应的资源,并把它们从逻辑像素( DIP,用于定义界面布局)转换成屏幕上的物理像素。 
下表列出了 Android平台支持的屏幕中一些比较常用的型号,并显示了系统是如何把它们分类到不同的屏幕配置里的。有些屏幕分辨率并不在下面的列表上,但系统仍会把它们归入下列的某一个类型中。

 

如上表所示,所有分辨率的屏幕,都围绕在基准屏幕 周围,而基准屏幕在分类中,为“正常”尺寸,与“中”密度。之所以用 HVGA屏幕作为基准屏幕,是因为所有针对 Android 1.5或更早的程序都是针对这片屏幕所写的(因为只支持这一片),比如 T-Mobile G1。 
虽然系统支持上面 9种不同配置 的屏幕,但你并不一定需要为它们都提供各自不同的资源。系统已经提供了足够鲁棒(就是在各种恶劣环境下正常工作,对环境变化不敏感)的兼容特性,用于在各 种不同的屏幕上良好显示你的程序。这在下面的文档中会详细描述,如果你需要更多的资料,请查看“与屏幕无关的最佳实践”。

单位:像素 

WVGA854: 854*480

WVGA800: 800*480

HVGA: 640*480 

QVGA: 320*240

WQVGA432:432*240

WQVGA400:400*240 

Android3.0 WXGA:800*1280

DVGA960(640x960, high density, normal screen )
QVGA (240x320, low density, small screen)
WQVGA (240x400, low density, normal screen)
FWQVGA (240x432, low density, normal screen)
HVGA (320x480, medium density, normal screen)
WVGA800 (480x800, high density, normal screen)
WVGA854 (480x854 high density, normal screen)

 

 

Android中图标尺寸:

AndroidManifest.xml中指定图标,名字不一定非叫icon
<application android:icon="@drawable/icon" android:label="@string/app_name">

2.0以后有三种尺寸,分别为36*36/48*48/72*72
你会看到drawable-hdpi/drawable-ldpi/drawable-mdpi不同的目录用来存储不同尺寸的图标,在AndroidManifest.xml中只需要写@drawable/icon就可以,它会根据屏幕分辨率去找不同目录下的图标

hdpi里面主要放高分辨率的图片,如WVGA (480x800),FWVGA (480x854)
mdpi里面主要放中等分辨率的图片,如HVGA (320x480)
ldpi里面主要放低分辨率的图片,如QVGA (240x320)


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

 

Android的icon尺寸

在运行时,程序为最佳显示效果提供了三种方法:

1.图片缩放

基于当前屏幕的 精度,平台自动加载任何未经缩放的限定尺寸和精度的图片。如果图片不匹配,平台会加载默认资源并且在放大或者缩小之后可以满足当前界面的显示要求。例如, 当前为高精度屏幕,平台会加载高精度资源(如图片),如果没有,平台会将中精度资源缩放至高精度。

2.自动定义像素尺寸和位置

如果程序不支持多种精度屏幕,平台会自动 定义像素绝对位置和尺寸值等,这样就能保证元素能和精度160的屏幕上一样能显示出同样尺寸的效果。例如,要让WVGA高精度屏幕和传统的HVGA 屏 幕一样显示同样尺寸的图片,当程序不支持时,系统会对程序慌称屏幕分辨率为320×533,在(10,10)到(100,100)的区域内绘制图形完成之 后,系统会将图形放大到(15,15)到(150,150)的屏幕显示区域。

3.兼 容更大尺寸的屏幕

当前屏幕超过程序所支持屏幕的上限时,定义supports- screens元素,这样超出显示的基准线时,平台在此显示黑色的背景图。例如,WVGA 中精度屏幕上,如程序不支持这样的大屏幕,系统会谎 称是一个320×480的,多余的显示区域会被填充成黑色。

但为了达到最佳的显示效 果,最好的方法还是设计多套图片。那就有必要对于所有的屏幕依据精度值进行分级(高中低),之后再设计三套icon:


先为主流的中精度屏 幕(HVGA)设计一套icon,确定图片的像素尺寸。
为高精度屏幕将图片放大到150%,为低精度屏幕将图片缩小至75%。
将这三套资 源放置到程序的三个文件夹下 :res/drawable-mdpi/ 、res/drawable-hdpi/、 res/drawable- ldpi/。程序在运行时,平台会根据屏幕的精度调取合适的icon。

 

符合当下的流行趋势,避免过度使用隐喻。
高 度简化和夸张,小尺寸图标也能易于识别,不宜太复杂。
尝试抓住程序的主要特征,比如音像作为音乐的icon。
使用自然的轮廓和形状,看起 来几何化和有机化,不失真实感。
Icon采用前视角,几乎没有透视,光源在顶部。
不光滑但富有质感。 

 

正确和错误的icon

另外,所有的icon都有文字标签,不要在设计时把文字也放到icon中。

Launcher Icon通常是一个较大的标准图标中包含一个小图标,使用一个中性色彩和一个主要色彩,并保持高度的对比,不宜过度饱和。

 

推荐色值

尺寸和定位

Launcher icons要有多样化的形状和样式,但又要形成统一的视觉风格,其尺寸和定位也用统一:


(Full Asset)红色边框为图标尺寸
(Icon) 蓝色边框是图形尺寸,比图标尺寸稍小,图形之外的空间用于显示阴影和特殊效果。
(Square Icon)橙色边框是另外一种图形尺寸。两种类型的图形尺寸可以达到统一的视觉权重。

Icon dimensions for high-density (hdpi) screens:

 

Full Asset: 72 x 72 px
Icon: 60 x 60 px
Square Icon: 56 x 56 px

Icon Dimensions for medium-density (mdpi) screens:

 

Full Asset: 48 x 48 px
Icon: 40 x 40 px
Square Icon: 38 x 3

Icon Dimensions for low-density (ldpi) screens:

 

Full Asset: 36 x 36 px
Icon: 30 x 30 px
Square Icon: 28 x 28 px

模板

下载Android的标准图标模板,在此基础上绘制icon,后期还要加上阴影效果。

WVGA (高精度) 屏幕的阴影:

 

Effect: Drop Shadow
Color: #000000
Blend Mode: Multiply
Opacity: 75%
Angle: 90°
Distance: 2px
Spread: 0%
Size: 5px

另外,还有Menu icon 、Status bar icon 、Tab icon、 Dialog icon 和List view icon的设计教程请查看原文吧。

非常详尽的icon设计教程,一个程序里要放置三套icon,还有Android硬件比较好,不然 内存爆掉

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1642733.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

大厂案例 - 通用的三方接口调用方案设计(中)

文章目录 Pre阿里云华为云【AK和SK生成方案】最佳实践1. 创建API密钥管理系统2. 生成AK和SK3. 存储和管理AK和SK4. 提供API密钥分发机制5. 安全性6. 其他注意事项 DB Model Design表结构Next考虑其他建议 API接口设计指导1. 使用POST作为接口请求方式2. 客户端IP白名单3. 单个接…

ROS服务器通信

目录 一、角色 二、流程 注意 三、例子描述 四、srv文件 编译配置文件 vscode配置 五、Server.cpp编写例子 编写CMakeList 六、观察server的效果 七、Client编写例子 编写CMakeList 八、观察Client的结果 九、Client优化&#xff08;动态输入&#xff09; 了解argc…

【网络编程下】五种网络IO模型

目录 前言 一.I/O基本概念 1.同步和异步 2.阻塞和非阻塞 二.五种网络I/O模型 1.阻塞I/O模型 2.非阻塞式I/O模型 ​编辑 3.多路复用 4.信号驱动式I/O模型 5. 异步I/O模型 三.五种I/O模型比较​编辑 六.I/O代码示例 1. 阻塞IO 2.非阻塞I/O 3.多路复用 (1)select …

STM32 F103C8T6学习笔记16:1.3寸OLED的驱动显示日历

今天尝试使用STM32 F103C8T6驱动显示 1.3寸的OLED&#xff0c;显示数字、字符串、汉字、图片等 本质与0.96寸的OLED是完全相同的原理&#xff1a; 而且经过我的研究发现: 1.3寸大小的OLED并未比0.96寸的有更多的显示像素点数来显示&#xff0c;也是128*64的像素点数显示: 也…

2024-5-4

今日流水账&#xff1a; 上午&#xff1a; 之前的那道 kernel pwn 已经成功构造了 dirty pipe 原语&#xff08;&#xff1a;但是不知道为啥修改 /bin/busybox 一直报段错误&#xff0c;悲&#xff0c;后面在探索探索&#xff08;&#xff1a;这里简单尝试写下 /etc/passwd&…

【架构系列】RabbitMQ应用场景及在实际项目中如何搭建可靠的RabbitMQ架构体系

作者:后端小肥肠 创作不易&#xff0c;未经允许禁止转载。 1. 前言 RabbitMQ&#xff0c;作为一款高性能、可靠的消息队列软件&#xff0c;已经成为许多企业和开发团队的首选之一。它的灵活性和可扩展性使得它适用于各种应用场景&#xff0c;从简单的任务队列到复杂的分布式系统…

eNSP-动态路由(ospf协议)

一、拓扑结构搭建 二、主机配置 pc1 pc2 三、路由器配置 1.AR2配置 <Huawei>sys #进入系统视图 [Huawei]int g0/0/0 #进入接口 [Huawei-GigabitEthernet0/0/0]ip address 192.168.0.2 24 #设置ip地址 [Huawei-GigabitEthernet0/0/0]q #返回上一级 [Huawei]int g0/0/1 …

asp.net结课作业中遇到的问题解决2

目录 1、如何实现评论交流的界面 2、如果想要将文字添加到数据库中&#xff0c;而不是乱码&#xff0c;该怎么修改 3、如果想要添加的数据已经存在于数据库&#xff0c;就不允许添加了&#xff0c;该如何实现 4、想要实现某个模块下有好几个小的功能该如何实现 5、想要实现…

Unity 性能优化之数据面板(Statistics)(一)

提示&#xff1a;仅供参考&#xff0c;有误之处&#xff0c;麻烦大佬指出&#xff0c;不胜感激&#xff01; 文章目录 前言一、unity 统计数据面板&#xff08;Statistics&#xff09;1.Audio属性2.Graphics属性 二、什么是Draw Call&#xff1f;三、Unity3D stats也可以通过代…

大型语言模型的新挑战:AMR语义表示的神秘力量

DeepVisionary 每日深度学习前沿科技推送&顶会论文&数学建模与科技信息前沿资讯分享&#xff0c;与你一起了解前沿科技知识&#xff01; 引言&#xff1a;AMR在大型语言模型中的作用 在自然语言处理&#xff08;NLP&#xff09;的领域中&#xff0c;抽象意义表示&…

【Android学习】自定义文本框和输入监听

实现功能 以上代码可实现功能&#xff1a; 1 自定义文本框样式 2. 文本框触发形式转变 3. 文本框输入长度监听&#xff0c;达到最大长度关闭软键盘 4. password框触发检测phone框内容 1. drawable自定义形状 我创建了editor_focus.xml 和 editor_unfocus.xml&#xff0c;两者仅…

性能优化(一):ArrayList还是LinkedList?

引言 集合作为一种存储数据的容器&#xff0c;是我们日常开发中使用最频繁的对象类型之一。JDK为开发者提供了一系列的集合类型&#xff0c;这些集合类型使用不同的数据结构来实现。因此&#xff0c;不同的集合类型&#xff0c;使用场景也不同。 很多同学在面试的时候&#x…

3.2Java全栈开发前端+后端(全栈工程师进阶之路)-前端框架VUE3框架-企业级应用- Vuex

Vuex简介 Vuex概述 Vuex是一个专门为Vue.js应用程序开发的状态管理模式, 它采用集中式存储管理所有组件的公共状态, 并以相应的规 则保证状态以一种可预测的方式发生变化. 试想这样的场景, 比如一个Vue的根实例下面有一个根组件名为App.vue, 它下面有两个子组件A.vue和B.vu…

巧记英语单词

页面 在输入框中填写英语单词的谐音 这样的话就进行了一次英语单词的记忆练习。 页面代码 <% layout(/layouts/default.html, {title: 英语单词管理, libs: [dataGrid]}){ %> <div class"main-content"><div class"box box-main">&l…

如何为 Nestjs 编写单元测试和 E2E 测试

前言 最近在给一个 nestjs 项目写单元测试&#xff08;Unit Testing&#xff09;和 e2e 测试&#xff08;End-to-End Testing&#xff0c;端到端测试&#xff0c;简称 e2e 测试&#xff09;&#xff0c;这是我第一次给后端项目写测试&#xff0c;发现和之前给前端项目写测试还…

练习题(2024/5/4)

1 二叉树的所有路径 给你一个二叉树的根节点 root &#xff0c;按 任意顺序 &#xff0c;返回所有从根节点到叶子节点的路径。 叶子节点 是指没有子节点的节点。 示例 1&#xff1a; 输入&#xff1a;root [1,2,3,null,5] 输出&#xff1a;["1->2->5","…

学习Rust的第26天:Rust中的cp

在本文中复刻了 cp 实用程序的功能&#xff0c;我想默认使其递归&#xff0c;因为每次我想复制时都输入 -R 文件夹都会觉得有点重复&#xff0c;本文代码将与前文代码保持相似&#xff0c;我们只会更改程序的核心功能和一些变量名称以匹配用例 Pseudo Code 伪代码 function cop…

STM32G474 CMAKE VSCODE 开发环境搭建

本篇博文尝试搭建 stm32g474 的开发环境 一. 工具安装 1. 关于 MinGW、OpenOCD、Zadig 这些工具的下载和安装见 JlinkOpenOCDSTM32 Vscode 下载和调试环境搭建_vscode openocd stm32 jlink-CSDN博客 2. 导出一个 STM32 的 CMAKE 工程&#xff0c;这里略过。 3. 安装 ninja …

C++:继承-继承权限

在C中&#xff0c;类的权限分为公有、私有和保护三种。这些权限控制了类的成员&#xff08;数据成员和成员函数&#xff09;对外部代码的可见性和访问性。 公有&#xff08;public&#xff09;权限&#xff1a; 在公有权限下声明的成员可以被类的外部代码直接访问&#xff1b;公…

小程序引入 Vant Weapp 极简教程

一切以 Vant Weapp 官方文档 为准 Vant Weapp 官方文档 - 快速入手 1. 安装nodejs 前往官网下载安装即可 nodejs官网 安装好后 在命令行&#xff08;winr&#xff0c;输入cmd&#xff09;输入 node -v若显示版本信息&#xff0c;即为安装成功 2. 在 小程序根目录 命令行/终端…