天天看點

Android中實作ProgressBar菊花旋轉的動畫效果

在一些常見到的加載中需要顯示一個加載動畫,如旋轉的菊花,旋轉的圈圈等等動畫…,然後我們現在就來說下怎麼去試下它吧

一.菊花的旋轉動畫

Android中實作ProgressBar菊花旋轉的動畫效果
1.建立一個drawable檔案

在res/drawable下建立一個progressbar_style.xml檔案定義一個旋轉動畫

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/loading_01"  //菊花圖檔路徑
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360">
</animated-rotate>
           
2.在布局ProgressBar控件中引入使用
<ProgressBar
        android:background="@color/transparent"
        android:indeterminateDuration="2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminateBehavior="repeat" 
        android:indeterminateDrawable="@drawable/progressbar_style"/>
           

二. 圓圈旋轉動畫

Android中實作ProgressBar菊花旋轉的動畫效果

步驟跟上面是一樣的,使用也是一樣的,隻是在progressbar_style.xml中定義的動畫效果是不一樣的

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360">
    <shape
        android:innerRadius="8dp"
        android:thickness="3dp"
        android:shape="ring"
        android:useLevel="false">
        <gradient
            android:centerY="0.50"
            android:endColor="#cccccc"
            android:startColor="@color/white"
            android:type="sweep"
            android:useLevel="false" />
    </shape>

<!--  android:pivotX     動畫執行的起點x坐标 50%代表相對自身寬度的
android:innerRadius  内環的半徑
android:thickness  環的厚度
android:useLevel  隻有當我們的shape使用在LevelListDrawable中時,這個值為true,否則為false
android:centerY 漸變中心Y的相對位置,值為0-1
android:type  漸變類型,還有linear,radial兩種類型,線性漸變和放射漸變-->

</animated-rotate>