Search code examples
androidandroid-studioandroid-textinputlayout

Change Color Highlighted TextInputLayout and Raise the Height of the Hint

I'm working with a TextInputLayout in Android Studios, and when I click on it to type in text, it's highlighted green and the hint is covering some of the text I type. Is it possible to change the color and raise the hint to see the typed text? Thank you!

<com.google.android.material.textfield.TextInputLayout
        android:id="@+id/lastNameTextInputLayout"
        android:layout_width="168dp"
        android:layout_height="47dp"
        app:layout_constraintBottom_toBottomOf="@+id/firstNameTextInputLayout"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/firstNameTextInputLayout"
        app:layout_constraintTop_toTopOf="@+id/firstNameTextInputLayout">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/last_name" />
    </com.google.android.material.textfield.TextInputLayout>

enter image description here

Solution

  • Hint and Text overlap with each other because of static height android:layout_height="47dp"

    Change height to wrap_content android:layout_height="wrap_content"

    There are some attributes for changing background color and hint color:

    • For hint text color app:hintTextColor
    • For background color app:boxBackgroundColor
    • For stroke color app:boxStrokeColor

    Example Code:

     <com.google.android.material.textfield.TextInputLayout
            android:id="@+id/lastNameTextInputLayout"
            android:layout_width="168dp"
            android:layout_height="wrap_content"
            app:layout_constraintBottom_toBottomOf="@+id/firstNameTextInputLayout"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintStart_toEndOf="@+id/firstNameTextInputLayout"
            app:layout_constraintTop_toTopOf="@+id/firstNameTextInputLayout"
            app:boxBackgroundColor="@color/white"
            app:boxStrokeWidthFocused="1dp"
            app:boxStrokeColor="@color/black"
            app:hintTextColor="@color/black">
            <com.google.android.material.textfield.TextInputEditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Last name"/>
        </com.google.android.material.textfield.TextInputLayout>

    For more info regarding attributes of TextInputLayout check this link