Touch Target Size too small

Question

I am currently facing an issue where Android Studio is suggesting to increase the touch target size for a button due to it being too small. Most recommendations online suggest setting minHeight to "48dp," but doing so affects the visual design of my layout.

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/Dinning"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="7dp"
            android:layout_weight="1"
            android:background="@drawable/selected_button_color"
            android:minHeight="34dp"
            android:text="Dinning"
            android:textAllCaps="false"
            android:textColor="@drawable/selected_text_color"
            android:textSize="13sp" />

I want to maintain the visual height of the button at 34dp as per my UI design, but I also need to address the "Touch Target Size too small" warning. Increasing minHeight to 48dp is not an option for me.

Is there a way to resolve this warning without compromising the visual design by keeping the minHeight at 34dp? Any suggestions or alternative approaches would be greatly appreciated. Thank you!

Update: I changed AppCompatButton to TextView, warning is gone.

Answer 1

As it's warning you can ignore it but if you want to improve it you can follow this solution which will not affect your UI and also removed this warning.

If you set setOnClickListener on this button it'll be hard to click sometime because touch area is too small and may setOnClickListener not trigger.

To solve this you can set 48dp for size and set padding. like if you use any image drawable then set padding to main image so your UI will not messed up and you can get rid of Touch Target Size too small warning

With Button we use android:background so padding not work here but you can use this solution for ImageView, TextView and other views. Might it help for other clickable views in your project.

<ImageView
    android:id="@+id/imgBack"
    android:layout_width="@dimen/toolbar_height"
    android:layout_height="@dimen/toolbar_height"
    android:padding="17dp"
    android:src="@drawable/ic_arrow_left" />

and If I remove padding it shows

So, You can maintain UI and Touch area as well.