9patch制作.9.png图并应用到android实例中

在做本blog之前本人也从网上搜索了很多关于9patch的知识教程，当然包括himi的android游戏系列和博客园上的系列blog。内容大同小异，不过当时本人真的没有去绘制成功。并不了解如何操作，在此我将我的理解总结如下

 

 

概述

         9patch将png处理成可以拓展延伸的背景图，简略了css的编写和美工的工作。将.9.png图片设置为背景图android会根据我们绘制的区域和范围更直观的去应用一个我们定义好的内边距(类似padding)

 

 

最终成品效果图：

 

说明1：

         我们看到文本与背景图之间有一个距离(红色区域部分)，这个部分我们并未用padding属性去约束而是用了.9.png背景图的效果。系统会根据我们绘制的部分来自动创建内边距的效果

说明2：

         这个背景图完好无缺的拉伸成为文本的背景图，原来的背景图可能不是这样的像素高和宽。但是本图自动拉伸而且并未出现模糊现象，是的，这不是我们html的repeat的效果。而是这个图自动拉伸了，为什么?.9.png文件在android中就是有这个效果

 

 

 

制作过程：

         首先打开在D:\jars\android\android-sdk_r21.1-windows\android-sdk-windows\tools路径下的draw9patch.bat文件，当然这个是我的路径，自己测试运行的时候还要根据自己的来定。

 

制作截图：

 

说明：

         本图就是9patch的操作界面了，其中红色区域也就是左边和上边。表示改图延伸的区域。而右边和下边就是我们控制文件显示的区域了。我们看到右边和下边的黑色线条都并没有布满整个图的宽和高，这样就能够出现我们最终效果图的padding的效果。这样说你应该明白了。

 

 

如何操作：

         9patch的操作方式刚开始的时候我疑惑了很长时间，用鼠标拖动，按住shift或者ctrl都结果都没有什么效果，最终我看到了我圈住的黑色线条部分。对!!!没错，就是这一丁点区域，在这个区域内拖动鼠标即可。左键是绘制。右键是擦除！

本文Layout xml 文件

 

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:background="#777"

    android:padding="8dip"

    >

    <TextView

    android:layout_width="fill_parent"

    android:layout_height="wrap_content"

    android:text="正文:A NinePatchDrawable graphic is a stretchable bitmap image, which Android will automatically resize to accommodate the contents of the View in which you have placed it as the background. A NinePatch drawable is a standard PNG image that includes an extra 1-pixel-wide border."

    android:background="@drawable/bg"

    android:textColor="#000"

    />

</LinearLayout>