带有实心圆圈的自定义圆形进度条

Posted

技术标签:

【中文标题】带有实心圆圈的自定义圆形进度条【英文标题】:Custom Circular Progress Bar with solid circles 【发布时间】:2015-05-15 05:52:21 【问题描述】:

我想要一个这样的圆形进度条

我试过了,但它看起来不像圆形以及如何将动画与淡入淡出一起放置,因为目前我对所有六个圆圈都使用相同的 xml。

 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="horizontal" >

<LinearLayout
    android:layout_
    android:layout_
    android:layout_gravity="center"
    android:layout_marginRight="15dp"
    android:orientation="vertical" >

    <ImageView
        android:layout_
        android:layout_
        android:layout_marginBottom="5dp"
        android:src="@drawable/circle_shape_big_custom_search" />

    <ImageView
        android:layout_
        android:layout_
        android:layout_marginTop="5dp"
        android:src="@drawable/circle_shape_big_custom_search" />
</LinearLayout>

<LinearLayout
    android:layout_
    android:layout_
    android:layout_gravity="center"
    android:orientation="vertical" >

    <ImageView
        android:layout_
        android:layout_
        android:src="@drawable/circle_shape_big_custom_search" />

    <ImageView
        android:layout_
        android:layout_
        android:src="@drawable/circle_shape_big_custom_search" />
</LinearLayout>

<LinearLayout
    android:layout_
    android:layout_
    android:layout_gravity="center"
    android:layout_marginLeft="15dp"
    android:orientation="vertical" >

    <ImageView
        android:layout_
        android:layout_
         android:layout_marginBottom="5dp"
        android:src="@drawable/circle_shape_big_custom_search" />

    <ImageView
        android:layout_
         android:layout_marginTop="5dp"
        android:layout_
        android:src="@drawable/circle_shape_big_custom_search" />
</LinearLayout>

任何帮助将不胜感激。

【问题讨论】:

退房:github.com/Fichardu/CircleProgress 这个话题仍然是开放的。任何机构都可以帮我解决这个问题。 ?? 【参考方案1】:

像下面的代码片段一样定义进度条:

<ProgressBar
        android:id="@+id/progress_bar"
        android:layout_
        android:layout_
        android:layout_gravity="center"
        android:indeterminateDrawable="@drawable/my_progress_indeterminate"
        android:visibility="gone" >
    </ProgressBar>

my_progress_indeterminate.xml [将此文件放入drawable]

<?xml version="1.0" encoding="utf-8"?>
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/image_for_rotation"
    android:pivotX="50%"
    android:pivotY="50%" />

将附在此处的此图像文件放在 drawale 中: image_to_be_place_in_drawable

【讨论】:

毫无疑问,你的 ans 真的很有帮助,但我不想旋转,我想要淡化运动。意味着每个圆形图像都将是自己的位置,但它应该以序列化的方式褪色和发光。 好的,上面的过程几乎可以想象你所说的我认为当你保持慢速旋转时它似乎没有旋转。 是的...图像应该是静态的,但淡化应该以看起来像运动的方式发生。 @BlueGreen 创建一个自定义的 Drawable 类,然后使用TimeAnimator 淡化你的圈子 是否可以使用 alpha()?,我尝试过但没有成功实现它。

以上是关于带有实心圆圈的自定义圆形进度条的主要内容,如果未能解决你的问题,请参考以下文章

Android绘制圆形进度条

如何重新加载圆形进度条

圆形百分比进度条

[iOS开发]用CAShapeLayer实现圆形进度条

带有进度条的按钮 android

Android界面设计,下面图的那个圆形进度条怎么设计??