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

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

"?android:attr/progressBarStyleLargeInverse" 

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

如何自定义样式?另外,风格的定义是什么?

【问题讨论】:

    标签: android progress-bar android-progressbar


    【解决方案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: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.xml 设置在ProgressBar 的背景中。

    像这样

    <ProgressBar
      android:id="@+id/ProgressBar01" 
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     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: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.然后使用以下 sn-p 制作进度条

    <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,我正在使用自定义进度轮,我尝试在运行时更改进度轮的颜色。我试过了,一旦我点击一个按钮,进度就会开始。我已将颜色设置为绿色。进度达到 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_width="@dimen/d_40"
            android:layout_height="@dimen/d_40"
            android:indeterminate="true"
            style="@style/Widget.AppCompat.ProgressBar"
            android:theme="@style/CircularProgress"/>
    

    【讨论】:

    【解决方案8】:

    这对我有用。

    <ProgressBar
    android:id="@+id/ProgressBar01" 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    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: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>
    

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

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

    【讨论】:

    • 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_width="@dimen/d_40"
            android:layout_height="@dimen/d_40"
            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_width="250dp"
          android:theme="@style/progressColor"
          android:layout_height="250dp"
          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_width="wrap_content"
                android:layout_height="wrap_content"
                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_width="wrap_content"
                          android:layout_height="wrap_content"
                          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: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));
                    }
                }
                

                【讨论】:

                  【解决方案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:width="76dip" android:height="76dip" />
                      <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: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>
                      

                      【讨论】:

                        【解决方案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_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    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);
                          

                          【讨论】:

                          • 如果我有一个颜色数组,那么?
                          猜你喜欢
                          • 2023-04-01
                          • 2016-11-02
                          • 1970-01-01
                          • 2014-10-08
                          • 1970-01-01
                          • 1970-01-01
                          • 1970-01-01
                          • 2014-06-12
                          相关资源
                          最近更新 更多