建立線性版面配置

嘗試 Compose 方法
Jetpack Compose 是 Android 推薦的 UI 工具包。瞭解如何在 Compose 中處理版面配置。

LinearLayout 是檢視區塊群組,可將所有子項依單一方向 (垂直或水平) 對齊。您可以使用 android:orientation 屬性來指定版面配置方向。

圖片顯示將版面配置分割成三個垂直切片
圖 1.包含三個水平導向子項的 LinearLayout

LinearLayout 的所有子項都會依序堆疊,因此無論寬度為何,垂直清單的每一列都只有一個子項。水平清單的高度只有一列,且是最高子項的高度加上邊框間距。LinearLayout 會遵循每個子項之間的「邊界」和每個子項之間的「重力」(靠右、置中或靠左對齊)。

版面配置粗細

LinearLayout 也支援使用 android:layout_weight 屬性,將「權重」指派給個別子項。此屬性會根據檢視畫面在螢幕上所佔的空間大小,將「重要性」值指派給檢視畫面。較大的權重值可讓展開,以填滿父項檢視畫面的剩餘空間。子檢視畫面可以指定權重值,而檢視區塊群組中的其餘空間則會根據宣告的權重,按比例指派給子項。預設權重為零。

均等分布

如要建立讓每個子項在畫面中使用相同的空間的線性版面配置,請為垂直版面配置將每個檢視畫面的 android:layout_height 設為 "0dp",或者為水平版面配置將每個檢視畫面的 android:layout_width 設為 "0dp"。然後將每個檢視畫面的 android:layout_weight 設為 "1"

不等分布

您也可以建立線性版面配置,讓子元素在畫面上使用不同大小的空間。請見以下範例:

  • 假設您有三個文字欄位:兩個文字欄位的權重值為 1,第三個文字欄位的權重為 0,第三個文字欄位 (權重值為 0) 只會佔用內容所需的區域。其他兩個文字欄位 (權重值為 1) 會均等展開,以便填滿三個欄位內容之後剩餘的空間。
  • 假設您有三個文字欄位,其中兩個的權重值為 1,第三個欄位的權重為 2,則系統會測量以下兩者的權重:一半到權重值為 2 的欄位,和權重值為 1 的欄位之間平均分配一半。

以下圖表和程式碼片段說明版面配置權重在「傳送訊息」活動中的運作方式。「To」(收件者) 欄位、「Subject」(主旨) 行和「Send」(傳送) 按鈕只佔用所需的高度。訊息區域會佔用活動的其餘高度。

這張圖片顯示垂直方向 LinearLayout 中的三個 EditText 和 Button
圖 2 三個文字欄位和垂直導向 LinearLayout 中的按鈕。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" >
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/to" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/subject" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="top"
        android:hint="@string/message" />
    <Button
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_gravity="end"
        android:text="@string/send" />
</LinearLayout>

如要進一步瞭解 LinearLayout 每個子檢視畫面可用的屬性,請參閱 LinearLayout.LayoutParams