How to make rounded corners for an image?

Question

How to make round corners for image with percent icon? I try to use negative margin for imageView but is not works. Thx.

 <LinearLayout
                android:gravity="center_vertical"
                android:layout_marginTop="15dp"
                android:layout_gravity="top|center"
                android:background="@drawable/rounded_background_white"
                android:orientation="horizontal"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

            <ImageView
                    android:src="@drawable/ic_discount_percent"
                    android:layout_marginLeft="-3dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

            <TextView
                    android:textColor="@android:color/black"
                    android:layout_marginLeft="8dp"
                    android:text="Скидка 10%"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

        </LinearLayout>

Answer 1

You can use CircleImageView instead of ImageView

<LinearLayout 
    android:gravity="center_vertical"
    android:layout_marginTop="15dp"
    android:layout_gravity="top|center"
    android:background="@drawable/rounded_background_white"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <de.hdodenhof.circleimageview.CircleImageView
        android:src="@drawable/ic_discount_percent"
        android:layout_gravity="start"
        android:layout_marginStart="0dp"
        android:layout_width="30dp"
        android:layout_height="30dp" />

    <TextView
        android:textColor="@android:color/black"
        android:layout_marginLeft="8dp"
        android:text="Скидка 10%"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout> 

Make CircleImageView width and height same as 2 x corner radius. No padding.

Add the following to gradle dependencies

implementation 'de.hdodenhof:circleimageview:3.0.0'

Answer 2

Use Chips

<com.google.android.material.chip.Chip
    style="@style/Widget.MaterialComponents.Chip.Action"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:chipIcon="@drawable/ic_action_24" // important part
    android:text="@string/hello_world"/>

depending on the style you use, you'll be able to create something like this

read more here: https://material.io/develop/android/components/chip/