9patch / NinePatch 详解及使用

一、NinePatch介绍

NinePatch 是可伸缩的位图图像,可以用作视图的背景。其实质上就是在原图片(.png)上添加了1px的边框,允许按照我们的需求,把对应的区域设置为黑色线,它在使用的过程中就可以根据我们的实际需求自动调整图形大小以适应视图内容。NinePatch图像保存的后缀名为.9.png

 

对9patch图的制作规则如下:

1、上面黑线或者点表示纵向可拉伸的区域一般一个点即可

2、左边黑线或者点表示横向可拉伸的区域一般一个点即可

3、下面表示纵向填放内容的区域一般是一条黑线

4、右边表示横向填放内容的区域一般是一条黑线

Google官方手册上的介绍:

 

此 NinePatch 图形定义了一个具有左和上线的伸展区域, 以及可绘制区域的底部和右侧线条。在顶部图像中, 虚线灰色线标识复制图像的区域, 以拉伸图像。底部图像中的粉红色矩形标识允许视图内容的区域。如果该区域中的内容不适合, 则图像将被拉伸以使其适合。

 

二、NinePatch图片制作及使用

在旧版本的SDK中可以用SDK/tools/draw9patch.bat这个工具制作,而在android sudio中可以通过以下方式来制作:

右击需要制作成9patch图片的png文件->Create p-Patch file...

 

 


上侧1和左侧2黑线定义了可以拉伸的区域

右侧3和底侧4黑线交集的红框区域是显示区域

注:可以根据实际显示需求在上侧和左侧定义多个拉伸区域。

从上边的这个图中可以很直白的看出它为啥也叫九宫图了(被分割成了九个区域)。

 

在视图中的效果:

 

 

三、NinePatch使用中需要注意的事项
 

1. “No resource foundthat matches the given name”

这是因为在保存为PNG图片,命名时带了后缀.9.png。一定要注意命名只需要填写图片名称,工具会自动加上后缀。

 

2. AAPT: ERROR: 9-patchimage xxx.9.png malformed.  AAPT: Musthave one-pixel frame that is either transparent or white.

这是因为9.png九图的四边都需要描点,如果有一条边没有描点,有可能会报这个错误。