Android - a button with a rotating / rotating "downloadable" image when pressed

Question

I have a big login button in my application. When the user clicks this button, I want to replace the text "Login ...", align it to the left, not the center, and place the rotation circle on the right (but still inside the button). I would like to use essentially the same button (but with a different starting and loading text) in other places in my application.

What is the easiest way to do this? For the actual spinning chart, I planned to use @drawable/spinner_white_16 , which comes with Android.

Thanks.

Answer 1

You can create your own button using a RelativeLayout containing a TextView and ImageView.

 <RelativeLayout android:id="@+id/login" android:layout_width="wrap_content" android:layout_height="wrap_content" onClick="[yourLoginMethod]" > <TextView android:id="@+id/login_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="Log In" /> <ImageView android:id="@+id/login_loading" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_toRightOf="@id/login_text" android:visibility="gone" /> </RelativeLayout> 

And then, no matter what your login method is called, change the contents of the TextView, align the parental right and set the visibility of the ImageView to visible.

 loginText.setText("Logging In..."); LayoutParams params = loginText.getLayoutParams(); params.addRule(RelativeLayout.ALIGN_PARENT_RIGHT); loginText.setLayoutParams(params); loginLoading.setVisibility(View.VISIBLE); 

And then I will also have a code that discards these changes if the login fails.

Answer 2

Here is the implementation I came across, hopefully reusing it:

Progressbutton

At the moment, when the user clicks the button, it displays pushed (and animations) for you, but you will have to cancel the loading animation manually as soon as you finish with the background task with:

 _progressButton.stopLoadingAnimation(); 

This will reject any animation for you and display any previous text that was there. The only thing missing is that there is no text during the animation, but I think you can hack something together for this. I plan to expand this a bit further so that it allows you to call something like _progressButton.setProgress(10) , and then set the percentage to be executed. I can even make it thread safe.

Thus, you do not need to use multiple layouts and embed any text images on top of the buttons, and they will all be processed for you.

Answer 3

Create your own button, which will consist of centered TextView and GONE ImageView . After clicking, move the TextView left and make the ImageView visible visible.