之前一直使用的是Material Design的图标库,下载下来以后直接放入了对应文件夹,什么尺寸对应什么dpi都没有仔细研究过。

最近在Toolbar上添加几个不是MD图标库内的图标时发现,放入的图标在显示时有时候感觉被放大了,有时候又显得模糊。让我对这个图标的尺寸和显示系统产生了好奇,折腾了一番,终于算是基本弄清楚了。

PX、DP和DPI

首先复习一下屏幕像素密度的知识:

  1. px:像素点
  2. dpi:像素密度,即每英寸像素数
  3. dp:屏幕密度独立单位

不同手机的像素密度不同,同px的元素可能有不同的物理尺寸,这不利于多屏幕的适配。因此Android以160dpi(每英寸160像素)为基准定义了单位dp。

即1dp的元素在160dpi的屏幕用1个像素点px显示,在320dpi的屏幕用2px显示,但它们的显示实际物理长度均为1/160=0.00625英寸。320dpi在同样大小的屏幕内用了更多的像素显示,所以显得更「清晰」。

hdpi、xhdpi、xxhdpi

为了方便换算和显示,Android预定义了一系列的dpi作为基准,例如mdpi定义为160dpi、hdpi定义为240dpi(实际上是一定的范围,但不影响理解)。

我们拿到的图片资源文件是以像素px为单位的,图标的显示却是以dp为单位的。在使用ImageView进行显示时,在规定好图标的长宽后其内容会自动缩放(不同的ScaleType缩放的逻辑不一样),像素过低的图标会显得「不清晰」。

适用于高dpi屏幕的图标可以包含大量细节,在低dpi时直接缩放的话效果可能会出现锯齿、模糊或无法识别其中的元素等情况。为了分别针对不同显示密度的屏幕进行优化,Android在drawable和mipmap文件夹内为不同dpi的屏幕建立了不同的文件夹,在不同的设备上读取相应dpi文件夹内的图片资源进行显示。

Toolbar的icon显示逻辑

与ImageView这样的控件相比,Toolbar显示icon的逻辑就显得比较简单粗暴。在Material Design中,Toolbar的推荐高度为56dp,其中icon的尺寸建议为24dp,那么icon在不同dpi下的实际像素尺寸如下:

ldpi 120dpi 0.75 18px
mdpi 160dpi 1 24px
hdpi 240dpi 1.5 36px
xhdpi 320dpi 2 48px
xxhdpi 480dpi 3 72px
xxxhdpi 640dpi 4 96px

这里的问题在于,Toolbar的MenuView在显示时读取图片资源后,不会检查是否应该缩放,而是直接居中显示。那么,如果你的图片资源经过屏幕像素密度换算后不是「恰好」24dp的话,最后显示的效果就会与期望的效果不一致。

例如,xhdpi文件夹存放的应该是48px的icon,如果放入了96px大小的icon的话在Toolbar上就会显得2倍大。反之,在xxxhdpi中放入48px的icon看上去就会额外小。这也是为什么MD图标库中的icon会给mdpi到xxxhdpi一套图标的原因。

解决方案

通常情况下Toolbar的icon都是纯色的png图片,体积非常小。以ic_search_white_24dp.png这个图标为例,mdpi文件夹内的图片大小为396字节,而xxxhdpi文件夹内的图片大小也只有915字节,即使全部使用最大尺寸的图标,对安装包体积的影响也微乎其微。

而且Toolbar的icon都是抽象的图标、细节不多,在低dip的设备上进行缩放时效果并没有太大差别,根据Google发布的设备屏幕尺寸分布情况,hdpi以上的设备也已经占了85%以上。所以如果想要减小安装包体积的话,Toolbar的icon是可以全部只使用一份96px*96px的图片资源,并存放在xxxhdpi中的。

至于其他只在ImageView等控件中显示的资源,如果只有一份的话,放在哪个文件夹内其实是无所谓的。

图标设计规范

根据Material Design的设计规范,Toolbar icon的尺寸应为24dp,触摸响应大小为48dp(Toolbar会自动进行设置),而在icon内部应有一定的留白,一般为2-4dp。因此对于一张96px的icon来说,图片内的四周应有12px左右的边距。

这里推荐一个神器 iconmonstr,在搜索框输入关键词找到想要的icon后,选择png、调整大小为96px、边距12px后,就可以直接下载了。

转载于:https://www.cnblogs.com/endv/p/11312866.html

Android:Toolbar的图标尺寸问题相关推荐

  1. android中各种图标尺寸以及多分辨率支持方法

    1. Android中图标尺寸: AndroidManifest.xml中指定图标,名字不一定非叫icon <application android:icon="@drawable/i ...

  2. Android中logo图标尺寸问题

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

  3. Android UI 常用图标尺寸规范

    1. 程序启动图标: LDPI (Low Density Screen,120 DPI),其图标大小为 36 x 36 px. MDPI (Medium Density Screen, 160 DPI ...

  4. Android开发图标尺寸详解

    一.开发中的实际情况(促进理解): Android开发中一个很重要的组成,就是开发者和UI设计师的配合,这关乎到APP界面部分--吸引用户的直接手段,那么在实际开发中,开发者和设计师是如何配合的呢?第 ...

  5. APP图标尺寸规范一文了解清楚

    在进行图标设计前,熟知手机 app 图标尺寸规范,能更好地去针对不同平台设计出更极致的图标.当前智能手机系统主要以 iOS 及 Android 为主,APP 图标是产品给用户的第一印象,图标视觉设计的 ...

  6. android icon命名规则,安卓手机的APP图标尺寸规范和图标命名规范

    安卓手机的APP图标尺寸规范和图标命名规范 点击查看原文 android图标包括:程序启动图标.底部菜单图标.弹出对话框顶部图标.长列表内部列表项图标.底部和底部tab标签图标. 1.安卓程序启动图标 ...

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

    整合的相对比较全面了,如果不足可以指出在补充完整. Android-App 常用图标尺寸规范 出自:http://www.cnblogs.com/libertycode/p/5666088.html ...

  8. Photoshop自动导出各尺寸Android和Iphone图标,支持新版Android Studio

    1.准备工作:将jsx文件保存到本地后放到photoshop的预设脚本文件夹中,在Adobe Photoshop安装目录中Presets\Deco目录下,比如我的是在:D:\Program Files ...

  9. iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸...

    iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸 iPhone界面尺寸 设备 分辨 ...

  10. android 自定义桌面图标大小设置,手机桌面图标尺寸可以改?OriginOS重新定义个性化...

    原标题:手机桌面图标尺寸可以改?OriginOS重新定义个性化 随着安卓定制化系统同质化情况的加重,越来越多的终端厂商开始探索一场新的变革.深耕手机领域的vivo,自然也察觉到了这一点.经过不断地努力 ...

最新文章

  1. js 实现精确加减乘除运算之BigDecimal.js
  2. 使用 Linux 系统调用的内核命令图解
  3. 【新年礼物】pmcaff会员大放送!
  4. 基于ajax的数据验证
  5. mysql中的逻辑类型如何定义_MYSQL存储过程即常用逻辑知识点总结
  6. Java之Callable和Runnable
  7. mysql不同版本会覆盖吗,[mysql不同版本数据库同步]mysql数据库主从同步,master和slave上的mysql必须版本一样吗,如果不一样会有什么结果?...
  8. 易货Beta版本发布说明
  9. 查看游戏服务器ip地址网站,如何查看游戏服务器IP地址
  10. 使用httpclient4.3.2来实现微信临时素材的上传
  11. 高并发中,那些不得不说的线程池与ThreadPoolExecutor类
  12. 用StreamReader读取服务器端文本文件,或远程网页
  13. spring in action2笔记 第一章
  14. Web 3.0 宣言:为什么 Web 3.0 至关重要
  15. python菜鸟教程100例-Python 练习实例1
  16. UNet以ResNet34为backbone in keras
  17. 彻底搞懂Scrapy的中间件(三)
  18. Qt浅谈之七:抽奖软件(可显示图片和姓名)
  19. NPS净推荐值 客户忠诚度指标
  20. aptana安装python库_使用Aptana搭建Python开发环境

热门文章

  1. iOS NSMutableURLRequest 上传图片
  2. Asp.Net Core Mvc上Json序列化首字母大小写的问题
  3. H3 BPM MVC表单SheetAttachment控件使用NTKO打开附件(Word、Excel)
  4. 常用实例:js格式化手机号为3 4 4形式
  5. 分布式服务框架之Dubbo简介
  6. asp.net DataTable导出 excel的方法记录(第三方)
  7. Mysql 中将blob类型转换成varchar类型
  8. 怎么实现单击span时给span添加边框
  9. 关于mpvue 切换页面数据没清空
  10. (其他)用sublime text3编写的html网页用浏览器打开出现中文乱码的原理及解决方法(转)...