TextInputLayout - make it clickable with working ripple effect

595 views Asked by At

I want that my TextInputLayout has following functions:

  • open a dialog on click
  • show a ripple background like e.g. the ExposedDropdownMenu style does

It should look like a TextInputLayout but work like a Button.

Code

What I have so far is following:

 <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/tilPlannedStartTime"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/planned_start_time"
    android:padding="8dp">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/tielPlannedStartTime"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:editable="false"
        android:clickable="true"
        android:focusable="false"
        android:singleLine="true" />

</com.google.android.material.textfield.TextInputLayout>

And following:

binding.actvPlannedStartTime.setText(workout.item.plannedStartTime?.toString(SimpleTime.Format.DisplayHM) ?: "-")
    binding.tielPlannedStartTime.setOnClickListener {
        Toast.makeText(it.context, "TIEL", Toast.LENGTH_SHORT).show()
    }
    binding.tilPlannedStartTime.setOnClickListener {
        Toast.makeText(it.context, "TIL", Toast.LENGTH_SHORT).show()
    }
    

Problem

The click event does not have any visual feedback (ripple) like e.g. the ExposedDropdownMenu style would have. Any ideas how to solve this better?

1

There are 1 answers

2
snachmsm On

you can use android:background="?attr/selectableItemBackground", but this will remove your current background (so probably also frame around EditText). some workaround may be to wrap your lines in FrameLayout, make it clickable (OnClickListener for it) and with attr android:foreground="?attr/selectableItemBackground" (foreground is available only for FrameLayout, TextInputLayout extends LinearLayout sadly and don't have foreground...)