圆形进度条像饼图一样进展 [英] circular progress bar progressing like pie chart

问题描述

我有一个进度条，其progressdrawable 'drawable/circle_progress.xml' 是:

I have a progress bar whose progressdrawable 'drawable/circle_progress.xml' is:

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

    <item android:id="@android:id/progress">
       <rotate
            android:fromDegrees="0"
            android:toDegrees="360"
            android:pivotX="50%"
            android:pivotY="50%" >

            <shape android:shape="oval" >
                <gradient
                    android:centerColor="@color/color_center"
                    android:centerY="0.50"
                    android:endColor="@color/color_end"
                    android:startColor="@color/color_start"
                    android:type="sweep" /> 
            </shape>

        </rotate>

    </item>

</layer-list>

我在 xml 中的进度条如下:

My progress bar in xml is as:

<ProgressBar
    android:id="@+id/progressBarCircle"
    style="?android:attr/progressBarStyleHorizontal"
    android:indeterminate="false"
    android:progressDrawable="@drawable/circle_progress"
    android:max="100" />

这是进度条的图像，进度为 90%.当我增加进度时，它会按进度轮换.

Here is the image of progress bar with progress 90%. when I increase the progress , It is rotated by amount of the progress.

_{(来源:tiemenschut.com)}

我只想，圆应该像饼图一样只用进度填充，而不是整个圆.

I just want , circle should be filled only by amount of progress like a pie chart, not all the circle.

推荐答案

对于那些想知道如何实施 thisDrawable 类，我找到了方法.就我而言，我不得不使用 Pie Progress Drawable 来显示倒数计时器的进度，每秒更新一次可绘制对象.为此，我创建了 PieProgressDrawable 类的一个实例并将其设置为 ImageView:

For those who wonder how to implement this Drawable class, I found the way. In my case I had to use a Pie Progress Drawable to show the progress of a countdown timer, updating the drawable every second. To do that I created an instance of the PieProgressDrawable class and set it to an ImageView:

PieProgressDrawable pieProgressDrawable = new PieProgressDrawable();
ImageView timeProgress = (ImageView) findViewById(R.id.time_progress);
timeProgress.setImageDrawable(pieProgressDrawable);

为了每秒更新一次进度，我在 PieProgressDrawable 实例上调用 setLevel()，然后在托管此 PieProgressDrawable 实例的 ImageView 上调用 invalidate().像这样:

In order to update the progress every second, I call setLevel() on the PieProgressDrawable instance and then invalidate() on the ImageView that hosts this PieProgressDrawable instance. Like this:

pieProgressDrawable.setLevel(progress);
timeProgress.invalidate();

如果有人需要一些指导，我写了一个关于它的教程此处.

In case someone needs some guidance I wrote a tutorial about it here.

这篇关于圆形进度条像饼图一样进展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！