Wie ändere ich die Farbe im kreisförmigen Fortschrittsbalken?

147

Ich verwende den kreisförmigen Fortschrittsbalken unter Android. Ich möchte die Farbe ändern. ich benutze

"?android:attr/progressBarStyleLargeInverse" 

Stil. So ändern Sie die Farbe des Fortschrittsbalkens.

Wie kann ich den Stil anpassen? Was ist außerdem die Definition des Stils?

Mooongcle
quelle

Antworten:

163

Fügen Sie im Ordner res / drawable Folgendes ein:

progress.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
      android:pivotX="50%" 
      android:pivotY="50%" 
      android:fromDegrees="0"
      android:toDegrees="360">

    <shape 
        android:shape="ring" 
        android:innerRadiusRatio="3"
        android:thicknessRatio="8" 
        android:useLevel="false">

    <size 
        android:width="76dip" 
        android:height="76dip" />

    <gradient 
        android:type="sweep" 
        android:useLevel="false"
        android:startColor="#447a29" 
        android:endColor="#00ffffff"
        android:angle="0"/>

    </shape>

</rotate> 

Set startColorund endColornach Ihrer Wahl.

Stellen Sie das jetzt progress.xmlin ProgressBarden Hintergrund.

So was

<ProgressBar
  android:id="@+id/ProgressBar01" 
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:indeterminateDrawable="@drawable/progress"
 />
Chirag
quelle
1
Es funktioniert nicht, wenn ich ein benutzerdefiniertes Dialogfeld als Kopfzeile der Listenansicht verwende. Muss ein anderer Ansatz gewählt werden?
Pankaj Kumar
22
Dadurch entsteht eine grüne Ringform, aber der eigentliche ProgressBar-Spinner ist weiterhin sichtbar.
Mdupls
Gibt es eine Möglichkeit, die sich drehenden Farben nur in eine Richtung zu bewegen?
Thepoosh
48
Anstatt den Hintergrund mit "android: background" festzulegen, verwenden Sie stattdessen "android: indeterminateDrawable =" @ drawable / progress ", wie durch eine andere Antwort hervorgehoben
baekacaek
1
Verwenden Sie android: startColor = "# 447a29" android: endColor = "# 227a29" unterschiedliche Werte, damit kein statischer Kreis entsteht.
Abhishek Sengupta
137

Für API 21 und höher. Legen Sie einfach die Eigenschaft indeterminateTint fest. Mögen:

android:indeterminateTint="@android:color/holo_orange_dark"

So unterstützen Sie Geräte vor der API 21:

mProgressSpin.getIndeterminateDrawable()
                .setColorFilter(ContextCompat.getColor(this, R.color.colorPrimary), PorterDuff.Mode.SRC_IN );
Student222
quelle
2
mit style="?android:attr/progressBarStyle"funktioniert nicht
user25
Wenn ich eine Reihe von Farben habe und die Farbe in jedem Fortschrittsbalken auf eine Farbreihe einstellen möchte
Prinz
Dies funktionierte gut für mich, nur um die Farbe des progressBar-Rings zu ändern :)
Gastón Saillén
Vielen Dank, dass Sie den Aspekt der APIs hervorgehoben haben
JamisonMan111
Wenn ich diese Farbe einsetze, färbt sie den sich drehenden geschnittenen Ring, aber alles, so dass er sich in einen vollen Ring verwandelt, sodass Sie nicht sehen, wie er sich bewegt
Lucas Zanella
135

1.Erstens Erstellen Sie eine XML-Datei in einem Zeichenordner unter Ressource

benannt "progress.xml"

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360" >

    <shape
        android:innerRadiusRatio="3"
        android:shape="ring"
        android:thicknessRatio="8"
        android:useLevel="false" >

    <size
        android:height="76dip"
        android:width="76dip" />

    <gradient
        android:angle="0"
        android:endColor="color/pink"
        android:startColor="@android:color/transparent"
        android:type="sweep"
        android:useLevel="false" />

    </shape>

</rotate>

2. Machen Sie dann einen Fortschrittsbalken mit dem folgenden Snippet

<ProgressBar
    style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/relativeLayout1"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="20dp"
    android:indeterminate="true"
    android:indeterminateDrawable="@drawable/progress" />
Muhamed Riyas M.
quelle
Hallo Muhamed, ich verwende ein benutzerdefiniertes Fortschrittsrad. Ich habe versucht, das Farblaufrad zur Laufzeit zu ändern. Ich werde versucht, Sobald ich auf eine Schaltfläche klicke, beginnt der Fortschritt. Ich habe die Farbe als grün eingestellt. Nachdem der Fortschritt 100% erreicht hat, möchte ich, dass er erneut startet. Nur dieses Mal sollte seine Farbe rot sein. Aber ich konnte das nicht tun .. wenn möglich pls hilf mir
harikrishnan
1
Vielen Dank. Es funktioniert zu 100%. setze progress.xml auf android: unbestimmtDrawable
Leo Nguyen
Als ich das versuchte, wurde ein dicker Kreisrand erstellt. Irgendwelche Ideen, wie man die Grenze verkleinert?
Tejas
Hallo Tejas, versuche diese Zeile zu ändern android: thinRatio = "8" in der progress.xml. Sie können verschiedene Werte ausprobieren. Hoffe es wird funktionieren.
Muhamed Riyas M
Es funktioniert, aber anstatt zwei Ringe, die sich gegeneinander drehen, bekomme ich nur einen einzigen Ring. Irgendeine Lösung dafür?
AX
66

Mit diesem Code können Sie die Farbe programmgesteuert ändern:

ProgressBar v = (ProgressBar) findViewById(R.id.progress);
v.getIndeterminateDrawable().setColorFilter(0xFFcc0000,
                        android.graphics.PorterDuff.Mode.MULTIPLY);

Wenn Sie die Fortschrittsbalkenfarbe von ProgressDialog ändern möchten, können Sie Folgendes verwenden:

mDilog.setOnShowListener(new OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            ProgressBar v = (ProgressBar)mDilog.findViewById(android.R.id.progress);
            v.getIndeterminateDrawable().setColorFilter(0xFFcc0000,
                    android.graphics.PorterDuff.Mode.MULTIPLY);

        }
    });
Dadroid
quelle
Hey, wie verbinde ich die Fortschrittsleiste von ProgressDialog mit Progress.xml?
Meghal Agrawal
Wenn ich eine Reihe von Farben habe und die Farbe in jedem Fortschrittsbalken auf eine Farbreihe einstellen möchte
Prinz
36

Um Datos Antwort zu ergänzen, finde ich, dass SRC_ATOP ein bevorzugter Filter zum Multiplizieren ist, da er den Alphakanal besser unterstützt.

ProgressBar v = (ProgressBar) findViewById(R.id.progress);
v.getIndeterminateDrawable().setColorFilter(0xFFcc0000, android.graphics.PorterDuff.Mode.SRC_ATOP);
aikmanr
quelle
1
Auf 2.3.x erhalten Sie einen ausgefüllten Kreis, in dem MULTIPLY die Transparenz bewahrt.
Azdev
Wenn ich eine Reihe von Farben habe und die Farbe in jedem Fortschrittsbalken auf eine Farbreihe einstellen möchte
Prinz
28

android: indeterminateTint = "@ color / progressbar"

Bhupinder Singh
quelle
Verwenden Sie einfach das obige Attribut im Fortschrittsbalken: indeterminateTint = Ihre Farbe
Bhupinder Singh
Beste Antwort und es würde auch für alle Versionen unterstützen
Pankaj Kumar
Das ist alles was du brauchst, nicht diese verrückten Antworten. Andere würden jedoch vom vollständigen Codeblock profitieren.
StarWind0
7
indeterminateTint ist für API 21 oder höher verfügbar. Wenn das für Sie funktioniert, großartig!
Andy Weinstein
15

styles.xml

<style name="CircularProgress" parent="Theme.AppCompat.Light">
    <item name="colorAccent">@color/yellow</item>
</style>

  <ProgressBar
        android:layout_width="@dimen/d_40"
        android:layout_height="@dimen/d_40"
        android:indeterminate="true"
        style="@style/Widget.AppCompat.ProgressBar"
        android:theme="@style/CircularProgress"/>
Hardik Vasani
quelle
14
android:indeterminateTint="@color/yellow"

Dies ist Arbeit für mich, fügen Sie einfach diese Zeile zu Ihrem progressBar-XML-Code hinzu

Yıldırım
quelle
12

Das ist Arbeit für mich.

<ProgressBar
android:id="@+id/ProgressBar01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminateTint="@color/black"/>
Kaloglu
quelle
4
Verfügbar ab API Level 21
Viplezer
11

Um die zirkuläre Fortschrittsleiste anzupassen, müssen Sie eine unbestimmte Zeichnungsleiste erstellen , um die benutzerdefinierte Fortschrittsanzeige anzuzeigen

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="1">

    <shape
        android:innerRadiusRatio="3"
        android:shape="ring"
        android:thicknessRatio="8"
        android:useLevel="false">

        <size
            android:height="48dip"
            android:width="48dip" />

        <gradient
            android:centerColor="#f96047"
            android:centerY="0.50"
            android:endColor="#fb9c8d"
            android:startColor="#f72d0c"
            android:type="sweep"
            android:useLevel="false" />

    </shape>

</rotate>

Wir müssen Drawable wie folgt in die Fortschrittsanzeige aufnehmen:

<ProgressBar
    android:layout_width="wrap_content"
    android:layout_centerInParent="true"
    style="?android:attr/progressBarStyleLarge"
    android:visibility="visible"
    android:progressDrawable="@drawable/widget_progressbar"
    android:indeterminateDrawable="@drawable/widget_progressbar"
    android:layout_height="wrap_content" />
Akshay Mukadam
quelle
rotateTag fehlt vorher shape. Ohne sie wird der Fortschrittsbalken statisch sein
Renan Bandeira
@ RenanBandeira Sie können die Antwort verbessern, wenn es richtig ist
Akshay Mukadam
9

Für mich funktionierte das Thema nicht mit AccentColor. Aber es hat mit colorControlActivated funktioniert

    <style name="Progressbar.White" parent="AppTheme">
        <item name="colorControlActivated">@color/white</item>
    </style>

  <ProgressBar
        android:layout_width="@dimen/d_40"
        android:layout_height="@dimen/d_40"
        android:indeterminate="true"
        android:theme="@style/Progressbar.White"/>
S.Javed
quelle
4

Als Ergänzung zu Muhamed Riyas Ms bester Antwort:

Schnellere Rotation

android:toDegrees="1080"

Dünnerer Ring

android:thicknessRatio="16"

Hellweiß

android:endColor="#80ffffff"
Suragch
quelle
4

Überprüfen Sie diese Antwort aus:

Für mich mussten diese beiden Linien vorhanden sein, damit sie funktionieren und die Farbe ändern konnten:

android:indeterminateTint="@color/yourColor"
android:indeterminateTintMode="src_in"

PS: aber es ist nur von Android 21 erhältlich

Amin Keshavarzian
quelle
3

Fügen Sie Ihrem Aktivitätsthema das Element colorControlActivated hinzu , zum Beispiel:

    <style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
            ...
            <item name="colorControlActivated">@color/rocket_black</item>
            ...
    </style>

Wenden Sie diesen Stil auf Ihre Aktivität im Manifest an:

<activity
    android:name=".packege.YourActivity"
    android:theme="@style/AppTheme.NoActionBar"/>
Vladislav
quelle
3

Versuchen Sie es mit einem Stil und stellen Sie colorControlActivated auf die gewünschte ProgressBar-Farbe ein.

<style name="progressColor" parent="Widget.AppCompat.ProgressBar">
    <item name="colorControlActivated">@color/COLOR</item>
</style>

Stellen Sie dann das Thema der ProgressBar auf einen neuen Stil ein.

<ProgressBar
    android:id="@+id/progress_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:theme="@style/progressColor"
 />
this.Mitch
quelle
2

Sie können dies ganz einfach mit einem benutzerdefinierten Dialogfeld tun, indem Sie die XML-Datei aus anderen Antworten wiederverwenden:

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

<shape
    android:innerRadiusRatio="3"
    android:shape="ring"
    android:thicknessRatio="8"
    android:useLevel="false" >

    <size
        android:height="76dip"
        android:width="76dip" />

    <gradient
        android:angle="0"
        android:endColor="@color/oceanBlue"
        android:startColor="@android:color/transparent"
        android:type="sweep"
        android:useLevel="false" />

</shape>

Mach das einfach:

public static class ModifiedProgressDialog extends ProgressDialog {
    public ModifiedProgressDialog(Context context) {
        super(context);
    }

    @Override
    public void show() {
        super.show();
        setIndeterminateDrawable(getContext().getResources().getDrawable(R.drawable.blue_progress));
    }
}
Nathaniel D. Waggoner
quelle
2

Sie können einen Stil zum Ändern der Fortschrittsfarbe wie unten verwenden

 <style name="AppTheme.anyName">
        <item name="colorAccent">YOUR_COLOR</item>
    </style>

und verwenden Sie es in der ProgressBar wie unten

<ProgressBar
            style="?android:attr/progressBarStyle"
            android:theme="@style/AppTheme.WhiteAccent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/dimen_30"
        />

Ich hoffe es hilft.

Rahul
quelle
1

Für alle, die sich fragen, wie Sie die Geschwindigkeit des benutzerdefinierten Fortschritts erhöhen können

  <?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0"
android:toDegrees="1080"><!--HERE YOU COULD INCREASE SPEED BY SETTING TODEGRESS(1080 is 3 loops instead of 1 in same amt of time)-->
<shape android:shape="ring" android:innerRadiusRatio="3"
    android:thicknessRatio="8" android:useLevel="false">
    <size android:width="76dip" android:height="76dip" />
    <gradient android:type="sweep" android:useLevel="false"
        android:startColor="#447a29" 
        android:endColor="#447a29"
        android:angle="0"
         />
</shape>

Behl
quelle
0

Der Farbwert wird aus Ihrer Datei Res / Values ​​/ Colors.xml -> colorAccent übernommen. Wenn Sie ihn ändern, ändert sich auch die Farbe Ihrer progressBar.

Nocturnale
quelle
0

einstellen android:indeterminateDrawable="@drawable/progress_custom_rotate"

Verwenden Sie den folgenden Code für den benutzerdefinierten Fortschrittsbalken für Kreisringe

Kopieren Sie den folgenden Code und erstellen Sie "progress_custom_rotate.xml" im Ordner "Drawable"

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0"
    android:toDegrees="1080">

    <shape android:shape="ring" android:innerRadiusRatio="3"
        android:thicknessRatio="8" android:useLevel="false">

        <size android:width="48dip" android:height="48dip" />

        <gradient android:type="sweep" android:useLevel="false"
            android:startColor="#4c737373" android:centerColor="#4c737373"
            android:centerY="0.50" android:endColor="#ffffd300" />

    </shape>

</rotate>
Bhavesh Moradiya
quelle
0
<style name="progressColor" parent="Widget.AppCompat.ProgressBar">
    <item name="colorControlActivated">@color/colorPrimary</item>
</style>


<ProgressBar
    android:id="@+id/progressBar"
    android:layout_width="250dp"
    android:theme="@style/progressColor"
    android:layout_height="250dp"
    android:layout_centerInParent="true" />
Nullzeiger-Ausnahme
quelle
-1

Sie können Ihre Fortschrittsbalkenfarbe mit dem folgenden Code ändern:

progressBar.getProgressDrawable().setColorFilter(
    getResources().getColor(R.color.your_color), PorterDuff.Mode.SRC_IN);
user3273957
quelle
Wenn ich dann eine Reihe von Farben habe?
Prinz