draw9patch工具和9-patch图片精炼详解

一、前期基础知识储备

（1）9-patch图片定义——Android SDK提供的解决应用开发过程中和UI相关的制作自适应背景图片的问题（就是一个使用9-patch制作的PNG图篇拉伸之后，失真幅度更小，非常适合开发使用）。实际工作中，会由UI设计师做好，然后开发者直接使用即可；若是开发者想自己平时开发练习使用，也可以学习如何制作9-patch图片。

（2）Android studio默认安装路径在哪里？

Android studio默认安装过程中的一些路径：

SDK路径——C:\Users\Administrator\AppData\Local\Android\sdk

软件安装路径——C:\Program Files\Android\Android Studio

默认工程目录——C:\Users\Administrator\AndroidstudioProjects

二、从0开始制作9-patch图片

使用Draw 9-patch工具可以允许你容易的创建NinePatch图像，以下步骤指导你使用Draw 9-patch工具，由PNG图像创建9Patch图像。

（1）通常开发者需要在自己的电脑上安装目录下找到SDK/tools目录，启动draw9patch程序——默认路径：C:\Users\Administrator\AppData\Local\Android\sdk\tools，然后在文件夹找到draw9ptch.bat，单击打开，如果出现的是一个黑窗口，恭喜你，没有配置环境变量。在此提供两种解决方法：

1）①配置环境变量找到jdk的安装目录，像配置java环境一样，把%jdk\\bin添加到环境PATH中；

②在android studio中File-->Open...选择安装的android sdk中tools下的draw9patch.bat,打开后，把

set java_exe=

call lib\find_java.bat

if not defined java_exe goto :EOF

改成

set java_exe=%jdk\\bin\java.exe

③可以使用之后点击draw9patch.bat刚开始打开的还是cmd.exe，等下就可以处理图片了。

2）笔者亲测可以解决问题——①打开SDK/tools，新建文本文档，打入java -jar %~dp0\lib\draw9patch.jar后，左上角文件->另存为my9patch.bat（注意，这里要带上bat后缀，这个bat也放在SDK/tools文件夹下）

②双击my9patch，然后会出现一个命令提示符，大概10秒后就会出现draw-9-patch的可编辑界面，在使用过程中，不要关闭命令提示符

 

（2）开发者不熟悉PS的话，可以使用Windows系统自带的画图软件制作PNG图片；

注：图片要求是PNG格式的

 

（3）加载PNG图像到Draw 9-patch窗口，工作区域就打开了；

 

（4）在图像的左边和上边的周边，左键选择拉伸区域和内容区。使用shift+左键取消选择的区域；

 

注意：9-patch图片实际上是9块，黑色标注的左边和上边，就是可以选择可以拉伸的区域，而上图中用紫色圈住的四个边角，是不能缩放的

（5）保存你的图像。图像的后缀名是.9.png。

小结：实际开发中，9-patch的使用是非常常见的，比如某QQ和某微信中聊天时发送消息的承载消息气泡，可以根据内容的大小进行缩放，气泡使用的就是9-patch图片PNG格式的图片，可以随着内容的变化进行缩放。所以对于开发者来说，与9-patch打交道的时间不会少，可能我们不能像UI同事交互同事一样，制作精美的图片，但至少，一般程度的draw9patch还是要熟悉的。

                      

三、示例：制作一张占位图9_match图

当然实际开发中更常见的是UI同事已经设计好一张图片，此时需要转换为9_match图，这个时候就不用利用原生工具改造那么麻烦了，直接使用Android Studio自带的转换png图片的功能即可，以下是详细步骤：

需要转换为9_patch的原始png图片：要求：logo部分和文字部分大小不会被拉伸

①res下创建drawable_nodpi文件夹，用以存放转换好的9_patch图；

②选择drawable下需要转换为9_patch图的原始PNG图片；

右键，选择“Create 9_patch file ”,在接下来的弹窗中选择刚刚创建的drawable_nodpi文件夹存放创建的图片

  

③开始制作.9图；

默认状态下，图片的四条边都是可以任意拉伸的，即四条边都是选中的状态，此时，四条边全都是黑色的，我们需要中间的log图和文字不会拉伸，而其他区域则可以任意拉伸，这时，我们只需要找出不需要拉伸的区域，按住shift，左键开始选择，选中上边和左边的白色区域即可。

效果如下图：中间区域的图片和文字不会拉伸，其余部分任意拉伸。

最后，说一下，学会使用9_patch图意义重大：

1）自适应分辨率，减小apk包体积：一张可以自动拉伸不会变形的.9图即意味着可以做到自适应，那么我们就不必要为每个分辨率做一套图标，原本需要适应分辨率的几张图片只用一张自适应分辨率的.9图即可，减少图片使用，这对减小包体积意义非凡；

（上百个类文件占1M顶天了，72*72分辨率的小图标，不压缩200KB一张，一张小图标抵20个类文件毫不夸张，尽量减少图片的使用绝对是减小APK体积的一大利器）

2）减小apk包体积：单张.9图大小小于原始PNG图片。

  23.5KB   19.9KB