Come creare ProgressBar circolare in Android? [chiuso]


152

Hai idea di come creare una barra di avanzamento circolare come quella dell'applicazione Google Fit? Come l'immagine qui sotto.

inserisci qui la descrizione dell'immagine


7
Di recente ho realizzato qualcosa del genere. Questo potrebbe essere un utile punto di partenza? github.com/daentech/CircularDemo
daentech

@daentech Great! grazie
Mohamed,

1
Qualcuno ha ottenuto una risposta in cui i bordi della parte di caricamento sono arrotondati come nell'esempio?
Siebe,

1
@Siebe puoi usare la libreria che ho citato nella mia risposta. Può essere personalizzata per ottenere il caricamento della parte come desideri.
WannaBeGeek,

2
forse questo può
indicarti

Risposte:


128

Puoi provare questa libreria Circle Progress

inserisci qui la descrizione dell'immagine

inserisci qui la descrizione dell'immagine

NB: utilizzare sempre la stessa larghezza e altezza per le viste di avanzamento

DonutProgress:

 <com.github.lzyzsd.circleprogress.DonutProgress
        android:id="@+id/donut_progress"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:circle_progress="20"/>

CircleProgress:

  <com.github.lzyzsd.circleprogress.CircleProgress
        android:id="@+id/circle_progress"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:circle_progress="20"/>

ArcProgress:

<com.github.lzyzsd.circleprogress.ArcProgress
        android:id="@+id/arc_progress"
        android:background="#214193"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:arc_progress="55"
        custom:arc_bottom_text="MEMORY"/>

come stanno mostrando i valori in corso mentre provo setProgress in su void protetto onProgressUpdate () {super.onProgressUpdate (); Log.d (TAG, "onProgressUpdate"); progressBar.setProgress (progressBar.getProgress () + j); Log.d (TAG, "onProgressUpdate perc:" + j); updateMemoryAndCountValues (); } ma non funziona
Erum

@Top Cat come posso aggiungere animazioni come lo zoom in progress avanzamento del cerchio o mikinw.blogspot.com/2013/03/glow-effect.html
user3233280

29
licenza massima
radu122,

19
Licenza WTF. Haha.
z21

1
ottenere errore prefisso non
associato

338

È facile crearlo da soli

Nel tuo layout includi quanto segue ProgressBarcon un disegno specifico ( nota invece che dovresti ottenere la larghezza dalle dimensioni ). Il valore massimo è importante qui:

<ProgressBar
    android:id="@+id/progressBar"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:max="500"
    android:progress="0"
    android:progressDrawable="@drawable/circular" />

Ora crea il disegno nelle tue risorse con la seguente forma. Gioca con il raggio (puoi usare innerRadiusinvece di innerRadiusRatio) e i valori di spessore.

circolare (Pre Lollipop o livello API <21)

   <shape
        android:innerRadiusRatio="2.3"
        android:shape="ring"
        android:thickness="3.8sp" >
        <solid android:color="@color/yourColor" />
   </shape>

circolare (> = Lollipop OR Livello API> = 21)

    <shape
        android:useLevel="true"
        android:innerRadiusRatio="2.3"
        android:shape="ring"
        android:thickness="3.8sp" >
        <solid android:color="@color/yourColor" />
     </shape>

useLevel è "false" per impostazione predefinita nel Livello API 21 (Lollipop).

Inizia l'animazione

Successivamente nel tuo codice usa un ObjectAnimatorper animare il campo di avanzamento ProgessBardel tuo layout.

ProgressBar progressBar = (ProgressBar) view.findViewById(R.id.progressBar);
ObjectAnimator animation = ObjectAnimator.ofInt(progressBar, "progress", 0, 500); // see this max value coming back here, we animate towards that value
animation.setDuration(5000); // in milliseconds
animation.setInterpolator(new DecelerateInterpolator());
animation.start();

Ferma l'animazione

progressBar.clearAnimation();

PS a differenza degli esempi sopra, dà un'animazione fluida.


6
i passaggi sono lì, se segui questo, il 99% è sicuro di ottenere il risultato.
Murtaza Khursheed Hussain,

5
Funziona come un fascino. Vorrei poterlo votare più di una volta
Mushtaq Jameel il

2
Non funziona per me la vista non è visibile
JMRboosties,

9
Non so cosa stai facendo, la vista non è visibile non è una descrizione completa del problema
Murtaza Khursheed Hussain

6
La tua risposta sembra funzionare molto bene .. ma un'immagine = 1000 parole .. quindi se aggiungi il tuo output come screenshot potrebbe essere utile per i futuri utenti - IMHO
Ranjith Kumar
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.