4.5 元件位置與距離

元件的間距 margin

每一個元件都可指定其上下左右與其他元件的距離,稱之為「Margin」 外間距,「android:layout_margin」為其屬性名稱,可以統一設定四個方向的間距,亦可個別設定。

假設希望本例的第二顆按鈕與下方第三顆按鈕有 30 點的間距,請先選擇第二顆按鈕,在其屬性表中找到「layout:margin」屬性後展開,可設定 bottom 值為「30dp」,如下圖:

輸入完後按下 Enter 鍵,即完成設定,預覽圖如下:

元件的對齊

為元件設定「layout:gravity」屬性,可決定元件在容器中向那個方位靠攏,請選擇第一顆按鈕,找到屬性表中的 layout:gravity 屬性後展開,再勾取「center_horizontal」,代表本按鈕對齊為水平置中,如下圖:

預覽圖如下,第一顆按鈕的 layout:gravity 屬性在設定為水平置中:

另一個與 layout:gravity 屬性很像的屬性為「gravity」,假如在一個版面中有很多個元件,想要每個元件都以同一種方式對齊,要一個個去設定實 在太繁複了,「gravity」屬性提供給版面配置或容器統一設定裏面元件的對齊方式,只要設定版面即可。

請選擇範例的 LinearLayout,找到屬性表中的 gravity 屬性後展開,勾 選「center_horizontal」如下圖:

預覽效果如下,所有在 LinearLayout 中的元件都水平置中了:

LinearLayout 中的權重 weight

當我們在 LinearLayout 中放入多個元件時,可利用屬性「weight」權重, 為元件分配不同的權重值,其預設值為 0。透過分別設定在 LinearLayout 內的元件的權值值,可依權重分配元件可以占用的空間,例如一個水平的 LinearLayout 人的三個 Button,權值為分別為 1, 2, 3 時,其配置結果如下圖:

原始碼如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal">
<Button
android:text="Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="@+id/button"
android:layout_gravity="center_horizontal"
android:layout_weight="1"/>
<Button
android:text="Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="@+id/button2"
android:layout_marginBottom="30dp"
android:layout_weight="2"/>
<Button
android:text="Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="@+id/button3"
android:layout_weight="3"/>
</LinearLayout>

那如果需要每個元件平均分配,占據整個 Layout 的區域呢 ? 可將每個元件的權重值設定為非零的同一個值,如 1.0 或 3.0 都可以,平均分配的結果預覽如下圖,三個 Button 元件的權重值都是 1.0: