Android頂部標題欄的佈局設計

自定義標題欄

通常我們的活動頁面都會根據需要都會有不同的標題欄需要選擇，一般有兩個場景，一個是統一標題欄，通過引入佈局到活動來進行重復使用，還有一個就是你的活動頁面每個都需要定制的，就不能統一風格瞭。

佈局與九宮格背景圖

下面講講佈局與九宮格的一些搭配。

佈局

常用設計標題欄的佈局都是通過流式佈局來進行的。為什麼呢？是不是覺得有時候流式佈局反而更麻煩一點。標題欄一般都是有控件依賴關系的。為什麼不采用相對佈局呢？相對佈局不就是解決依賴關系的麼？是，但是有個設計的小技巧。相對佈局的確對依賴關系是有很好的適用性。但是要考慮到項目需求的變更。你一開始設計的，可能是覺得位置都合適瞭。但是現在需求變更瞭呢，有些控件需要進行改動的話，是不是發現很麻煩，加入或者刪除都有可能會讓你的佈局全都打亂，需要重新指定依賴關系。

那流式佈局是怎麼完成依賴關系的呢？我們可以給他加個view來進行隔開。通過權重進行分配，一樣可以實現相對佈局的效果。用一個0.1dp高度的view就可以分割開瞭。

當然這也不是絕對的，不是說一定要用流式會好一點，相對於大多數場景的標題欄都是比較簡單的擺放，所以用流式也可以。但是如果啊，如果你的標題欄的控件又要水平擺放的，又要垂直擺放的，這種情況下，還想使用流式佈局就需要進行佈局嵌套瞭，相對來說開銷會增大。如果是這種情況的話，我可能會覺得相對佈局好點。

那是不是因為控件的依賴關系就不太想使用相對佈局瞭呢？其實不然，相對佈局最合適使用的地方，我覺得就不是相對控件的依賴關系（大范圍指定控件），而是相對佈局的依賴關系。這個就顯得更加有用瞭。通常我們的頁面也會有listview這些列表類的滾動場景，還會有使用系統軟鍵盤進行輸入的場景，如果我們不指定佈局之間的依賴關系而采用流式佈局這些，你就會發現，點擊輸入框彈出鍵盤的時候，你的頁面底部就被鍵盤頂上去瞭，頁面控件顯示不全，這是因為高度發生瞭改變。當然你也可以自定義監聽事件，對高度進行檢測，再做邏輯處理。

總結：在設計佈局的時候，相對佈局盡量是相當於父佈局上下左右進行相對。小的依賴關系盡量使用流式佈局解決，類似於簡單的標題欄，便於後期的維護。

九宮格圖片

那講完佈局，與九宮格照片又有什麼關系呢？
先說下九宮格圖片，知道的朋友可以跳過。

首先是它的由來，技術的進步從來都是按需前進的。有這個東西就說明是遇到瞭什麼問題。那問題是什麼呢？

我們將某張圖片設置為視圖背景時，如果圖片尺寸太小，系統則會自動拉伸圖片使之填滿背景。可以一旦圖片拉的過大，其畫面就容易變得模糊。為瞭解決這個問題，Android就設計瞭這個點九圖片。它的擴展名是png，文件名後面常有“.9”字樣。該圖片劃分成瞭3*3的區域。如果背景是一個形狀圖形，它的stroke節點的width屬性已經設置瞭固定數值（如）1dp，那麼無論該圖形怎麼拉伸，描邊寬度始終是1dp。點九圖片的實現原理與之類似，即拉伸圖形時，隻拉伸內部區域，不拉伸邊緣線條。

下面就是一個九宮格的背景圖片：

左邊是加工區域，右邊是圖片預覽區域，從上到下一次是縱向拉伸，橫向拉伸、兩方向同時拉伸的預覽圖片模式。在左側窗口圖片四周的馬賽克處單擊會出現一個黑點，把黑點左右或者上下拖動出一條黑線，不同的方向上的黑線就會表示出不同的效果。

左邊黑線是指垂直方向的拉伸區域。垂直方向拉伸圖片時，隻有黑線區域內的圖像會進行一個拉伸，不在黑線內的區域就不拉伸，還是維持原狀，這樣就能保證上下兩側的邊框厚度不變。

上邊黑線是指水平方向的拉伸區域。與上面是同理。水平拉伸，黑線內拉伸，黑線外不拉伸。

下邊黑線是指該圖片作為控件背景時，控件內部的文字左右邊界就隻能放在黑線區域內。如上圖。這樣的話，就會自動的有瞭android:paddingLeft和android:paddingRight的效果瞭。相當於自動為你添加瞭。

右邊黑線於上邊同理。隻不過是方面不同。這裡就相當於上下的邊界在黑線內瞭。同樣是相當於自動添加瞭android:paddingTop與android:paddingBottom的效果。

那是不是與我們的佈局就很搭配瞭，我們通常標題欄之類的也需要設置一個顏色，那麼九宮格圖片就能很好的幫助到你，通過簡單的黑線，你就可以減少一些設置上下左右邊界的代碼瞭，是不是覺得變簡單瞭？

還有一點要註意的是，九宮格圖片如果設置為視圖背景的時候，而且是指定瞭Horizontal Padding和Vertical Padding，那麼視圖內部將一直與視圖邊緣保持固定的間距，無論怎麼調整xml文件和java代碼都是不行的。因為是九宮格圖片設置的padding。

我們還可以給內部的控件設置一些狀態列表背景進行改變， 這樣在點擊控件或者獲取焦點的時候就可以，有一個明顯的效果出來。

總結

到此這篇關於Android頂部標題欄的佈局設計的文章就介紹到這瞭,更多相關Android標題欄佈局內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：

• Android利用ContentProvider讀取短信內容
• Android自定義彈窗提示效果
• Android利用SoundPool實現音樂池
• Android自定義View實現隨機數驗證碼
• Android中ScrollView監聽滑動距離案例講解