Android更改水平进度条颜色

问题描述 投票:153回答:14

我已经设置了水平进度条。

我想改变黄色的进度颜色。

<ProgressBar 
    android:id="@+id/progressbar" 
    android:layout_width="80dip" 
    android:layout_height="20dip"  
    android:focusable="false" 
    style="?android:attr/progressBarStyleHorizontal" />

问题是,不同设备的进度颜色不同。所以,我想要它来修复进度颜色。

android colors progress-bar android-progressbar
14个回答
344
投票

我从我的一个应用程序中复制了这个,所以有一些额外的属性,但应该给你一个想法。这是来自具有进度条的布局:

<ProgressBar
    android:id="@+id/ProgressBar"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:indeterminate="false"
    android:maxHeight="10dip"
    android:minHeight="10dip"
    android:progress="50"
    android:progressDrawable="@drawable/greenprogress" />

然后使用类似于以下内容的东西创建一个新的drawable(在本例中为greenprogress.xml):

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
    <shape>
        <corners android:radius="5dip" />
        <gradient
                android:startColor="#ff9d9e9d"
                android:centerColor="#ff5a5d5a"
                android:centerY="0.75"
                android:endColor="#ff747674"
                android:angle="270"
        />
    </shape>
</item>

<item android:id="@android:id/secondaryProgress">
    <clip>
        <shape>
            <corners android:radius="5dip" />
            <gradient
                    android:startColor="#80ffd300"
                    android:centerColor="#80ffb600"
                    android:centerY="0.75"
                    android:endColor="#a0ffcb00"
                    android:angle="270"
            />
        </shape>
    </clip>
</item>
<item
    android:id="@android:id/progress"
>
    <clip>
        <shape>
            <corners
                android:radius="5dip" />
            <gradient
                android:startColor="#33FF33"
                android:endColor="#008000"
                android:angle="270" />
        </shape>
    </clip>
</item>

</layer-list>

您可以根据需要更改颜色,这将为您提供绿色进度条。


1
投票

你们真的让我头疼。你可以做的是让你的图层列表首先通过xml绘制(表示背景作为第一层,一个drawable表示作为第二层的次要进度,另一个drawable表示作为最后一层的主要进度),然后更改通过执行以下操作在代码上的颜色:

public void setPrimaryProgressColor(int colorInstance) {
      if (progressBar.getProgressDrawable() instanceof LayerDrawable) {
        Log.d(mLogTag, "Drawable is a layer drawable");
        LayerDrawable layered = (LayerDrawable) progressBar.getProgressDrawable();
        Drawable circleDrawableExample = layered.getDrawable(<whichever is your index of android.R.id.progress>);
        circleDrawableExample.setColorFilter(colorInstance, PorterDuff.Mode.SRC_IN);
        progressBar.setProgressDrawable(layered);
    } else {
        Log.d(mLogTag, "Fallback in case it's not a LayerDrawable");
        progressBar.getProgressDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);
    }
}

这种方法将为您提供最佳的灵活性,可以在xml上声明原始drawable的测量结果,之后不会对其结构进行修改,特别是如果您需要具有特定的xml文件屏幕文件夹,那么只需通过颜色修改颜色码。无需从头开始重新实例化新的ShapeDrawable。


1
投票

ProgressBar颜色可以更改如下:

/热水/values/colors.XML

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorAccent">#FF4081</color>
</resources>

/热水/values/styles.XML

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

的onCreate:

progressBar = (ProgressBar) findViewById(R.id.progressBar);
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
    Drawable drawable = progressBar.getIndeterminateDrawable().mutate();
    drawable.setColorFilter(ContextCompat.getColor(this, R.color.colorAccent), PorterDuff.Mode.SRC_IN);
    progressBar.setIndeterminateDrawable(drawable);
}

0
投票

如果您处于API级别21或更高级别,则可以使用以下XML属性:

<!-- For indeterminate progress bar -->
android:indeterminateTint="@color/white"
<!-- For normal progress bar -->
android:progressTint="@color/white"

0
投票

创建一个drawable资源你需要什么背景,在我的例子中我将它命名为bg_custom_progressbar.xml

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

<item>
    <shape android:shape="rectangle" >
        <corners android:radius="5dp"/>

        <gradient
            android:angle="180"
            android:endColor="#DADFD6"
            android:startColor="#AEB9A3" />
    </shape>
</item>
<item>
    <clip>
        <shape android:shape="rectangle" >
            <corners android:radius="5dp" />

            <gradient
                android:angle="180"
                android:endColor="#44CF4A"
                android:startColor="#2BB930" />
        </shape>
    </clip>
</item>
<item>
    <clip>
        <shape android:shape="rectangle" >
            <corners android:radius="5dp" />

            <gradient
                android:angle="180"
                android:endColor="#44CF4A"
                android:startColor="#2BB930" />
        </shape>
    </clip>
</item>

然后使用这个自定义背景

 <ProgressBar
                android:id="@+id/progressBarBarMenuHome"
                style="?android:attr/progressBarStyleHorizontal"
                android:layout_width="match_parent"
                android:layout_height="20dp"
                android:layout_marginStart="10dp"
                android:layout_marginEnd="10dp"
                android:layout_marginBottom="6dp"
                android:indeterminate="false"
                android:max="100"
                android:minWidth="200dp"
                android:minHeight="50dp"
                android:progress="10"
                android:progressDrawable="@drawable/bg_custom_progressbar" />

它对我来说很好


97
投票

更简单的解决方案:

progess_drawable_blue

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
    <shape>
        <solid
                android:color="@color/disabled" />
    </shape>
</item>

<item
    android:id="@android:id/progress">
    <clip>
        <shape>
            <solid
                android:color="@color/blue" />
        </shape>
    </clip>
</item>

</layer-list>

35
投票

如果您只想更改进度条颜色,可以在Activity的onCreate()方法中使用颜色过滤器:

ProgressBar progressbar = (ProgressBar) findViewById(R.id.progressbar);
int color = 0xFF00FF00;
progressbar.getIndeterminateDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);
progressbar.getProgressDrawable().setColorFilter(color, PorterDuff.Mode.SRC_IN);

来自here的想法。

您只需要为棒棒糖前版本执行此操作。在Lollipop上,您可以使用colorAccent样式属性。


34
投票

只需在values/styles.xml中创建一种风格。

<style name="ProgressBarStyle">
    <item name="colorAccent">@color/greenLight</item>
</style>

然后将此样式设置为ProgressBar主题。

<ProgressBar
    android:theme="@style/ProgressBarStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

并不重要你的进度条是水平或圆形。就这样。


15
投票

对于API级别21或更高版本,请使用

android:progressBackgroundTint="@color/yourBackgroundColor"
android:progressTint="@color/yourColor"

6
投票

有3种方法可以解决这个问题:

  1. 如何以声明方式调整进度条颜色
  2. 如何以编程方式调整进度条颜色,但从编译时间之前声明的各种预定颜色中选择颜色
  3. 如何以编程方式调整进度条颜色,还可以以编程方式创建颜色。

特别是围绕#2和#3存在很多混淆,正如对amfcosta答案的评论所示。当你想要将进度条设置为除原色之外的任何东西时,该答案将产生不可预测的颜色结果,因为它仅修改背景颜色,并且实际进度条“剪辑”区域仍将是具有降低的不透明度的黄色叠加。例如,使用该方法将背景设置为深紫色将导致进度条“剪辑”颜色的一些疯狂的粉红色,由暗紫色和黄色混合通过减少的α混合。

无论如何,#1被Ryan完美地回答,而Štarke回答了#3的大部分内容,但对于那些寻找#2和#3的完整解决方案的人来说:


How to adjust the progressbar color programmatically, but choose the color from a predetermined color declared in XML

RES /绘制/ my_progressbar.xml:

创建此文件但更改my_progress和my_secondsProgress中的颜色:

(注意:这只是定义默认android SDK ProgressBar的实际XML文件的副本,但我更改了ID和颜色。原始名称为progress_horizo​​ntal)

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item android:id="@+id/my_progress_background">
    <shape>
        <corners android:radius="5dip" />
        <gradient
            android:startColor="#ff9d9e9d"
            android:centerColor="#ff5a5d5a"
            android:centerY="0.75"
            android:endColor="#ff747674"
            android:angle="270"
            />
    </shape>
</item>

<item android:id="@+id/my_secondaryProgress">
    <clip>
        <shape>
            <corners android:radius="5dip" />
            <gradient
                android:startColor="#80ff171d"
                android:centerColor="#80ff1315"
                android:centerY="0.75"
                android:endColor="#a0ff0208"
                android:angle="270"
                />
        </shape>
    </clip>
</item>

<item android:id="@+id/my_progress">
    <clip>
        <shape>
            <corners android:radius="5dip" />
            <gradient
                android:startColor="#7d2afdff"
                android:centerColor="#ff2afdff"
                android:centerY="0.75"
                android:endColor="#ff22b9ba"
                android:angle="270"
                />
        </shape>
    </clip>
</item>

在你的Java中:

final Drawable drawable;
int sdk = android.os.Build.VERSION.SDK_INT;
    if(sdk < 16) {
        drawable =  ctx.getResources().getDrawable(R.drawable.my_progressbar);
    } else {
        drawable = ContextCompat.getDrawable(ctx, R.drawable.my_progressbar);
    }
progressBar.setProgressDrawable(drawable)

How to adjust the progressbar color programmatically, and also create the color programatically

编辑:我找到了解决这个问题的时间。我以前的回答让这有点模棱两可。

ProgressBar由LayerDrawable中的3个Drawable组成。

  1. 第1层是背景
  2. 第2层是次要进度颜色
  3. 第3层是主要的进度条颜色

在下面的示例中,我将主进度条的颜色更改为青色。

//Create new ClipDrawable to replace the old one
float pxCornerRadius = viewUtils.convertDpToPixel(5);
final float[] roundedCorners = new float[] { pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius, pxCornerRadius };
ShapeDrawable shpDrawable = new ShapeDrawable(new RoundRectShape(roundedCorners, null, null));
shpDrawable.getPaint().setColor(Color.CYAN);
final ClipDrawable newProgressClip = new ClipDrawable(shpDrawable, Gravity.LEFT, ClipDrawable.HORIZONTAL);

//Replace the existing ClipDrawable with this new one
final LayerDrawable layers = (LayerDrawable) progressBar.getProgressDrawable();
layers.setDrawableByLayerId(R.id.my_progress, newProgressClip);

该示例将其设置为纯色。您可以通过替换将其设置为渐变颜色

shpDrawable.getPaint().setColor(Color.CYAN);

Shader shader = new LinearGradient(0, 0, 0, progressBar.getHeight(), Color.WHITE, Color.BLACK, Shader.TileMode.CLAMP);
shpDrawable.getPaint().setShader(shader);

干杯。

-Starts


2
投票

我发现最简单的解决方案是这样的:

<item name="colorAccent">@color/white_or_any_color</item>

将以上内容放在styles.xml文件夹下的res > values文件中。

注意:如果您使用任何其他强调颜色,那么以前的解决方案应该是好的。

API 21或更高


2
投票

对于任何想要以编程方式进行操作的人:

    Drawable bckgrndDr = new ColorDrawable(Color.RED);
    Drawable secProgressDr = new ColorDrawable(Color.GRAY);
    Drawable progressDr = new ScaleDrawable(new ColorDrawable(Color.BLUE), Gravity.LEFT, 1, -1);
    LayerDrawable resultDr = new LayerDrawable(new Drawable[] { bckgrndDr, secProgressDr, progressDr });
    //setting ids is important
    resultDr.setId(0, android.R.id.background);
    resultDr.setId(1, android.R.id.secondaryProgress);
    resultDr.setId(2, android.R.id.progress);

将ids设置为drawable是至关重要的,并负责保留边界和进度条的实际状态


1
投票

final LayerDrawable layers =(LayerDrawable)progressBar.getProgressDrawable(); layers.getDrawable(2).setColorFilter(颜色,PorterDuff.Mode.SRC_IN);

© www.soinside.com 2019 - 2024. All rights reserved.