material-components / material-components-android

Modular and customizable Material Design UI components for Android
Apache License 2.0
16.35k stars 3.06k forks source link

[TextInputLayout] Height is wrong when used in a DialogFragment using ConstraintLayout, expandedHintEnabled=false and layout_width=0dp #2330

Closed nibarius closed 2 years ago

nibarius commented 3 years ago

Description: Using a TextInputLayout with app:expandedHintEnabled="false" works fine in a normal fragment, but when using it in a DialogFragment using ConstraintLayout the height of the TextInputLayout becomes larger the longer the placeholder text is. When using a 1 character placeholder text the height is correct, when the placeholder text length is 2 the height is enough for 2 lines of text, with a length of three the height is suitable for 3 lines and so on.

alert_dialog

For this to reproduce the layout_width has to be set to 0dp. If using a fixed width, match_parent or wrap_content it does not reproduce.

Expected behavior: The height of the TextInputLayout should be suitable for one line of text when the placeholder text is short enough to fit on one line.

Source code: Dialog fragment class:

class TestDialogFragment : DialogFragment() {
    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        return AlertDialog.Builder(requireContext())
            .setMessage("Alert dialog")
            .setPositiveButton("OK", null)
            .setNegativeButton("Cancel", null)
            .setView(layoutInflater.inflate(R.layout.dialog_test, null))
            .create()
    }
}

Creating the dialog:

TestDialogFragment().show(childFragmentManager, "dialog")

dialog_text.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingHorizontal="16dp"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:hint="TextInputLayout"
        app:placeholderText="abcd"
        app:expandedHintEnabled="false">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:singleLine="true" />
    </com.google.android.material.textfield.TextInputLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Android API version: 30

Material Library version: 1.4.0 and 1.5.0-alpha01

Device: Pixel 5 and x86_64 emulator

To help us triage faster, please check to make sure you are using the latest version of the library.

We also happily accept pull requests.

nibarius commented 3 years ago

Trying to work around this issue by using a RelativeLayout or a LinearLayout instead of a ConstraintLayout shows a different, but somewhat similar problem. If the placeholder text is shorter than the title / message of the dialog everything works fine, but if the placeholder text is longer than the title the TextInputLayout becomes high enough to fit two lines of text. Not sure if it's the same issue or something that's better to report as a separate issue.

relative_layout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    android:paddingHorizontal="16dp">

    <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:hint="TextInputLayout"
        app:expandedHintEnabled="false"
        app:placeholderText="placeholder text is longer than the title">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:singleLine="false" />
    </com.google.android.material.textfield.TextInputLayout>
</RelativeLayout>
drchen commented 2 years ago

Is this still an issue with the latest library version? I copied your code without any modification and I cannot really reproduce it.

If it's still reproducible, can you provide a minimum reproducible sample for us to debug? Thanks!

nibarius commented 2 years ago

I can reproduce the issue in version 1.5.0 but not in 1.7.0-alpha01 so it's seems to have been fixed recently.

drchen commented 2 years ago

Awesome! Thanks for the confirmation. I'll close the issue. : )