趙雅智_android_frame動畫

標籤：android   style   class   blog   code   java   

在開始執行個體講解之前，先引用官方文檔中的一段話：

Frame動畫是一系列圖片按照一定的順序展示的過程，和放電影的機制很相似，我們稱為逐幀動畫。Frame動畫可以被定義在XML檔案中，也可以完全編碼實現。

如果被定義在XML檔案中，我們可以放置在/res下的anim或drawable目錄中(/res/[anim | drawable]/filename.xml)，檔案名稱可以作為資源ID在代碼中引用；如果由完全由編碼實現，我們需要使用到AnimationDrawable對象。

如果是將動畫定義在XML檔案中的話，文法如下：

<?xml version="1.0" encoding="utf-8"?>  <animation-list xmlns:android="http://schemas.android.com/apk/res/android"      android:oneshot=["true" | "false"] >      <item          android:drawable="@[package:]drawable/drawable_resource_name"          android:duration="integer" />  </animation-list>  

1. 配置圖片資源檔
2. 在activity中實現frame動畫

執行個體：運行效果：

步驟把圖片放到res/drawable目錄下分別取名為：a1.png，a2.png，a3.png，a4.png，a5.png，a6.png。
在res/anim目錄下建立一個XML設定檔我們可以將frame.xml檔案放置於drawable或anim目錄，官方文檔上是放到了drawable中了，大家可以根據喜好來放置，放在這兩個目錄都是可以啟動並執行。

<?xml version="1.0" encoding="utf-8"?>    <!--       根標籤為animation-list    其中oneshot代表著是否只展示一遍，設定為false會不停的迴圈播放動畫      根標籤下，通過item標籤對動畫中的每一個圖片進行聲明    android:duration 表示展示所用的該圖片的時間長度   -->  <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">      <item android:drawable="@drawable/a1" android:duration="1000"></item>      <item android:drawable="@drawable/a2" android:duration="1000"></item>      <item android:drawable="@drawable/a3" android:duration="1000"></item>      <item android:drawable="@drawable/a4" android:duration="1000"></item>      <item android:drawable="@drawable/a5" android:duration="1000"></item>      <item android:drawable="@drawable/a6" android:duration="1000"></item>  </animation-list>   

• animation-list：動畫的總標籤，這裡面放著幀動畫 <item>標籤
  • oneshot代表著是否只展示一遍
    
    • true 則表示動畫只播發一次
      
    • false會不停的迴圈播放動畫
      
• item：記錄著每一幀的資訊，對動畫中的每一個圖片進行聲明
  • android:drawable="@drawable/a"表示這一幀用的圖片為"a"，下面以此類推。
  •  android:duration="1000" 表示這一幀持續1000毫秒，可以根據這個值來調節動畫播放的速度

在res/layout目錄下建立layout設定檔activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context=".MainActivity" >    <ImageView        android:id="@+id/imageView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerHorizontal="true" />    <Button        android:id="@+id/btn_begin"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_below="@+id/imageView1"        android:layout_marginTop="30dp"        android:layout_toRightOf="@+id/btn_codeBegin"        android:onClick="click"        android:text="開始" />    <Button        android:id="@+id/btn_stop"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignBottom="@+id/btn_begin"        android:layout_marginRight="15dp"        android:onClick="click"        android:text="停止" />    <RadioGroup        android:id="@+id/rg_num"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_below="@+id/btn_stop"        android:orientation="horizontal" >        <RadioButton            android:id="@+id/rb_one"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:checked="true"            android:text="單次播放" />        <RadioButton            android:id="@+id/rb_more"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="迴圈播放" />    </RadioGroup>    <TextView        android:id="@+id/textView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_below="@+id/rg_num"        android:text="拖動進度條修改透明度(0 - 255)之間" />    <SeekBar        android:id="@+id/sb_alpha"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_below="@+id/textView1" />    <Button        android:id="@+id/btn_codeBegin"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignBottom="@+id/btn_stop"        android:layout_marginRight="15dp"        android:layout_toRightOf="@+id/btn_stop"        android:text="代碼_啟動"        android:onClick="click" /></RelativeLayout>

Activity代碼

package com.example.lession13_frame;import android.app.Activity;import android.graphics.drawable.AnimationDrawable;import android.graphics.drawable.Drawable;import android.os.Bundle;import android.view.View;import android.widget.ImageView;import android.widget.RadioGroup;import android.widget.RadioGroup.OnCheckedChangeListener;import android.widget.SeekBar;import android.widget.SeekBar.OnSeekBarChangeListener;import android.widget.Toast;public class SplashActivity extends Activity {private ImageView imageView;private AnimationDrawable animationDrawable;private RadioGroup rgNum;private SeekBar sbalpha;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);// 幀動畫imageView = (ImageView) findViewById(R.id.imageView1);rgNum = (RadioGroup) this.findViewById(R.id.rg_num);sbalpha = (SeekBar) this.findViewById(R.id.sb_alpha);// 第一種方式實現的動畫/* * animationDrawable = (AnimationDrawable) * getResources().getDrawable(R.anim.framebyframe); * imageView.setBackgroundDrawable(animationDrawable); */// 第二種方式實現的動畫// 設定背景資源imageView.setBackgroundResource(R.anim.framebyframe);animationDrawable = (AnimationDrawable) imageView.getBackground();// animationDrawable.setOneShot(false);是否迴圈播放// animationDrawable.stop();停止播放// animationDrawable.isRunning();//是否播放// animationDrawable.getNumberOfFrames();//播放幀// animationDrawable.getFrame(index); 返回制定索引的 Drawable對象// animationDrawable.getDuration(i);停留的時間rgNum.setOnCheckedChangeListener(new OnCheckedChangeListener() {@Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {// TODO Auto-generated method stubif (checkedId == R.id.rb_one) {// 設定單次播放animationDrawable.setOneShot(true);} else if (checkedId == R.id.rb_more) {// 設定迴圈播放animationDrawable.setOneShot(false);}// 設定播放後重新啟動animationDrawable.stop();animationDrawable.start();}});// 監聽的進度條修改透明度sbalpha.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {@Overridepublic void onStopTrackingTouch(SeekBar seekBar) {}@Overridepublic void onStartTrackingTouch(SeekBar seekBar) {}@Overridepublic void onProgressChanged(SeekBar seekBar, int progress,boolean fromUser) {// TODO Auto-generated method stub// 設定動畫Alpha值animationDrawable.setAlpha(progress);// 通知imageView 重新整理螢幕imageView.postInvalidate();}});}public void click(View v) {int id = v.getId();switch (id) {case R.id.btn_begin:animationDrawable.start();break;case R.id.btn_stop:animationDrawable.stop();break;case R.id.btn_codeBegin:Toast.makeText(getApplicationContext(), "------------------", 0).show();// 完全編碼實現的動畫效果for (int i = 1; i <= 6; i++) {// 根據資源名稱和目錄擷取R.java中對應的資源IDint picId = getResources().getIdentifier("a" + i, "drawable",getPackageName());// 根據資源ID擷取到Drawable對象Drawable drawable = getResources().getDrawable(picId);// 將此幀添加到AnimationDrawable中animationDrawable.addFrame(drawable, 300);}animationDrawable.setOneShot(false); // 設定為loopimageView.setBackgroundDrawable(animationDrawable); // 將動畫設定為ImageView背景animationDrawable.start(); // 開始動畫break;default:break;}}}

AnimationDrawable 就是用來控制這個幀動畫，這個類中提供了很多方法。
 

• animationDrawable.start(); 開始這個動畫
• animationDrawable.stop(); 結束這個動畫
• animationDrawable.setAlpha(100);設定動畫的透明度, 取值範圍(0 - 255)
• animationDrawable.setOneShot(true); 設定單次播放
• animationDrawable.setOneShot(false); 設定迴圈播放
• animationDrawable.isRunning(); 判斷動畫是否現正播放
• animationDrawable.getNumberOfFrames(); 得到動畫的幀數。

拖動進度條設定Alpha值的時候 一定要使用     imageView.postInvalidate(); 方法來通知UI線程重繪螢幕中的imageView  否則會看不到透明的效果 。

純程式碼實現：

//完全編碼實現的動畫效果          for (int i = 1; i <= 6; i++) {              //根據資源名稱和目錄擷取R.java中對應的資源ID              int picId = getResources().getIdentifier("a" + i, "drawable", getPackageName());              //根據資源ID擷取到Drawable對象              Drawable drawable = getResources().getDrawable(picId);              //將此幀添加到AnimationDrawable中              animationDrawable.addFrame(drawable, 300);          }          animationDrawable.setOneShot(false); //設定為loop          imageView.setBackgroundDrawable(animationDrawable);  //將動畫設定為ImageView背景          animationDrawable.start();   //開始動畫     break;