Android Studio - round button inside square

Question

I want to make a round button in Android Studio. I have created a separate xml that I saved in drawable called round_button.xml

    <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#cccccc"/>
    <stroke android:width="2dp" android:color="#000000" />
</shape>

Then I used it in my button function.

<Button
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@drawable/round_button"
        android:text="ME"
        android:id="@+id/button7"
        android:layout_below="@+id/textView4"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="119dp"

        android:layout_alignParentEnd="false" />

The problem is that my round button seems to be inside a square shape. How can I get rid of it? Any ideas?

Answer 1

You can use ImageButton that has the src attribute. Use that to set the drawable, and put the background to null.

 <ImageButton
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:src="@drawable/round_button"
    android:background="@null"
    android:text="ME"
    android:id="@+id/button7"
    android:layout_below="@+id/textView4"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="119dp"
    android:layout_alignParentEnd="false" />

Answer 2

If you want to use Button , you could define corners
http://developer.android.com/guide/topics/resources/drawable-resource.html#corners-element
for rectangle, for example:

<shape android:shape="rectangle" >
    <solid android:color="#002244" />
    <corners android:radius="15dp" />
</shape>