今天第一次正经的给开发小哥哥切.9图，可能这个小哥哥对.9图也不是很了解，导致刚开始一直报错，在我导师的讲解下我也是半懂状态，自己再私下看了讲解，哎妈呀，我终于懂了！！！！谢谢安卓开发的小哥哥让我今天又涨知识了哈哈哈，于是赶紧记录下来，怕我下次又是之前的固定思维哈哈哈
什么是.9切图
.9是andriod平台里的一种特殊图片格式，文件扩展名为.9.png，点九图片可以将图片横向和纵向同时进行局部拉伸，但依旧保持圆角大小不变、渐变质感和像素大小不失真。开发小哥哥只需要一套.9图就可以去适配安卓不同的分辨率，简直完美～
.9切图原理
对于.9切图我们只需要理解四个参数就行。
纵向内容显示区域
横行内容显示区域
纵向拉升区域
横向拉升区域
.9切图原理
拉升区域即为除了固定部分外（如圆角），可以自由拉升的部分。
内容显示区域，也就是信息（如文字）显示的区域。
看看下面这张图片就可以很好的理解内容显示区域了，其实可以理解为用来控制内边距的，想成里面的文本距离外面按钮盒子的padding就行。
对比文本距离左右的边距
左图横向内容显示区域包含了左右圆角，右图横向内容显示区域未包含左右圆角区域。采用左对齐，文本居住显示的方式，我们可以很明显的看到左图抵死了按钮边框，右图距离按钮边框的距离为圆角半径大小。
如何切.9图
一、手动切图
1.导入你需要切图的普通的png资源至ps中，直接在sketch里做也行。如果在sketch里面我们的图形有投影的话，建议导入ps里切更方便。
需注意的是，为了精简切图资源，我们应该尽量将拉升区域的大小缩小。因为拉升区域的大小无论你设置多大对于开发来说都是没有影响的。一般我们会用正方形的形式，不过你觉得麻烦不想调整你的资源大小都是没关系的，直接用你原有大小都是可以的，只要开发小哥哥能用你的.9图就行。
以我今天的栗子，我是在sketch里做的设计稿，卡片大小为345＊80px，圆角大小为8px，投影为0（x），2（y），4（模糊参数）。为了精简切图资源，我在做.9图时设置了一个40*40大小的正方形，圆角参与与投影参数保持与原卡片大小一致（圆角8px，投影Y2,模糊4)，然后导出到png到ps里，这里导几倍图可以具体的问问你的开发小哥哥，他需要几倍就行，按理导出几倍都无所谓的。
2.将画布大小上下左右各扩大1像素
上下左右多出1px是为了后面画黑线准备的。上下左右给扩充1px也就是在导出来的图片大小上，长宽各加2即可。
这里一定要注意是否有投影，比如我40*40大小的正方形，圆角8px，投影X0,Y2,模糊4，导出来的图片实际大小是48*48px，那么我在ps里调整画布大小应该为50*50px。
调整画布大小，上下左右各多1px
3.用一个像素的铅笔工具（颜色选择纯黑色），画出黑线段即可
需画的黑线段有：纵向内容显示区域、横行内容显示区域、纵向拉升区域、横向拉升区域
根据你想显示的内容区域来确定纵向内容显示区域与横行内容显示区域，拉升区域也就是你排除圆角后剩下的区域，拉升区域至少为1px。所以拉升区域的黑线段你画1px与10px都是一样的。
比如我想要的内容显示区域是包含圆角在内的，于是.9切图就为下面这样啦。
这两种.9切图方式达到的效果是一样的
二、网站在线生成
对于简单的扁平按钮、加了投影的按钮、卡片都是可以处理的。很方便。
我们只需要将我们的切片资源导出png格式，再导入这个网站，标注出我们想要的内容显示区域就行了。该网站会自动帮你画好黑线。
网址链接：
网友评论