androidandroid-constraintlayoutandroid-textinputlayout

layout_constraintHorizontal_weight = 1 in ConstraintLayout is not Working

TextInputEditText in TextInputLayout equal width in ConstraintLayout using wight property. used layout_constraintHorizontal_weight = 1 is not work.how to give same width using weight property to Textinputlayout. This is give below result.

enter image description here

I want to below result :

enter image description here

xml code is :

<androidx.constraintlayout.widget.ConstraintLayout
    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="match_parent">


    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilFirstName1"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"


        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="32dp"

        app:layout_constraintHorizontal_weight="1"
        app:boxBackgroundMode="outline"
        app:endIconMode="clear_text"
        app:hintEnabled="false"
        app:layout_constraintEnd_toStartOf="@+id/tilLastName1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etFirstName1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:background="@drawable/custom_edittext_input"
            android:hint="First Name"
            android:inputType="textPersonName" />
    </com.google.android.material.textfield.TextInputLayout>



    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilLastName1"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="32dp"

        app:boxBackgroundMode="outline"
        app:endIconMode="clear_text"
        app:hintEnabled="false"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etLastName1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/custom_edittext_input"
            android:hint="Last Name"
            android:inputType="textPersonName" />
    </com.google.android.material.textfield.TextInputLayout>

</androidx.constraintlayout.widget.ConstraintLayout>
Solution

  • I made a few modifications to your code to end up with this. The trick it to constrain the end of the first firstName1 to the start of lastName1 and do the opposite for lastName1 and distribute the margins between them at the boundary.

    enter image description here

    <androidx.constraintlayout.widget.ConstraintLayout 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="match_parent">

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilFirstName1"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="32dp"
        android:layout_marginEnd="8dp"
        app:boxBackgroundMode="outline"
        app:endIconMode="clear_text"
        app:hintEnabled="false"
        app:layout_constraintEnd_toStartOf="@+id/tilLastName1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etFirstName1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/custom_edittext_input"
            android:hint="First Name"
            android:inputType="textPersonName" />
    </com.google.android.material.textfield.TextInputLayout>


    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilLastName1"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:layout_marginTop="32dp"
        android:layout_marginEnd="8dp"
        app:boxBackgroundMode="outline"
        app:endIconMode="clear_text"
        app:hintEnabled="false"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/tilFirstName1"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etLastName1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/custom_edittext_input"
            android:hint="Last Name"
            android:inputType="textPersonName" />
    </com.google.android.material.textfield.TextInputLayout>

</androidx.constraintlayout.widget.ConstraintLayout>