前言：
在工作當中，你總會遇到製作點9圖片的時候。我就在公司的新項目中遇到了。很多人說，這交給UI妹妹做就好了，爲啥要煩勞我們自己動手？第一呢，作爲程序員的我們，多學點東西是沒錯的。第二呢，UI妹妹做的點9圖片產生的效果不是你想要的。
一、製作點9圖片的工具
這個工具叫draw9patch,在我們Android sdk文件tools目錄下,如下圖：
二、製作點9圖片的原理
這是一張已經做好的點9圖片。
1號黑色條位置向下覆蓋的區域表示圖片橫向拉伸時，只拉伸該區域
2號黑色條位置向右覆蓋的區域表示圖片縱向拉伸時，只拉伸該區域
3號黑色條位置向左覆蓋的區域表示圖片縱向顯示內容的區域
4號黑色條位置向上覆蓋的區域表示圖片橫向顯示內容的區域
沒有黑色條的位置覆蓋的區域是圖片拉伸時保持不變（比如，如果圖片的四角爲弧形的時候，當圖片被任意拉伸時，四角的弧形都不會發生改變）
5、如果失誤多選了部分，可按住shift鍵，點擊鼠標左鍵去掉黑色條
6、右邊3個黑色圖形區域爲顯示當前拉伸效果（見後面的圖）
7、選擇好區域後，Ctrl+s，保存圖片，後綴名爲xxx.9.png
8、其實draw9patch的由來是因爲畫好之後的圖片被分成了9塊。如下：
在上面圖中的下面部分大家可以看到有以下幾個可以勾選的checkbox.
show lock :顯示不能操作的部分，一般我們只能操作圖片的四周。
show content :顯示內容部分，也就是右邊黑線和下邊黑線覆蓋的區域。
show patches : 圖片的9個部分
show bad patches :顯示圖片的壞點。（具體爲啥原因纔會有壞點，等你來解答吧��）
三、製作點9圖片的過程
下面是產品給的需求。要求選中按鈕和輸入框，都有一個藍框背景。如果是普通圖片的話，輸入框的那個右邊的勾勾就會變形。所以必須用點9圖片解決。
找到tools目錄，打開draw9patch，如下圖：
直接可以把想要製作的一張普通圖片拖進去，效果如下：
左邊是你要去操作的圖片，右邊是拉伸的效果。下面是我自己製作的全過程。
因爲圖片大小不能超過2M,所以錄製的時間不是很長。
可以看到剛開始右邊的勾勾是變形的，會被拉伸，當我弄好後，勾勾就恢復原形了，不會被拉伸了。大功告成。
四、遇到的坑。
我剛開始一直以爲製作點9圖片，只需確定拉伸部分就好，忽略了內容部分，所以在調節佈局的時候，就會出現問題。比如上面的那個需求，那個hot 圖片，我開始一直不能把它放到文字的右上方，一直在文字的正右邊。我就納悶了，我明明設置了 android:layout_alignParentRight=”true” android:layout_alignParentTop=”true”這兩個屬性。最終發現是點9圖片沒畫好。內容部分少畫了。當時內容部分只畫了這麼點，右上角的那部分不在內容區域，不能放置內容。
到這就結束了，希望多多交流！