How to make circular button in android

Question

I have an app in which i have to make circular button which i successfully made but what i want when i click button then change background drawable but when i do that circular button gets invisible. How do i do that

code:-

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="oval">
        <stroke android:color="@color/colorPrimary" android:width="5dp" />
        <solid android:color="@color/colorPrimaryDark"/>
        <size android:width="150dp" android:height="150dp"/>
    </shape>
</item>

Batter to use `FloatingActionButton` why we put extra afters — ND1010_, Jan 08 '18 at 05:51
But how to change text and background according to data in floating button — NIraj Kumar, Jan 08 '18 at 05:59

score 5 · Answer 1 · answered Jan 08 '18 at 06:01

Use it - drawable/style_circular_button.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape android:shape="oval">
            <solid android:color="@color/colorDeepOrange"/>
            <size android:width="120dp" android:height="120dp"/>
        </shape>
    </item>
    <item android:state_focused="true">
        <shape android:shape="oval">
            <solid android:color="@color/colorOrange"/>
            <size android:width="120dp" android:height="120dp"/>
        </shape>
    </item>
    <item >
        <shape android:shape="oval">
            <solid android:color="@color/colorOrange"/>
            <size android:width="120dp" android:height="120dp"/>
        </shape>
    </item>
</selector>

And set that style_circular_button.xml on background of Button -

<Button
   android:id="@+id/btnSignin"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="@string/text_btn_login"
   android:background="@drawable/style_circular_button"/>

score 3 · Answer 2 · edited Oct 08 '18 at 12:54

To change image by using code

public void onClick(View v) {
   if(v == ButtonName) {
     ButtonName.setImageResource(R.drawable.ImageName);
   }
}

Or, using an XML file:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_pressed="true"
   android:drawable="@drawable/login_selected" /> <!-- pressed -->
  <item android:state_focused="true"
   android:drawable="@drawable/login_mouse_over" /> <!-- focused -->
  <item android:drawable="@drawable/login" /> <!-- default -->
</selector>

In OnClick, just add this code:

ButtonName.setBackgroundDrawable(getResources().getDrawable(R.drawable.ImageName));

And you can use this drawable to obtain desired circle

UPD: setBackgroundDrawable is deprecated, please take a look here.

How to make circular button in android

2 Answers2