点九图的制作方法

首先，我们来了解一下什么是点9图？

点9图就是安卓系统或ios系统内的一种可拉抻而不失真的图，

点9图是把图中某些部分进行拉伸，而不想拉伸的部分，比如圆角等部分不做变化。

下面就我就以聊天气泡为例：

首先来看看一张做好的普通的气泡背景图及显示的效果图

上面那张是我做的气泡背景图，而下面两张分别是横向拉伸和纵向拉伸的效果，可以看出来，这种效果是非常糟糕的，并不是我们想要的，背景变形了，文字也没有在中间，虽然可以调边距使文字居中，但接下来我会教大家更好用的方法，也是用点9图。

现在来看看使用了点9图的背景的效果

很明显这样的拉伸就是我们要的效果了，四个角都不会变形，而且文字显示在中间。

下面来说说点9图的原理：

这是一张点9图，我分为1,2,3,4四个部分，其中1跟2部分表示拉伸的位置，3跟4部分表示内容显示部分

画图的时候根据自己需要画出四个黑边（一会教大家用工具），1、2的黑边的范围内会被拉伸，即之外的四个圆角跟突出来的三角形都不会变形。这样就能做到保持图片不变形的拉伸了。

 

下面就来做一张点9图，首先找到sdk的tools目录下的draw9patch.bat

双击打开

然后点击左上角的File导入最开始的那张图片

左边是带做图片，右边是效果预览图

那些黑边只需将鼠标在图片边缘位置往中间移便可做出来，至于那个点，我是习惯在可拉伸区域用鼠标点一下便可，当然随你喜欢可以拉长，就像上面的一张图一样。

点击这个show content复选框

便可在右边预览效果，灰色区域即内容显示区域，这样不用同过调边距使文字居中，方便了很多。

做好了之后，再点击左上角的File，点击Save 9-patch，保存为png图片，它会自动添加.9后缀，这个后缀不能删掉，删掉它就跟普通图片没区别了，（不对，应该说比普通图片多了四个黑边。）这样就完成了点9图的制作。

接下来在android中使用，跟普通图片，图标使用方法一样，虽然后缀多了.9，但是使用是不用加上.9。

 

比如：img.9.png,

在使用时只需android:background="@drawable/img"即可

效果图如下

气泡的长度可根据你输入的内容拉伸或收缩