在做本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>