Android: animate circular progress drawable

问题

I need a drawable that looks like the rotating progress circle. That drawable I want to use for instance in an ImageView inside a GridView etc.

So, according to other posts I took the progress_medium_holo.xml from the folder \sdk\platforms\android-xx\data\res\drawable which looks like this. And I also copied the PNG files which are used by this drawable.

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate
             android:drawable="@drawable/spinner_48_outer_holo"
             android:pivotX="50%"
             android:pivotY="50%"
             android:fromDegrees="0"
             android:toDegrees="1080" />
    </item>
    <item>
        <rotate
             android:drawable="@drawable/spinner_48_inner_holo"
             android:pivotX="50%"
             android:pivotY="50%"
             android:fromDegrees="720"
             android:toDegrees="0" />
    </item>
</layer-list>

Within my layout I then used for instance this ImageView which is used the progress-drawable.

<ImageView
    android:id="@+id/element_image"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:paddingBottom="5dp"
    android:paddingTop="5dp"
    android:src="@drawable/progress_medium_holo" />

But the result is a static circle-progress. Is there a way to animate that one by XML definition and using no code?

回答1:

There is a View named ProgressBar that does exaclty what you want. Just use this instead of your ImageView:

<ProgressBar
    android:id="@+id/element_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:paddingBottom="5dp"
    android:paddingTop="5dp" />

回答2:

In order to create a customized progress indicator (rotating progress circle, in your case)

1. Create a layout file(.xml) or use an image (drawable) for roatating circle. Put it in drawable folder in res.
2. Use this drawable as a source to the imageview in the layout for loading indicator.
3. Use this imageview by inflating and call following startLoadingAnimation() on it.Similarly you can stop the animation once your job is done by simply calling stopLoadingAnimation() on it.

You will have to use animation to make it rotate.

// start the loading animation

public void startLoadingAnimation(Context context) {
  Animation rotate = AnimationUtils.loadAnimation(context,
    R.anim.anim_rotate);
  rotate.setRepeatMode(Animation.INFINITE);
  mImgView.startAnimation(rotate);
}

// stop the loading animation
public void stopLoadingAnimation(){
  mImgView.clearAnimation();
}

anim_rotate.xml put this file in anim folder in res

<?xml version="1.0" encoding="utf-8"?>
<rotate
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:fromDegrees="0"
  android:interpolator="@android:anim/linear_interpolator"
  android:toDegrees="360"
  android:pivotX="50%"
  android:pivotY="50%"
  android:duration="500"
  android:startOffset="0"
  android:repeatCount="infinite"
/>

回答3:

Thanks for progress_medium_holo.xml. In my case a standard ProgressBar (for API 23) was not visible, I tryed many variations, only horizontal bar styled progressbars were visible. Then I copied progress_medium_holo.xml and linked drawables from the folder sdk\platforms\android-xx\data\res\drawable and eventually got:

<ProgressBar
    android:id="@+id/progress"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:indeterminateDrawable="@drawable/progress_medium_holo"/>

来源：https://stackoverflow.com/questions/24280777/android-animate-circular-progress-drawable