Android - Pulsante con rotazione/rotazione dell'immagine di "caricamento" quando premuto

Question

Ho un grosso pulsante "Accedi" nella mia app. Quando l'utente tocca questo pulsante, voglio sostituire il testo con "Accesso in corso ...", allinearlo a sinistra anziché al centro e mettere un cerchio rotante a destra (ma sempre all'interno del pulsante). Mi piacerebbe utilizzare essenzialmente lo stesso pulsante (ma con diverso testo iniziale e di caricamento) in altri punti della mia app.

Qual è il modo migliore per farlo? Per la grafica di rotazione effettiva, stavo progettando di utilizzare lo @drawable/spinner_white_16 fornito con Android.

Grazie.

Answer 1

È possibile creare il proprio pulsante utilizzando un RelativeLayout contenente un TextView e un 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> 

E poi in qualunque sia il vostro metodo di login viene chiamato, modificare il contenuto della TextView, rendono l'allineamento giusto genitore, e impostare la visibilità ImageView al visibile.

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

E poi avrei anche un codice che inverte tali modifiche se l'accesso fallisce.

Answer 2

Crea il tuo pulsante, che sarà composto da un centro TextView e GONEImageView. Dopo aver cliccato fai clic su sposta TextView a sinistra e fai ImageView con il tuo drawable visibile.

Answer 3

Ecco un'implementazione che mi si avvicinò con, si spera la sua riutilizzabile:

ProgressButton

Al momento, quando l'utente fa clic sul pulsante, viene visualizzata la drawable (e animare) per voi, ma voi dovrà respingere l'animazione di caricamento manuale, una volta che hai finito con la vostra attività in background tramite:

_progressButton.stopLoadingAnimation(); 

Questo sarà respingere qualsiasi animazione per voi e per visualizzare il testo precedente, che era lì. L'unica cosa che manca è che non ci sia testo mentre l'animazione è in corso, ma penso che tu possa hackerare qualcosa insieme per quello. Ho intenzione di estendere ulteriormente questo aspetto in modo che ti consenta di chiamare qualcosa come _progressButton.setProgress(10) e quindi impostare la percentuale che viene eseguita. Posso persino renderlo thread-safe.

In questo modo non è necessario utilizzare più layout e incorporare qualsiasi visualizzazione di testo in cima ai pulsanti e tutto è gestito per te.