Android .9图片的作用与制作

参考1：https://blog.youkuaiyun.com/aqi00/article/details/50163137

参考2：https://blog.youkuaiyun.com/sunbinkang/article/details/77331718

今天想起一个比较不错的图片处理技巧，百度搞清楚记录一下，好记性不如烂笔头，加深一下印象

我们先看下使用一般图片当背景的效果

使用同一张图片，制作成.9图片之后使用的效果

.9图片的作用

• .9图片的扩展名还是png，文件名后缀一般是 xxx.9.png,所以使用方式跟图片一样
• 设置拉伸的区域，避免图片失真
• 设置显示区域，保证拉伸时内容的正常显示

制作.9图片

使用Android Studio 制作（自带.9的绘制工具），我使用的AS版本是3.1.4

选中一张.png的图片，右键 选择 <Create 9-Patch file...> 然后选择一下保存路径跟命名就好了，创建好后如下图

名字跟原有图片名不同，或者删除掉原图，不然编译会报错（资源重复加载）

保存目录选择drawable，选择mipmap会出现xml文件报红，验证资源引用的问题

在你选择保存的目录下就多了一张 xxx.9.png的图片

.9图片的四个属性

上图可以看到，在.9图片上下左右均有一条黑线，这个可以在AS上直接拖动调整

• 上方的黑线作用

水平拉伸的时候，该黑线的区域无限拉伸，其他位置不变化。左右两边边框厚度不会变

• 左方的黑线作用

垂直拉伸的时候，该黑线的区域无限拉伸，其他位置不变化。上下两边边框厚度不会变

• 下方黑线的作用

当该图片作为背景时，文字的水平显示区域

• 右方黑线的左右

当该图片作为背景时，文字的垂直显示区域

 

如上这样设置，最后的效果见最开始贴出的效果图。一般前两个属性使用比较多，可以用来保证边框不会被拉伸模糊，当在项目中某部分或布局使用统一背景的时候，可以将背景图片转化成.9图片，避免大小差距过大，图片拉伸导致边框模糊