【问题标题】:How to set the color gradient of a progress bar programmatically?如何以编程方式设置进度条的颜色渐变?
【发布时间】:2017-03-15 12:30:14
【问题描述】:

我制作了一些进度条,就像你在这张图片中看到的那样:

我一直在使用渐变来使进度条更吸引人,但我想使用颜色区域(例如,30% 满为绿色,65% 满为黄色,85% 满为橙色,95% 以上为红色)。

我看过如何更改颜色的帖子,但我想更改渐变本身,所以我需要传递 startColor、centerColor 和 endColor。

有什么办法可以做到这一点吗?

这是我的进度条在 xml 中的样子:

<ProgressBar
    android:id="@+id/proteinProgressBar"
    style="@android:style/Widget.ProgressBar.Horizontal"
    android:layout_width="32dp"
    android:layout_height="150dp"
    android:layout_marginStart="12dp"
    android:progressDrawable="@drawable/progressbar_states" />

这就是 progressbar_states 可绘制的样子:

<?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>
            <gradient
                android:startColor="#b7b7b5"
                android:centerColor="#e5e5e3"
                android:endColor="#FFF" />

            <!--<gradient-->
                <!--android:startColor="#777"-->
                <!--android:centerColor="#CCC"-->
                <!--android:endColor="#FFF" />-->

            <corners android:radius="10dp" />
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <clip
            android:clipOrientation="vertical"
            android:gravity="bottom">
            <shape>
                <gradient
                    android:startColor="#32A6FF"
                    android:centerColor="#0090FF"
                    android:endColor="#3232FF" />
                <corners android:radius="10dp" />
            </shape>
        </clip>
    </item>
</layer-list>

【问题讨论】:

    标签: android css progress-bar gradient


    【解决方案1】:

    如果其他人需要这个,我只是把它放在这里。

    我刚刚制作了一个单独的 XML,其中包含每个颜色区域的渐变,然后我添加了一些代码以将该 XML 应用于正确的进度条。

    Drawable draw = getDrawable(R.drawable.progressbar_states_red); // Example for red gradient
    pb.setProgressDrawable(draw);
    

    【讨论】:

    • 可绘制代码在哪里,如果您可以发布xml会有所帮助。
    猜你喜欢
    • 1970-01-01
    • 2016-12-28
    • 1970-01-01
    • 1970-01-01
    • 2011-10-26
    • 1970-01-01
    • 2018-09-18
    • 1970-01-01
    • 2011-09-01
    相关资源
    最近更新 更多