如何更改圆形进度条的颜色？

Posted 2023-04-18

技术标签:

【中文标题】如何更改圆形进度条的颜色？【英文标题】：How to change color in circular progress bar? 【发布时间】：2011-07-17 07:03:54 【问题描述】：

我在 android 上使用循环进度条。我想改变它的颜色。我正在使用

"?android:attr/progressBarStyleLargeInverse"

风格。那么如何改变进度条的颜色呢。

如何自定义样式？另外，风格的定义是什么？

【问题讨论】：

【参考方案1】：

适用于 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 );

【讨论】：

与style="?android:attr/progressBarStyle" 不起作用如果我有一个颜色数组，并且我想在每个进度条上将颜色设置为一个颜色数组这对我来说很好，只是为了改变进度条环颜色:) 感谢您强调 API 方面如果我使用这种颜色，它会为旋转的切割环着色，但全部着色，所以它会变成一个完整的环，所以你看不到它在移动【参考方案2】：

在 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: 
        android: />

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

    </shape>

</rotate>

根据您的选择设置startColor 和endColor。

现在将progress.xml 设置在ProgressBar 的背景中。

像这样

<ProgressBar
  android:id="@+id/ProgressBar01" 
 android:layout_
 android:layout_
 android:indeterminateDrawable="@drawable/progress"
 />

【讨论】：

当我使用自定义对话框作为列表视图标题时，它不起作用。是否需要另一种方法？这会创建一个绿色的环形，但实际 ProgressBar 的微调器仍然可见。有没有办法让旋转的颜色只向一个方向移动？不要使用“android:background”设置背景，而是使用“android:indeterminateDrawable="@drawable/progress”，正如另一个答案所强调的那样使用不同的 android:startColor="#447a29" android:endColor="#227a29" 值，这样它就不会形成一个静态圆圈。【参考方案3】：

1.首先在resource下的drawable文件夹中创建一个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:
        android: />

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

    </shape>

</rotate>

2.然后使用以下 sn-p 制作进度条

<ProgressBar
    style="?android:attr/progressBarStyleLarge"
    android:layout_
    android:layout_
    android:layout_above="@+id/relativeLayout1"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="20dp"
    android:indeterminate="true"
    android:indeterminateDrawable="@drawable/progress" />

【讨论】：

嗨 Muhamed，我正在使用自定义进度轮，我尝试在运行时更改进度轮的颜色。我试过了，一旦我点击一个按钮，进度就会开始。我已将颜色设置为绿色。进度达到 100% 后，我希望它重新开始，只是这次它的颜色应该是红色。但是，我无法做到这一点.. 如果可能，请帮助我谢谢。它工作 100%。将 progress.xml 设置为 android:indeterminateDrawable 当我尝试这个时，它创建了一个圆形的粗边框。任何想法如何减少边界？嗨 Tejas，尝试在 progress.xml 中更改这一行 android:thicknessRatio="8" 。您可以尝试不同的值。希望它会奏效。它可以工作，但不是两个环相互旋转，我只得到一个环。有什么解决办法吗？【参考方案4】：

您可以使用以下代码以编程方式更改颜色：

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 连接起来？？如果我有一个颜色数组，并且我想在每个进度条上将颜色设置为一个颜色数组【参考方案5】：

为了补充 Dato 的答案，我发现 SRC_ATOP 是一个更可取的乘法过滤器，因为它更好地支持 alpha 通道。

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

【讨论】：

在 2.3.x 上，这会给你一个实心圆，其中 MULTIPLY 保留透明度。如果我有一个颜色数组，并且我想在每个进度条上将颜色设置为一个颜色数组使用兼容版本：

progressBar.indeterminateDrawable.colorFilter = BlendModeColorFilterCompat.createBlendModeColorFilterCompat(0xffffff, BlendModeCompat.SRC_ATOP)

【参考方案6】：

android:indeterminateTint="@color/progressbar"

【讨论】：

只需在进度条中使用上述属性 :indeterminateTint= your colour 最佳答案，它也将支持所有版本这就是你所需要的，而不是这些疯狂的答案。尽管其他人会从完整的代码块中受益。 indeterminateTint 适用于 API 21 或更高版本。如果这对你有用，那就太好了！【参考方案7】：

styles.xml

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

  <ProgressBar
        android:layout_
        android:layout_
        android:indeterminate="true"
        style="@style/Widget.AppCompat.ProgressBar"
        android:theme="@style/CircularProgress"/>

【讨论】：

i think this will help you【参考方案8】：

这对我有用。

<ProgressBar
android:id="@+id/ProgressBar01" 
android:layout_
android:layout_
android:indeterminateTint="@color/black"/>

【讨论】：

API 级别 21 可用【参考方案9】：

要自定义圆形 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:
            android: />

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

    </shape>

</rotate>

我们需要在进度条中包含drawable，如下所示：

<ProgressBar
    android:layout_
    android:layout_centerInParent="true"
    style="?android:attr/progressBarStyleLarge"
    android:visibility="visible"
    android:progressDrawable="@drawable/widget_progressbar"
    android:indeterminateDrawable="@drawable/widget_progressbar"
    android:layout_ />

【讨论】：

rotatetag 在shape 之前丢失。没有它，进度条将是静态的 @RenanBandeira 如果答案正确，您可以改进答案【参考方案10】：

检查这个answer：

对我来说，这两条线必须在那里才能工作并改变颜色：

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

PS：但它仅适用于 android 21

【讨论】：

唯一最简单的解决方案【参考方案11】：

对我来说，主题不适用于 AccentColor。但它确实适用于 colorControlActivated

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

  <ProgressBar
        android:layout_
        android:layout_
        android:indeterminate="true"
        android:theme="@style/Progressbar.White"/>

【讨论】：

【参考方案12】：

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


<ProgressBar
    android:id="@+id/progressBar"
    android:layout_
    android:theme="@style/progressColor"
    android:layout_
    android:layout_centerInParent="true" />

【讨论】：

【参考方案13】：

通过材质组件库，您可以使用具有以下属性的 CircularProgressIndicator：

indicatorColor

trackColor

      <com.google.android.material.progressindicator.CircularProgressIndicator
          android:indeterminate="true"
          app:trackColor="@color/..."
          app:indicatorSize="90dp"
          app:indicatorColor="@color/..."
          />

【讨论】：

这个应该是 2021 年目前公认的【参考方案14】：

添加到您的活动主题，项目 colorControlActivated，例如：

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

将此样式应用于清单中的 Activity：

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

【讨论】：

【参考方案15】：

补充Muhamed Riyas M's票数最高的答案：

更快的旋转

android:toDegrees="1080"

较薄的戒指

android:thicknessRatio="16"

浅白色

android:endColor="#80ffffff"

【讨论】：

【参考方案16】：

尝试使用样式并将 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_
    android:layout_
    android:theme="@style/progressColor"
 />

【讨论】：

【参考方案17】：

您可以使用如下样式更改进度颜色

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

并在 ProgressBar 中使用它，如下所示

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

希望对您有所帮助。

【讨论】：

【参考方案18】：

您可以通过自定义对话框轻松完成此操作，重用其他答案中的 xml：

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

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

    <size
        android:
        android: />

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

【讨论】：

【参考方案19】：

对于所有想知道如何提高自定义进度速度的人

  <?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: android: />
    <gradient android:type="sweep" android:useLevel="false"
        android:startColor="#447a29" 
        android:endColor="#447a29"
        android:angle="0"
         />
</shape>

【讨论】：

【参考方案20】：

它从您的 Res/Values/Colors.xml -> colorAccent 中获取颜色值如果你改变它，你的progressBar颜色也会改变。

【讨论】：

【参考方案21】：

设置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: android: />

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

    </shape>

</rotate>

【讨论】：

【参考方案22】：

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/black</item>
        <item name="colorPrimaryDark">@color/white</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="progressColor" parent="Widget.AppCompat.ProgressBar">
        <item name="colorControlActivated">@color/black</item>
    </style>
</resources>
<ProgressBar
            android:id="@+id/progressBar2"
            style="?android:attr/progressBarStyle"
            android:layout_
            android:layout_
            android:layout_marginStart="8dp"
            android:theme="@style/progressColor"
            app:layout_constraintBottom_toBottomOf="@+id/textView3"
            app:layout_constraintStart_toEndOf="@+id/textView3"
            app:layout_constraintTop_toTopOf="@+id/textView3" />

【讨论】：

【参考方案23】：

您可以使用以下代码更改进度条颜色：

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

【讨论】：

如果我有一个颜色数组，那么？

以上是关于如何更改圆形进度条的颜色？的主要内容，如果未能解决你的问题，请参考以下文章

如何更改 QML Dial 中的圆形进度条？

带有图像和圆形进度条的圆形按钮

如何更改 CircularProgress 栏的颜色

delphi xe android 更改ProgressBar1进度条颜色

iOS圆环，环形渐变进度条的封装

Android 圆形进度条-跟360进度类似-时钟刻度