はみ出たレイアウトを収める法方

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textSize="16sp"
        android:text="お名前"/>

    <EditText
        android:id="@+id/name"
        android:layout_width="350dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:padding="10dp"
        android:textSize="16sp"
        android:hint="かな" />
</LinearLayout>

上記のレイアウトは普通のスマホでは画面の中に収まるが、設定で文字や表示サイズを大きくするとEditTextが横にはみ出してしまう。レイアウト崩れを防ぐ方法をメモする。

1 EditTextの横幅を狭くする。

EditTextの横幅を250dpに小さくすることでそもそもの表示サイズが小さくなり表示サイズを上げてもはみ出さない。ただし元の大きさの横幅はせまくなる。

2 LinearLayoutをConstraintLayoutに変更する

LinearLayoutをConstraintLayoutに変更して固定幅に変更。中身それぞれに制約をつけることによってはみ出しを防ぐ。

2 TextView側に横幅を設定する

TextViewを固定幅にしつつEditTextを可変にすることで、表示サイズを上げてもはみ出さないようになる。TextViewは文字固定なので、レイアウトを大きくしてもはみ出すことはない。

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:layout_width="350dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textSize="16sp"
        android:text="お名前"/>

    <EditText
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:maxWidth="350dp"
        android:padding="10dp"
        android:textSize="16sp"
        android:hint="かな" />
</LinearLayout>