android draw9patch的制作和使用總結

1.什么是“9妹”(9patch)？
它是一個對png圖片做處理的一個工具，能夠為我們生成一個"*.9.png"的圖片;
2.何為"*.9.png"?
所謂"*.9.png"這是Android os里所支持的一種特殊的圖片格式,用它可以實現部分拉伸；這種圖片是經過”9妹“進行特殊處理過的，如果不處理的話，直接用PNG圖就會有失真，拉伸不正常的現象出現。
3.它的用途是？
說到用途，這種特殊格式的png圖，我也看了網上的相關文章但都是用一個能自適應的button舉例子！(如下圖)清一色抄襲.. - -、
          (此實例咱們直接無視掉，在后面我會給大家灌輸游戲中實例)
這個例子是指當button上的字體大小改變，那么文字底下的png圖也會自動適應文字。
這似乎表明做Android 軟件應用 使用一些組件的的時候會時常用到；
       4.那么實際在游戲中到底如何使用呢？什么情況下去使用呢？
   ....當然啦，身為做游戲我一定要”9妹“利用在咱們游戲中才行，不然豈不是白研究了、經過思考突然想到了一些情況，并且發現“9妹”確實在游戲開發中占有一定的分量！下面我們來先熟習“9妹”工具，然后再跟大家舉例，貼圖來說明其用途、畢竟有圖有真相 呵呵~
啟動9妹：
在你Android SDK 路徑下 X:\android sdk\tools ,你會找到一個 【draw9patch.bat】,沒錯這就是9妹啦、官方名 NinePatch ；
          
提示導入一張png圖片，然后真正進入"9妹"的操作界面（如下圖）：     （圖1）
       
序 列 ① ：在拉伸區域周圍用紅色邊框顯示可能會對拉伸后的圖片產生變形的區域，如果完全消除該內容則圖片拉伸后是沒有變形的，也就是 說，               不管如何縮放圖片顯示都是良 好的。 （實際試 發現NinePatch編輯器是根據圖片的顏色值來區分是否為bad patch的，一邊來說只               要色差不是太大不用考慮這個設置。） 
序列 ② ：區域是導入的圖片，以及可操作區域。
序 列 ③ ：這里 zoom：的長條bar 是對導入的圖放大縮小操作，這里的放大縮小只是為了讓使用者更方便操作，畢竟是對像素點操作比較費                   眼，下面的 patch scale 是序列 ④區域中的三種形態的拉伸后的一個預覽操作，可以看到操作后的圖片拉伸后的效果。
序列 ④： 區域這里從上到下，依次為：縱向拉伸的效果預覽、橫向拉伸的效果預覽，以及整體拉伸的效果預覽
序列 ⑤： 這里如果你勾選上，那么當你鼠標放在 ② 區域內的時候并且當前位置為不可操作區域就會出現lock的一張圖,就是顯示不可編輯區域 ;
序列 ⑥： 這里勾選上，那么在④ 區域中你就會看到當前操作的像素點在拉伸預覽圖中的相對位置和效果。
序列 ⑦： 在編輯區域顯示圖片拉伸的區域;
如何操作：
鼠標左鍵選取需要拉伸的像素點；  shift+鼠標左鍵取消當前像素點。
操作區域：
                                     
     大家看到導入的png圖片默認周圍多了一像素點，也就是這一圈一像素點就是咱們的可操作區域。但是因為下方和右方可操作區域屬于可選區域，不用理會；主要大家注意Left 和 top 操作區域；
     Top操作區域的一排像素點，表示橫向拉伸的像素點； 

     Left操作區的一排像素點，表示縱向拉伸的像素點；

以上摘自李華明博客

首先說一下9 path是什么。9path是android特殊格式的png圖，它以.9.png為后綴名。

它用在使用圖片做背景時做拉伸使用的，9path會選擇一個背景圖片中的一部分在拉伸時做平鋪，其他區域保持原始大小，來組合成一張新的背景。當然也可以用在設置圖片的時候設置的圖片超過原始大小時，將其中的部分做平鋪，其他區域保持不變。

怎么得到9path圖片？

使用android sdk中自帶的工具

雙擊打開。

點擊file，打開一張普通的png圖片。

序列 ① ：在拉伸區域周圍用紅色邊框顯示可能會對拉伸后的圖片產生變形的區域，如果完全消除該內容則圖片拉伸后是沒有變形的，也就是說，不管如何縮放圖片顯示都是 良 好的。 （實際試 發現NinePatch編輯器是根據圖片的顏色值來區分是否為bad patch的，一邊來說只要色差不是太大不用考慮這個設置。）

序列 ② ：區域是導入的圖片，以及可操作區域。

序列 ③ ：這里 zoom：的長條bar 是對導入的圖放大縮小操作，這里的放大縮小只是為了讓使用者更方便操作，畢竟是對像素點操作比較費眼，下面的 patch scale 是序列 ④區域中的三種形態的拉伸后的一個預覽操作，可以看到操作后的圖片拉伸后的效果。

序列 ④： 區域這里從上到下，依次為：縱向拉伸的效果預覽、橫向拉伸的效果預覽，以及整體拉伸的效果預覽

序列 ⑤： 這里如果你勾選上，那么當你鼠標放在 ② 區域內的時候并且當前位置為不可操作區域就會出現lock的一張圖,就是顯示不可編輯區域 ;

序列 ⑥： 這里勾選上，那么在④ 區域中你就會看到當前操作的像素點在拉伸預覽圖中的相對位置和效果。

序列 ⑦： 在編輯區域顯示圖片拉伸的區域;

操作：鼠標左鍵選取需要拉伸的像素點；  shift+鼠標左鍵取消當前像素點。

如下圖：新導入的png文件在周圍會多出一個像素點，這一圈一像素點是我們的操作區域

這里需要注意一點就是，必須左邊和上邊都得有黑線，如果只有一邊有黑線的話，生成的png文件在eclipse中會報錯。另外要注意內容區域的標記不能有間斷，也就是說標記要連續且僅有一處，否則.9.png圖片在放入項目下會報錯。

主要大家注意Left 和 top 操作區域；

Top操作區域的一排像素點，表示橫向拉伸的像素點；

Left操作區的一排像素點，表示縱向拉伸的像素點；

保存：點擊file中的保存，直接寫文件名即可，默認會保存在“我的文檔”目錄下，這個目錄可以調整，保存完成之后就可以看到一個以.9.png為后綴的圖片了，如下圖：

可以看到這張圖的左側和上部都有一條黑線。

使用：直接放在你的功能下的drawable目錄或者其他drawable目錄下即可。使用的時候直接在xml文件中使用，例如：

<TextView android:id="@+id/swithCity" 
    android:background="@drawable/cityswitchback"android:layout_width="wrap_content" 
    android:layout_height="wrap_content" android:text="切換城市" 
    style="@style/text03" android:gravity="center"> 
</TextView>

效果圖如下：