How to create circular widget in android whose color can programmatically be changed?

Question

Is there any way to create a circular button in android without just setting drawable shape file as background? Because I want to set button color programmatically and by setting drawable shape file as background it doesn't work. I also used Floating action Button but when tried to set color swatch as background it didnt work.

`public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    FloatingActionButton fab1, fab2, fab3, fab4, fab5,fab6;

    ImageView imgV;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        fab1 = (FloatingActionButton) findViewById(R.id.bt1);
        fab2 = (FloatingActionButton) findViewById(R.id.bt2);
        fab3 = (FloatingActionButton) findViewById(R.id.bt3);
        fab4 = (FloatingActionButton) findViewById(R.id.bt4);
        fab5 = (FloatingActionButton) findViewById(R.id.bt5);
        fab6 = (FloatingActionButton) findViewById(R.id.bt6);
        imgV = (ImageView) findViewById(R.id.imageView);

        fab1.setOnClickListener(this);
        fab2.setOnClickListener(this);
        fab3.setOnClickListener(this);
        fab4.setOnClickListener(this);
        fab5.setOnClickListener(this);


        Bitmap bitmap = ((BitmapDrawable) imgV.getDrawable()).getBitmap();
        if (bitmap != null) {

            Palette.from(bitmap).maximumColorCount(10).generate(new Palette.PaletteAsyncListener() {
                @Override
                public void onGenerated(Palette palette) {


                    setViewSwatch(fab1, palette.getVibrantSwatch(), "Vibrant");
                    setViewSwatch(fab2, palette.getDarkVibrantSwatch(), "Dark Vibrant");
                    setViewSwatch(fab3, palette.getLightVibrantSwatch(), "Light Vibrant");
                    setViewSwatch(fab4, palette.getMutedSwatch(), "Muted");
                    setViewSwatch(fab5, palette.getLightMutedSwatch(), "Light Muted");


                }


            });


        }

    }

    private void setViewSwatch(FloatingActionButton fab, Palette.Swatch vibrantSwatch, String vibrant) {
        if (vibrantSwatch != null) {
            fab.setBackgroundColor(vibrantSwatch.getRgb());



        }
    }
`

Show us what you have tried to achieve this...? – Raja Anbazhagan Dec 31 '17 at 16:33 — Raja Anbazhagan, Dec 31 '17 at 16:33

score 0 · Answer 1 · answered Dec 31 '17 at 16:35

0

Our friend 'markushi' wrote this code for Android circular button, maybe it can help you https://github.com/markushi/android-circlebutton

answered Dec 31 '17 at 16:35

FlyingNades

432
3
16

score 0 · Answer 2 · answered Dec 31 '17 at 18:02

If you require your circular button to alternate between two colours only this is the easiest solution: Create two new Drawable XML files as d1 and d2

d1.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <solid android:color="#000000(Required colours hex value here)" />   


    <corners android:radius="10dip" />

    <stroke
        android:width="1dp"
        android:color="@android:color/white" />

</shape>

Create a copy of d1.xml as d2.xml and just modify the colour value

In code you can programatically change the background as follows:

v.setBackgroundResource(R.drawable.d1);
v.setBackgroundResource(R.drawable.d2);

Thank you. Actually I don't want to switch between color of my choices. the colors will be extracted from an image (user input) and then be applied on button background. — saba, Jan 01 '18 at 18:40

score 0 · Accepted Answer · answered Dec 31 '17 at 18:57

I highly recommend you using Floating Action Button which is circle you can easily change its color programmatically

mFab.setBackgroundTintList(ColorStateList.valueOf(your color in int))

Also here is link for more info I think you may waste your time by implementing other solutions (ways) that goes the exact same result Hope this helps ;)

How to create circular widget in android whose color can programmatically be changed?

3 Answers3

d1.xml