很多朋友說看了網(wǎng)上很多關于點九的文章，越看越糊涂，之前也有答應大家，科普一下點九圖，所以今天文章來啦！

先來看看大綱：

1. 什么是點九圖

2.點九圖的作用是什么

3.點九圖的原理

4.總結

1. 什么是點九圖

點九圖其實就是安卓系統(tǒng)中特有的一種圖片格式，為了讓大家更好的記住，我們只要知道，后綴名是“.9.png"的圖片，就是點九圖。

2.點九圖的作用是什么

每個事物都有其存在的價值，所以先弄清楚點九圖能為我們解決什么問題，這樣后面理解起來就會容易很多。

其實點九圖的用處就是幫助我們拉伸切圖的，比如這個切圖：

如果它需要縱向拉伸，直接拉會變成下面這個樣子：

而用了點九圖就可以讓切圖局部拉伸，而不是整體拉伸，這樣就可以把容易變形的地方保護起來：

是不是拉伸的很完美！有黑線不用怕，那只是告訴安卓系統(tǒng)：“嘿，大兄弟，這是張點九圖，特殊對待一下！”

3.點九圖的原理

點九圖最大的原則就是四個邊必須各有一條純黑的線（或一像素的點），如下圖：

如果四條線少任何一條，或者線不是純黑的（#000000），安卓系統(tǒng)就不認你！

其中這四條線，左上兩條線掌管可拉伸區(qū)域，右下兩條線掌管內(nèi)容顯示區(qū)：

先說左上兩條線，因為兩條線原理是一樣的，所以我們單獨拿左邊這條線來舉例吧，當我們沒有左邊那條黑線時，縱向拉伸是這樣的：

圓角是不是變形了，如果左邊加一條黑線，就相當于把原來的圖形分為三個部分：

當再次縱向拉伸的時候，只有標記了黑線的部分可以被拉伸，而上下兩部分是完好無損的，想象一下，無論你拉伸到多高，是不是都不會變形了：

當然，你左邊畫一個點也可以起到相同的效果：

左邊這條線是控制縱向拉伸的，所以上面那條黑線就是控制橫向拉伸的，原理是一樣的！

接下來我們來說右下兩條線，是控制內(nèi)容區(qū)域的，單獨拿右邊那條線來舉例，如果沒有右邊那條黑線，在這個切圖上輸入內(nèi)容，比如文字，是沒有限制的，內(nèi)容會撐滿整個背景圖：

當有了右邊那條黑線后，切圖相當于在縱向上又被分開了：

而這次是右邊有黑線哦，別忘了右邊的黑線是控制顯示區(qū)域的，所以只有帶黑線的部分才可以顯示內(nèi)容

當然，文字不會這樣被切斷一半顯示的，這里只是方便大家觀看哪里可以顯示內(nèi)容！

同樣的原理，當我下面也畫一條線后，橫向上也是只有帶黑線的部分可以顯示內(nèi)容（紅線是輔助示意的哈）：

這就是點九的基本原理了！

4.總結

最后總結幾個要點：

1.點九切圖四周必須要有四條一像素純黑的線或點

2.左上兩條線控制拉伸區(qū)，右下兩條線控制內(nèi)容區(qū)

3.輸出的圖片后綴必須是“.9.png"

至于用插件還是自己手動切點九圖，看自己習慣吧，我一般都是自己畫，比較放心一點。

好了，今天就講這些了，我猜你應該大概明白了，如果沒明白，再看一遍吧。

科科！