關於 Android Layout 佈局
在 Android 開發中, 任何可視化的控制元件都是從android.view.View
繼承而來,系統提供了 xml
文件來配置 View
的相關屬性。
幾種常見的 Layout 佈局方式
- LinearLayout
- RelativeLayout
- FrameLayout
- AbsoluteLayout
- GridLayout
- TableLayout
LinearLayout - 線性佈局
特點 : 又可以分為垂直和水平佈局
參數可以為 vertical
或 horizontal
預設為水平佈局
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent">
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" /> </LinearLayout>
|
下圖所示的佈局,三個 TextView被水平擺放在一起。
如果 android:orientation
屬性變為 vertical
Layout Weight
LinearLayout 有一個特別的屬性 layout_weight
,可以根據此屬性來配置空間,它會將Layout的剩餘空間來進行weight的配置。
舉例來說 :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent">
<TextView android:background="#BB0000" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="TextView1" android:layout_weight="1"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="TextView2" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="TextView3" /> </LinearLayout>
|
當將第一個TextView的 layout_weight
屬性設置為 1
,他將會將剩餘的空間全部佔滿。
當我將 TextView2
也加入 android:layout_weight="1"
時。
會發現整個Layout的寬度會在扣掉剩餘的元件寬度後,那麼剩餘的空間分配給有 layout_weight
屬性的元件,由於這邊的範例兩個有設定的 weight
皆為 1
所以這邊簡單整理一下計算的方式
剩餘寬度(高度)
= Layout寬度(高度)
- 沒設定的元件寬度(高度)
接著 剩餘寬度(高度)
去讓有設定weight的元件均分
假設 :
TextView1
設定 android:weight="1"
TextView2
設定 android:weight="2"
TextView1
的 佈局寬度(高度)
就會是 1/1(1+2) = 1/3
* 剩餘寬度(高度)
TextView2
的 佈局寬度(高度)
就會是 1/1(1+2) = 2/3
* 剩餘寬度(高度)
其他屬性
android:layout_width
: 設置元件的基本寬度,可選屬性有 match_parent
、 wrap_content
。其中 match_parent
代表元件寬度與父元件一樣(減去padding
)。
android:layout_heigth
: 設置元件的基本高度。可選屬性與layout_width
相同。