線形レイアウトを作成する

Compose をお試しください
Jetpack Compose は、Android で推奨される UI ツールキットです。Compose でレイアウトを扱う方法について説明します。
Column または Row →

LinearLayout は、すべての子を垂直または水平の一方向に揃えるビューグループです。 android:orientation 属性でレイアウトの方向を指定できます。

レイアウトが 3 つの垂直スライスに分割されている画像
図 1.3 つの子ビューが水平方向に配置された LinearLayout。

LinearLayout のすべての子ビューは順にスタックされるので、垂直方向のリストには、幅に関係なく、1 行に 1 つの子ビューしかありません。一方、水平方向のリストは、1 行分の高さしかありません（最も高い子ビューの高さ + パディング）。LinearLayout は子ビュー間の「マージン __」と、それぞれの子ビューの「グラビティ __」（右揃え、中央揃え、左揃え）を遵守します。

レイアウト ウェイト

LinearLayout では、weight を 個々の子ビューに android:layout_weight 属性で指定することもサポートされます。この属性は、画面上で占めるスペースという観点で「重要度」を表す値をビューに指定します。この weight 値が大きいほど、親ビューの残りのスペースを埋めるように拡大されます。子ビューに weight 値を指定することで、ビューグループの残りのスペースを、宣言された weight の割合に応じて割り当てることができます。デフォルトの weight 値は 0 です。

均等配分

それぞれの子ビューが画面上で等しいスペースを占める線形レイアウトを作成するには、垂直レイアウトの場合は各ビューのandroid:layout_heightを"0dp"に、水平レイアウトの場合は各ビューのandroid:layout_widthを"0dp"に設定します。次に、各ビューの android:layout_weight を "1" に設定します。

不均等配分

子要素が画面上で異なるスペースを占める線形レイアウトを作成することもできます。以下の例を考えてみましょう。

  • 3 つのテキスト フィールドがあり、そのうち 2 つの weight 値が 1 で、3 つ目の weight 値がデフォルトの 0 であるとします。weight 値が 0 の 3 つ目のテキスト フィールドは、そのコンテンツが必要とする面積だけを占めます。weight 値が 1 の他の 2 つのテキスト フィールドは、3 つのフィールドすべてのコンテンツのサイズを決めた後で残るスペースを等分します。
  • 3 つのテキスト フィールドがあり、そのうち 2 つの weight 値が 1 で、3 つ目の weight 値が 2 であるとします。この場合、3 つのフィールドすべてのコンテンツのサイズを決めた後で残るスペースは、weight 値が 2 のフィールドに半分、weight 値が 1 のフィールドに半分が均等に割り当てられます。

次の図とコード スニペットでは、レイアウト ウェイトが「メッセージ送信」アクティビティでどのように機能するかを示しています。[To] フィールド、[Subject] 行、および [Send] ボタンは、それぞれ高さを必要なだけ占有します。メッセージ領域は、アクティビティの残りの高さを占有します。

縦向きの LinearLayout に 3 つの EditText と 1 つの Button が配置されている画像
図 2.垂直方向に配置された 3 つのテキスト フィールドと 1 つのボタン。 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 をご覧ください。