如何在android中创建循环ProgressBar?

时间:2014-11-30 12:46:31

标签: android android-progressbar

您是否知道如何制作像Google Fit应用程序一样的循环进度条?如下图所示。

enter image description here

2 个答案:

答案 0 :(得分:333)

您自己创建

很容易

在您的布局中,包含以下具有特定drawable的ProgressBar注意您应该从尺寸中获取宽度)。最大值在这里很重要:

<ProgressBar
    android:id="@+id/progressBar"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:max="500"
    android:progress="0"
    android:progressDrawable="@drawable/circular" />

现在使用以下形状在资源中创建drawable。使用半径进行游戏(您可以使用innerRadius代替innerRadiusRatio)和厚度值。

循环(Pre Lollipop OR API Level&lt; 21)

   <shape
        android:innerRadiusRatio="2.3"
        android:shape="ring"
        android:thickness="3.8sp" >
        <solid android:color="@color/yourColor" />
   </shape>

循环(&gt; =棒棒糖或API级别&gt; = 21)

    <shape
        android:useLevel="true"
        android:innerRadiusRatio="2.3"
        android:shape="ring"
        android:thickness="3.8sp" >
        <solid android:color="@color/yourColor" />
     </shape>
API级别21(Lollipop)默认

useLevel &#34; false&#34;

开始动画

您的代码中的下一步使用ObjectAnimator为您的布局ProgessBar的进度字段设置动画。

ProgressBar progressBar = (ProgressBar) view.findViewById(R.id.progressBar);
ObjectAnimator animation = ObjectAnimator.ofInt(progressBar, "progress", 0, 500); // see this max value coming back here, we animate towards that value
animation.setDuration(5000); // in milliseconds
animation.setInterpolator(new DecelerateInterpolator());
animation.start();

停止动画

progressBar.clearAnimation();

P.S。与上面的例子不同,它提供了流畅的动画。

答案 1 :(得分:126)

您可以试试这个Circle Progress

enter image description here

enter image description here

NB:请始终对进度视图使用相同的宽度和高度

<强> DonutProgress:

 <com.github.lzyzsd.circleprogress.DonutProgress
        android:id="@+id/donut_progress"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:circle_progress="20"/>

<强> CircleProgress:

  <com.github.lzyzsd.circleprogress.CircleProgress
        android:id="@+id/circle_progress"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:circle_progress="20"/>

<强> ArcProgress:

<com.github.lzyzsd.circleprogress.ArcProgress
        android:id="@+id/arc_progress"
        android:background="#214193"
        android:layout_marginLeft="50dp"
        android:layout_width="100dp"
        android:layout_height="100dp"
        custom:arc_progress="55"
        custom:arc_bottom_text="MEMORY"/>