AndroidStudio绘制9-patch图--聊天对话框（含已做好的9-patch图）

今天在做毕设的时候要设计一个留言板模块，想来想去还是做成类似与微信QQ那样的聊天界面，但是在发送消息的时候遇到了聊天框无法自适应伸缩，导致界面十分难看，于是一番查找之后，发现patch9图可以自适应文字位置进行伸缩。研究了半下午，基本上是搞明白了制作过程，并制作好了聊天框的9-patch图，文末附上做好的聊天框9-patch图。

话不多说，先贴上效果图。

下面讲解一下9-patch图的制作过程。

1. 先将要制作9-patch图的原图导入到res目录下的drawable文件夹下，并右键点击create 9-patch， 然后默认保存在此文件夹下。
   

2. 打开制作好的9.png图，如下图所示，关键地方来了，图中共有上下左右四个黑色框框，将其标为1234。
   

其中1，2号黑色边框是用来标记可伸缩的范围，也就是在进行自适应的时候，图片可以伸缩的地方。
3，4号黑色边框是用来标记文字内容所在范围，勾选show content便可以看到文字所显示的位置。

黑色边框的绘制有一点很不方便描述，其实就是在每一个图片的边界有4个1像素的边界，鼠标进行划取进行标记，按住SHIFT+鼠标则进行取消。

3. 最后将之前的原图删除，同时退出AndroidStudio再次打开，文件资源才会重新加载，否则xml文件中将一直无法识别制作的9-patch图。

（ps：我之前一直觉得前端跟其他岗位比起来技术含量不是那么的高，没想到一个小图我都得做那么久。。。唉，真是各行有各行的难，哪一块都得费大劲。）

文末附上本人已做好的聊天框9-patch图，供大家参考，聊天框9-patch（含左右），开源牛逼就完事了。