円形の進行状況バーの色を変更するにはどうすればよいですか?


147

Androidで円形のプログレスバーを使用しています。これの色を変えたいです。使ってます

"?android:attr/progressBarStyleLargeInverse" 

スタイル。では、プログレスバーの色を変更する方法です。

スタイルをカスタマイズするには?さらに、スタイルの定義は何ですか?

回答:


163

res / drawableフォルダーに、次のように配置します。

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> 

あなたの選択に従って設定startColorendColorてください。

それprogress.xmlProgressBarバックグラウンドに設定します。

このような

<ProgressBar
  android:id="@+id/ProgressBar01" 
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:indeterminateDrawable="@drawable/progress"
 />

1
カスタムダイアログをリストビューヘッダーとして使用しているときに機能しません。別のアプローチが必要ですか?
Pankaj Kumar

22
これにより、緑色のリング形状が作成されますが、実際のP​​rogressBarのスピナーは引き続き表示されます。
mdupls

回転する色を一方向にのみ移動させる方法はありますか?
thepoosh

48
「android:background」で背景を設定する代わりに、別の回答で強調されているように、代わりに「android:indeterminateDrawable = "@ drawable / progress"を使用してください
baekacaek

1
android:startColor = "#447a29" android:endColor = "#227a29"の異なる値を使用して、静的な円を形成しないようにします。
Abhishek Sengupta

137

API 21以降の場合。indeterminateTintプロパティを設定するだけです。お気に入り:

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

API 21以前のデバイスをサポートするには:

mProgressSpin.getIndeterminateDrawable()
                .setColorFilter(ContextCompat.getColor(this, R.color.colorPrimary), PorterDuff.Mode.SRC_IN );

2
style="?android:attr/progressBarStyle"機能しない
user25

色の配列があり、各プログレスバーの色の配列に色を設定したい場合
王子様

私のためにこの加工した罰金、ちょうどプログレスバーリングの色を変更するには:)
ガストンSaillén

APIの側面を強調していただきありがとうございます
JamisonMan111

この色を入れると、回転する刈り取られたリングだけでなく、すべてのリングが着色されるので、完全なリングに変わり、動いて見えなくなります
Lucas Zanella

135

1.最初に、リソースの下のドローアブルフォルダーにxmlファイルを作成します

「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.次に、以下のスニペットを使用してプログレスバーを作成します

<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" />

こんにちはムハメド、カスタムプログレスホイールを使用しています。実行時にプログレスホイールの色を変更しようとしました。私は試されました、ボタンをクリックすると、進行が始まります。緑色に設定しました。進行状況が100%に達した後、もう一度開始したいのですが、今回はその色を赤にする必要があります。しかし、私はそれを行うことができませんでした..可能であればplsが私を助けてくれます
ハリクリシュナン2013

1
ありがとう。それは100%機能します。progress.xmlをandroid:indeterminateDrawableに設定します
Leo Nguyen

私がこれを試したとき、それは円の厚いボーダーを作成しました。国境を減らす方法はありますか?
Tejas

こんにちはTejas、progress.xml内のこの行android:thicknessRatio = "8"を変更してみてください。別の値を試すことができます。それがうまくいくことを願っています。
Muhamed Riyas M、2015

それは機能しますが、2つのリングが互いに回転する代わりに、1つのリングしか得られません。これに対する修正はありますか?
AX

66

次のコードを使用して、プログラムで色を変更できます。

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

ProgressDialogのプログレスバーの色を変更したい場合は、これを使用できます。

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);

        }
    });

ちょっと、ProgressDialogのプログレスバーをProgress.xmlにどのように接続しますか?
Meghal Agrawal

色の配列があり、各プログレスバーの色の配列に色を設定したい場合
王子様

36

Datoの答えに追加するには、アルファチャネルをより適切にサポートするため、乗算するのに適したフィルターであるSRC_ATOPを見つけます。

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

1
2.3.xでは、これにより、塗りつぶされた円が得られます。
azdev 2015年

色の配列があり、各プログレスバーの色の配列に色を設定したい場合
王子様

28

android:indeterminateTint = "@ color / progressbar"


プログレスバーで上記の属性を使用するだけです:indeterminateTint =あなたの色
Bhupinder Singh

ベストアンサー。すべてのバージョンにも対応
Pankaj Kumar

これはあなたが必要なすべてであり、これらのクレイジーな答えではありません。ただし、完全なコードブロックの恩恵を受ける人もいます。
StarWind0

7
indeterminateTintは、API 21以降で使用できます。それでうまくいくなら、すばらしいです!
Andy Weinstein


14
android:indeterminateTint="@color/yellow"

これは私にとっては仕事です、あなたのprogressBar xmlコードにこの行を追加してください


12

それは私の仕事です。

<ProgressBar
android:id="@+id/ProgressBar01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminateTint="@color/black"/>

4
APIレベル21から利用可能
viplezer

11

円形のProgressBarをカスタマイズするには、カスタムプログレスバーを表示するindeterminateDrawableを作成する必要があります

<?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>

以下のように、プログレスバーにドローアブルを含める必要があります。

<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" />

rotateの前にタグがありませんshape。それがないと、プログレス
バーは

@RenanBandeira正解であれば、回答を改善できます
Akshay Mukadam

9

私にとってテーマはアクセントカラーで機能していませんでした。しかし、それはcolorControlActivatedで動作しました

    <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"/>

4

Muhamed Riyas Mのトップ投票の回答を補足するには:

高速回転

android:toDegrees="1080"

薄いリング

android:thicknessRatio="16"

ライトホワイト

android:endColor="#80ffffff"

4

この回答をチェックしてください:

私にとって、これらの2行は、機能して色を変更するために存在する必要がありました。

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

PS:アンドロイド21からのみ利用可能


4

スタイルを使用して、colorControlActivatedのあまりにも望ましいProgressBarカラーを設定してみてください。

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

次に、ProgressBarのテーマを新しいスタイルに設定します。

<ProgressBar
    android:id="@+id/progress_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:theme="@style/progressColor"
 />

3

アクティビティのテーマにアイテムcolorControlActivatedを追加します。次に例を示します。

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

このスタイルをマニフェストのアクティビティに適用します。

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

2

カスタムダイアログを使用してこれをかなり簡単に行うことができ、他の回答からのxmlを再利用します。

<?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>

これを行うだけです:

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));
    }
}

2

以下のように進捗の色を変更するためのスタイルを使用できます

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

以下のようにProgressBarで使用します

<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"
        />

それが役に立てば幸い。


1

カスタム進行の速度を上げる方法を疑問に思っているすべての人

  <?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>


0

Res / Values / Colors.xml-> colorAccentからカラー値を取得します。変更すると、progressBarのカラーも変更されます。


0

セットする android:indeterminateDrawable="@drawable/progress_custom_rotate"

以下のコードを使用してカスタム円形リングプログレスバー

以下のコードをコピーして、Drawableフォルダーに「progress_custom_rotate.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="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>

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" />

-1

以下のコードを使用して、プログレスバーの色を変更できます。

progressBar.getProgressDrawable().setColorFilter(
    getResources().getColor(R.color.your_color), PorterDuff.Mode.SRC_IN);

色の配列がある場合は?
王子:
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.