前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Android开发笔记(九)特别的.9图片

Android开发笔记(九)特别的.9图片

作者头像
aqi00
发布2019-01-18 10:32:54
9090
发布2019-01-18 10:32:54
举报
文章被收录于专栏:老欧说安卓

为什么使用.9图片

.9图片的扩展名是png,文件名后常带有“.9”字样,因为它把一个png图片划分为3*3的九宫格来分别处理,所以得名.9图片。.9.png是Android开发中使用的图片格式,其目的是保证在拉伸时图片显示不致失真,主要是避免边框或描边糊掉。 比如说一张分辨率为100*100的图片,其边框厚度为3,然后在手机上作为背景可能会拉伸到300*300,于是边框的厚度按比例放大到了9,这就比原始边框的厚度大了很多,看起来严重失真。如果背景是一个shape图形,其描边节点stroke在width属性上已经设置了具体的像素值如3dp,那么不管该shape图形拉伸到多大,描边厚度始终都是3dp。所以我们希望一张png图片也能实现shape的这种效果,即图片拉伸时不影响边框或描边的厚度。

.9图片的加工

Android的SDK自带了.9图片的加工工具,路径是SDK安装目录下的sdk\tools\draw9patch.bat,运行该程序就会呈现工具界面。

把需要加工的png图片拖到该工具界面上,图片便加载到工具处理画面

左边窗口是图片加工区域,右边窗口是图片预览区域,从上到下依次是纵向拉伸预览、横向拉伸预览、未拉伸预览。 在左边窗口图片四周的马赛克处,单击即出现一个黑点,然后把黑点左右或上下拖动,就会拖出一段黑线,不同方向上的黑线表示不同的处理效果。

.9图片的四个属性

上方的黑线,指的是水平方向的拉伸区域。水平方向拉伸图片时,只有黑线区域内的图像会被拉伸,黑线两边的图像保持原状,这保证了左右两边的边框厚度不变。

左方的黑线,指的是垂直方向的拉伸区域。垂直方向拉伸图片时,只有黑线区域内的图像会被拉伸,黑线两边的图像保持原状,这保证了上下两边的边框厚度不变。

下方的黑线,指的是该图片作为控件背景时,控件内部的文字左右边界只能放在黑线区域内。这里Horizontal Padding的效果就相当于android:paddingLeft与android:paddingRight。

右方的黑线,指的是该图片作为控件背景时,控件内部的文字上下边界只能放在黑线区域内。这里Vertical Padding的效果就相当于android:paddingTop与android:paddingBottom。

在实际开发中,前两个属性使用的比较多,因为很多场景都要求图片拉伸要保真。后两个属性,一般用的不多,但若是不知道,遇到问题还挺麻烦的。博主以前接手别人的项目时,就看到一个页面的文字总是与顶端有段距离,不管我怎么折腾xml和代码,都不管用。后来在高人的指点下,才想起来检查该页面的背景图片,结果用draw9patch.bat打开背景图,一下就发现该图片是不折不扣的.9图片,原来在水平和垂直方向上都设置了padding,这才解决了一大困惑。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2015年12月03日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 为什么使用.9图片
  • .9图片的加工
  • .9图片的四个属性
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档