AnimationDrawable(幀動畫) 使用

在某些情況下,圖像需要在屏幕上進行動畫。如果您想要顯示由多個圖像組成的自定義加載動畫,或者如果您希望一個圖標在用戶操作後變成另一個圖標,這非常有用。Android爲繪製動畫提供了一些選項。

第一個選項是使用動畫可繪製。這使您可以指定幾個靜態可繪製文件 ,這些文件將一次顯示一個來創建動畫。第二種選擇是使用動畫矢量可繪製,它可以讓矢量可繪製的屬性動畫化 。

使用AnimationDrawable


動畫的一種方法Drawables是逐個加載一系列可繪製資源來創建動畫。這是一個傳統的動畫,它是由一系列不同的圖像創建的,按照順序播放,就像一卷電影一樣。本AnimationDrawable類是可繪製動畫的基礎。

雖然您可以使用AnimationDrawable類API 在代碼中定義動畫的框架,但使用列出組成動畫的框架的單個XML文件更簡單。這種動畫的XML文件屬於res/drawable/您的Android項目的目錄。在這種情況下,指令是動畫每幀的順序和持續時間。

XML文件由一個<animation-list>元素作爲根節點和一系列子<item>節點組成,每個子節點定義一個框架:一個可繪製的框架資源和幀持續時間。以下是可繪製動畫的示例XML文件:

 

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true">
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>

該動畫僅運行三幀。通過將android:oneshot 列表屬性設置爲true,它將循環一次,然後停止並保持最後一幀。如果它設置爲false,則動畫將循環。通過將此XML保存 rocket_thrust.xmlres/drawable/項目目錄中,可以將其作爲背景圖像添加到View中,然後調用以播放。這裏有一個Activity示例,其中動畫添加到一個ImageView動畫中,然後在觸摸屏幕時動畫:

 

AnimationDrawable rocketAnimation;

public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();

  rocketImage.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        rocketAnimation.start();
      }
  });
}

值得注意的是,這一點很重要start()呼籲方法 AnimationDrawable 不能在過程中可以調用onCreate()您的活動的方法,因爲 AnimationDrawable還沒有完全貼在車窗。如果您想要立即播放動畫而不需要交互,那麼您可能需要從[onStart()](https://developer.android.google.cn/reference/android/app/Activity.html#onStart()) Activity中的方法調用該動畫, 當Android使屏幕上的視圖可見時,該方法將被調用。

有關XML語法,可用標籤和屬性的更多信息,請參閱動畫資源

使用AnimatedVectorDrawable


矢量繪製 是一種類型的可繪製的是沒有得到像素化或模糊可伸縮的。的 AnimatedVectorDrawable 類(和向後兼容),可以動畫向量可繪製的屬性,如旋轉或變更路徑數據以將其變形爲不同的圖像。 AnimatedVectorDrawableCompat

您通常在三個XML文件中定義動畫矢量繪圖:

  • 可以繪製<vector>元素的 矢量res/drawable/
  • 可以用<animated-vector>元素 繪製的動畫矢量res/drawable/
  • 一個或多個具有<objectAnimator>元素的 對象動畫師res/anim/

動畫矢量繪圖可以動畫<group><path>元素的屬性。的<group>元素定義了一組路徑或子組,並且<path>元素定義要繪製的路徑。

定義要製作動畫的矢量繪製時,請使用該android:name 屬性爲組和路徑分配唯一的名稱,以便您可以從動畫製作工具定義中引用它們。例如:

 

<!-- res/drawable/vectordrawable.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="64dp"
    android:width="64dp"
    android:viewportHeight="600"
    android:viewportWidth="600">
    <group
        android:name="rotationGroup"
        android:pivotX="300.0"
        android:pivotY="300.0"
        android:rotation="45.0" >
        <path
            android:name="v"
            android:fillColor="#000000"
            android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
    </group>
</vector>

動畫矢量可繪製的定義是指可以通過名稱繪製的矢量中的組和路徑:

 

<!-- res/drawable/animvectordrawable.xml -->
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:drawable="@drawable/vectordrawable" >
    <target
        android:name="rotationGroup"
        android:animation="@anim/rotation" />
    <target
        android:name="v"
        android:animation="@anim/path_morph" />
</animated-vector>

動畫定義代表ObjectAnimatorAnimatorSet對象。在這個例子中的第一個動畫師旋轉目標組360度:

 

<!-- res/anim/rotation.xml -->
<objectAnimator
    android:duration="6000"
    android:propertyName="rotation"
    android:valueFrom="0"
    android:valueTo="360" />

本示例中的第二個動畫師將矢量繪圖的路徑從一個形狀變形爲另一個形狀。兩條路徑必須與變體兼容:每條命令必須具有相同數量的命令和相同數量的參數。

 

<!-- res/anim/path_morph.xml -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:duration="3000"
        android:propertyName="pathData"
        android:valueFrom="M300,70 l 0,-70 70,70 0,0   -70,70z"
        android:valueTo="M300,70 l 0,-70 70,0  0,140 -70,0 z"
        android:valueType="pathType" />
</set>

結果AnimatedVectorDrawable如下:

有關更多信息,請參閱API參考 AnimatedVectorDrawable



作者:WebbLin林恩
鏈接:https://www.jianshu.com/p/ce5014c4bc95
來源:簡書
著作權歸作者所有。商業轉載請聯繫作者獲得授權,非商業轉載請註明出處。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章