UI在APP设计切图的时候，总是会遇到开发要求切.9图，可是什么是.9图，.0图用来干什么，什么时候该切.9图以及.9图该怎么切呢？让我们一起来看看吧。
· 什么是.9图？
.9.PNG是.9图的全称，通常我们亲切的称它为.9图。来看看官方是怎么解释的：
.9.PNG是安卓开发里面的一种特殊的图片，这种格式的图片通过ADT自带的编辑工具生成，使用九宫格切分的方法，使图片支持在android 环境下的自适应展示。
这么说大家可能不是很明白，我们来举一些例子了解一下吧。
在日常看到.9图最频繁使用的应该要算是像这样的聊天气泡了，聊天气泡里可能包含一个字符，或是一句话，一段话，而且根据聊天内容长短宽高不一，像这样的聊天气泡应该怎么切图呢？
如果我们只是正常的切图，那么来看看会发生什么吧。
可以看到，如果我们切一张图，图片拉伸以后圆角和小三角都已经变形，这是UI设计师万万不能接受的效果。
如果可以只拉伸图上橙色区域的话是不是就达到了我们想要的效果呢，所以，就轮到.9图登场了。
· 如何制作.9图？
之前说到，.9.PNG是使图片支持在android 环境下的自适应展示。既然是在andriod下专属的图片格式，我们的android工程师们当然是有办法制作.9.PNG的了。而UI的萌妹子们要做的，就是输出一张最小边界情况的图给到工程师就好了。
依然拿刚才的聊天气泡举例。 我们只需要输出一张单字符的聊天气泡给工程师并命名为.9.png就好了，因为聊天最小边界的情况就是发一个字符，比如说单独发出一个：！。
切片：
命名： chart_bg.9.png
划重点：
1.一张最小边界情况的切片；
2.命名时后缀名改为.9.png。
虽然andriod开发工程师可以自己制作.9.PNG，但是始终坚持让UI出.9.png作为UI设计师该怎么办呢？别慌，依然有办法的。
打开刚才的切片，用1px的纯黑色线条在边缘标记出可拉伸区域，并命名为XXX_XXX.9.png,就完成拉。
划重点：
1.线条为1px；
2.手绘的黑线拉伸区必须是#000000，透明度100%，并且图像四边不能出现半透明像素；
3. 存储为web所用格式，选择png-24，储存时手动将后缀名改为.9.png
· 什么情况下使用.9图？
除了聊天气泡，还有很多情况下都可以使用.9图，大家不要只局限于气泡制作哦，下面给大家一些参考吧。
同一样式 不同大小的按钮背景
同一样式 不同大小的背景框
类似于上面的这些统一样式，不同大小的图，我们都可以用.9图进行处理。使用了*.9.png图片技术后，我们就不需要每一个尺寸都出一个切片了，只需要采用一套界面切图去适配不同的分辨率，而且大幅减少安装包的大小。而且这样程序不需要专门做处理的就可以实现其拉伸，也减少了代码量和开发工作量。
· 番外篇
Android工程师如何利用png切片制作.9图？
1.将png文件拖入项目的drawable中；
2.在图片上点击右键点击Create 9-patch file…,然后直接点保存，你会看到drwable中多出一个后缀名名为.9.png的图片（当然你可以直接手动修改后缀名再放入drwable中，达到的效果是一样的）。
3.点开创建好的点9图片。然后左键点击，绘制你需要改变的地方，也就是可以拉伸的部分。这时你就会看到黑线和右边拉伸后的效果了。
由于android工程师在制作.9图的时候可以实时查看图片拉伸后的效果，这样可以达到最佳效果，所以建议UI设计师们直接给切片到工程师，工程师自己动手做一下.9图哦，但是要记得切拉伸前最小尺寸的图。
· 不使用.9图的IOS开发工程师们又是怎么实现适配的呢？
之前说到.9图是使图片支持在android 环境下的自适应展示，那么IOS怎么办呢？像这样类型的图片我们又该怎么给IOS切片呢？
其实依然和.9图的原理相似，都是选取某一块区域拉伸。将图片拖入，点击图片，然后点击Start Slicing或者是在右边Slices选取模式，就可以开始调整可拉伸区域了。
所以IOS的切图也切拉伸前最小尺寸的图就可以了，不需要改后缀名。
网友评论