前言
點(diǎn)9圖示一種可伸縮的位圖箫锤，如果你某個(gè)View用了點(diǎn)9圖做background搁痛，Android會(huì)根據(jù)點(diǎn)9圖的設(shè)置來(lái)自動(dòng)為你調(diào)整泞歉、適應(yīng)內(nèi)容逼侦。點(diǎn)9圖是標(biāo)準(zhǔn)的PNG格式圖像，被一圈1像素寬的邊緣包圍腰耙，并且保存的時(shí)候擴(kuò)展名一定要是“.9.png”榛丢，還要保存在“res/drawable/”目錄。
以上的官方對(duì)點(diǎn)9圖的介紹挺庞。
簡(jiǎn)單使用：
圖4是一個(gè)比較常見(jiàn)點(diǎn)9圖的使用晰赞，用這張點(diǎn)9圖做控件背景，控件會(huì)根據(jù)左邊點(diǎn)區(qū)域（圖4的點(diǎn)1）和上邊點(diǎn)區(qū)域（圖4的點(diǎn)2）做縱向和橫向的拉伸，拉伸后如圖5的效果掖鱼。這也是我們使用比較多的情況然走。
但接下來(lái)我要講的不是點(diǎn)9圖自動(dòng)拉伸的使用，而是講如何用點(diǎn)9圖來(lái)控制內(nèi)容顯示區(qū)域戏挡。
問(wèn)題
相信很多人在開(kāi)發(fā)過(guò)程中都有遇到過(guò)這樣的問(wèn)題芍瑞，設(shè)計(jì)切了一張下面帶陰影效果的Button背景圖，如果直接拿來(lái)設(shè)置Background褐墅，當(dāng)設(shè)置文本時(shí)用android:gravity="center"拆檬，你會(huì)發(fā)現(xiàn)文案會(huì)在背景偏下方的位置。如下圖：
原因相信大家也知道妥凳，因?yàn)楸尘皥D下方有陰影竟贯，所以整張圖（藍(lán)色框區(qū)域）的center自然不是我們想要的（紅色框）的center。此時(shí)你可能自己利用android:padding屬性來(lái)謾慢調(diào)整位置逝钥，或者讓設(shè)計(jì)在上方加透明邊切成對(duì)稱的實(shí)現(xiàn)居中屑那。
上面說(shuō)的問(wèn)題，其實(shí)也沒(méi)有什么工作量晌缘，幾行代碼可以搞定齐莲。那看看下面這個(gè)問(wèn)題
產(chǎn)品要求設(shè)計(jì)出如圖1，圖2的自定義控件磷箕，里面的內(nèi)容支持圖片數(shù)字拼接和文本选酗。設(shè)計(jì)給的背景圖如圖3，內(nèi)容只能顯示在圖3右邊的框內(nèi)并居中岳枷。
問(wèn)題來(lái)了芒填，此時(shí)再想讓控件里的內(nèi)容居中就比較麻煩了，首先控件背景圖是不規(guī)則的空繁，顯示內(nèi)容的區(qū)域偏右殿衰，android:gravity="center"肯定不行，另外文本的行數(shù)支持一行或兩行盛泡，數(shù)字拼接后的的圖片大小還不知道闷祥，不能通過(guò)android:padding寫(xiě)死，怎樣才能讓控件的內(nèi)容一直處在右邊區(qū)域的中心呢傲诵？
其實(shí)點(diǎn)9圖能很好地解決這種不對(duì)稱背景控制內(nèi)容位置的問(wèn)題凯砍。
點(diǎn)9圖控制內(nèi)容區(qū)域
如圖9，大家都知道點(diǎn)1和點(diǎn)2的作用拴竹，但是很多人卻忽略了右邊點(diǎn)區(qū)域（點(diǎn)3）和下邊點(diǎn)區(qū)域（點(diǎn)4）的作用悟衩，它們其實(shí)可以控制縱向和橫向的顯示區(qū)域。
上面問(wèn)題中提到的自定義控件的問(wèn)題栓拜，用背景圖設(shè)置成點(diǎn)9圖如下
如圖6座泳，點(diǎn)3和點(diǎn)4控制了縱向和橫向顯示的區(qū)域惠昔，此時(shí)它們橫縱相交的區(qū)域5就是內(nèi)容區(qū)域。如果用這張點(diǎn)9圖做控件背景挑势，系統(tǒng)只會(huì)在區(qū)域5繪制控件內(nèi)容镇防。
因此我們可以按照需求控制內(nèi)容顯示區(qū)域后，再設(shè)置android:gravity="center"薛耻，這樣無(wú)論里面的內(nèi)容怎么變化营罢，一行或兩行，系統(tǒng)繪制時(shí)都會(huì)放在內(nèi)容區(qū)域的中心饼齿，那個(gè)復(fù)雜的位置問(wèn)題就這樣輕松解決了饲漾。
同理，問(wèn)題的button文案居中問(wèn)題也可以用這個(gè)方法輕松解決缕溉。
點(diǎn)9圖能很好的解決這種不對(duì)稱背景的控制內(nèi)容的問(wèn)題考传。
END
