Android: Drawing a circle inside a button

Question

I need to create a circle inside a button like the ones you'll see in the next picture:

But my problem is I'm already using background property of button to add a nice shadow effect in the following way: android:background="@android:drawable/dialog_holo_light_frame"

so I guess I cannot use background for both purposes.

This is how my buttons currently look:

Any idea on how to get both, the same nice shadow effect and a circle inside? Maybe it is possible with the "Style" property? (don't know)

Answer 1

You can use a CardView like:

<com.google.android.material.card.MaterialCardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        app:cardCornerRadius="5sp"
        app:cardElevation="10dp"
        app:strokeColor="@color/black"
        app:strokeWidth="1dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="10dp"
                android:gravity="center"
                android:text="Test"
                android:textColor="@color/black"
                android:textSize="20sp" />

            <Button
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:background="@drawable/round_button"
                android:gravity="center_vertical|center_horizontal"
                android:text="1"
                android:textColor="#fff" />
        </LinearLayout>

</com.google.android.material.card.MaterialCardView>

round_button.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false">
        <shape android:shape="oval">
            <solid android:color="#fa09ad"/>
        </shape>
    </item>
    <item android:state_pressed="true">
        <shape android:shape="oval">
            <solid android:color="#c20586"/>
        </shape>
    </item>
</selector>