NinePatch (.9图)的原理和使用

遇到一个奇怪的问题:提供给别人的aar的 9-patch图片都不生效了. 初始以为时图片格式的问题, 改了一阵.

后来看了一下发现别人用的时候根本没用aap编译图片, 系统无法识别9-patch. 然后还要用gradle特别帮别人编译一下...

 

.9图的定义

简单来说就是

左边的线代表垂直拉伸的区域，上边的线代表水平拉伸的区域；

右边的线代表文字等的垂直可可显示区域，下边的线代表文字等的水平可显示区域。

所以，左上重合的区域就是拉伸区域；右下重合的区域就是显示区域。

.9图现在可以在AS里面编辑, 十分方便

 

.9图的使用

一般直接当做图片资源使用即可

从服务器获取.9图时处理

如果不是编译时加入的话需要先对图片编译

执行命令:aapt.exe s -i xxx.9.png -o xxx.png

然后使用代码加载
 

Bitmap bmp = BitmapFactory.decodeFile(filepath); 

NinePatchDrawable npd = new NinePatchDrawable(context.getResource(), bmp, bmp.getNinePatchChunk, new Rect(), null); 

 

编译时对图片格式处理

 Android的编译工具aapt会把标记了拉伸区域的点9图处理成一个普通的png，并把相关的信息放入png头部的meta-data区域，即chunk。结构如下

可以编写代码读取.9图的信息

具体参考https://blog.youkuaiyun.com/u013365670/article/details/25415393

 

加载.9图片原理

调用NinePatchDrawable的draw方法实际调用了NinePatch的draw方法, 之后的代码执行依次是

canva.drawPatch > baseCanva.drawPatch > baseCanva.nDrawNinePatch > android_graphics_Canvas.drawNinePatch

可以看到最终是调用了底层实现绘制, 大概的实现原理应该是把图片分为9个区域, 然后对可以拉伸的区域拉伸绘制.

有兴趣的同学可以深入看下, 交流一下

 

 

参考: 

https://blog.youkuaiyun.com/Tencent_Bugly/article/details/52414034

https://blog.youkuaiyun.com/u013365670/article/details/25415393