Android progressbar in button

Is there any possibility to show a spinning progress bar in a button? e.g. as background drawable?

Solution 1:

I was having the same problem, so I created a specialized button for this: LoadingProgressButton

Include the button like this:

    <br.com.simplepass.loading_button_lib.CircularProgressButton
android:id="@+id/btn_id"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@drawable/circular_border_shape"
     app:spinning_bar_width="4dp" <!-- Optional -->
     app:spinning_bar_color="#FFF" <!-- Optional -->
     app:spinning_bar_padding="6dp" <!-- Optional -->

And use it like this:

    CircularProgressButton btn = (CircularProgressButton) findViewById(R.id.btn_id)
            btn.startAnimation(); 
                [do some async task. When it finishes]

                 //You can choose the color and the image after the loading is finished
                 btn.doneLoagingAnimation(fillColor, bitmap);
                 [or just revert de animation]
                 btn.revertAnimation();

Solution 2:

Yes.

You can create an AnimationDrawable, as described here, and then use the drawableLeft tag (for example) in your button's XML. like so:

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/your_background_drawable_resource"
        android:drawableLeft="@drawable/your_animation_drawable_resource"
        android:text="@string/your_text_res">
</Button>

Solution 3:

Yes... Just wrap around both the button and progressBar inside a Relative Layout, like so...

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:weightSum="1">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal">

        <ProgressBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/progressBar"
            android:layout_gravity="right"
            android:layout_alignTop="@+id/btnConnect"
            android:layout_alignRight="@+id/btnConnect"
            android:layout_alignEnd="@+id/btnConnect" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Connect"
            android:id="@+id/btnConnect"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="30dp"
            android:width="200dp"
            android:focusable="false"
            android:focusableInTouchMode="false" />
    </RelativeLayout>

    <TextView
        android:id="@+id/txtConnectStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btnConnect"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:text="Status : Not connected"
        android:textSize="12dp"
        android:layout_gravity="center_horizontal" />

    <LinearLayout
        android:orientation="vertical"

Wanted to post the sample image, but I don't have enough reputation just yet... ;)