How to keep two TextInputLayouts on single line consistent width

Question

I have two TextInputLayout on a single line. They take half of the screen each when rendered:

But if i type alot of text in one and less in the other, their width changes and one of them gets smooshed:

How do i keep them of the same ratio that they started with, no matter how much text were entered?

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <android.support.design.widget.TextInputLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </android.support.design.widget.TextInputLayout>

</LinearLayout>

use `android:layout_wight="1"` for both `TextInputLayout` – Shayan D Jul 21 '18 at 08:08 — Shayan D, Jul 21 '18 at 08:08

score 3 · Accepted Answer · answered Jul 21 '18 at 08:21

Do the following:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <android.support.design.widget.TextInputLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </android.support.design.widget.TextInputLayout>

</LinearLayout>

score 1 · Answer 2 · answered Jul 21 '18 at 08:25

1

Setting android:layout_width="0dp"for the TextInputLayout should do the trick.

Also you should use android.support.design.widget.TextInputEditText instead of EditText.

answered Jul 21 '18 at 08:25

Tobias

7,282
6
63
85

How to keep two TextInputLayouts on single line consistent width

2 Answers2