Tween与Fram动画片的实现

Tween与Fram动画的实现

Android的实现分为两种Tween与Frame动画 Tween动画的实现是通过图片在Canvas变化的轨迹而成,而Frame动画是由一幅幅图片变换而成

1. Tween有以下几种运行轨迹

a. Alpha:透明度的变化;

    b. Scale:缩放

c. Translate:平移

d. Rotate:旋转

 

Tween通过Java代码实现:

public class TweenView extends View { 
Context context;
Animation animation; 
Bitmap bitmap; 
long durationTime = 2000; 
public TweenView(Context context) { 
super(context); this.context = context; 
bitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.gallery_photo_5); 
setFocusable(true); 
} 
@Overrideprotected void onDraw(Canvas canvas) {
  canvas.drawBitmap(bitmap, 100, 100, null); 
} 
// 透明度的变化 
private void alpha() { 
animation = new AlphaAnimation(0.1f, 1); animation.setDuration(durationTime); 
this.startAnimation(animation); 
} 
// 缩放 
private void scale() {
 //在scale中,该处是相对绝对位置的,绝对位置是(0,0),好像设置相对parent没有什么效果 
animation = new ScaleAnimation(1, 0.4f, 1, 0.5f, getWidth() / 2, 0); animation.setDuration(durationTime); 
this.startAnimation(animation); 
} 
// 平移 
private void tran() { 
// Animation.RELATIVE_TO_PARENT,相对于父容器 
// Animation.RELATIVE_TO_SELF,相对于自己 
// Animation.ABSOLUTE,绝对位置 
animation = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0, Animation.RELATIVE_TO_PARENT, getWidth(), Animation.RELATIVE_TO_PARENT, 0, Animation.RELATIVE_TO_PARENT, getHeight()); 
animation.setInterpolator(new AccelerateInterpolator()); animation.setDuration(durationTime); 
this.startAnimation(animation); 
} 
// 旋转 
private void rotate() { 
//前面两个参数设置从什么角度旋转到什么角度,从小角度到大角度时,顺时针旋转 
animation = new RotateAnimation(0, 360, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f); animation.setDuration(durationTime); 
this.startAnimation(animation); 
}
 //在Activity中调用 
public void onKeyEvent(KeyEvent ev) { 
switch (ev.getKeyCode()) { 
case KeyEvent.KEYCODE_DPAD_UP: 
alpha(); break; 
case KeyEvent.KEYCODE_DPAD_DOWN: 
scale(); break; 
case KeyEvent.KEYCODE_DPAD_LEFT: 
tran(); break; 
case KeyEvent.KEYCODE_DPAD_RIGHT: 
rotate(); break; 
   }  
 }
}
 

通过xml进行实现:

在res/anim下建立需要的xml文件

如:缩放

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false" >
    <scale
        android:interpolator="@android:anim/decelerate_interpolator"
        android:duration="5000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0"
        android:toYScale="0" />
</set>

在代码中进行这个加载(在给xml取名字的时候要注意,不要取的名字和android系统中的有些名字一致,如果这样,在代码中进行引用的时候,是找不到的,它不会在R中生成对应的资源引用ID的):

 AnimationUtils.loadAnimation(context, R.anim.sc_small);

 

2. Frame动画(属于帧动画,即把多张图片进行相同时间的变换得到的动画)

public class FrameView extends View {

	AnimationDrawable animationDrawable;
	Context context;
	Drawable bitDrawable;
	public FrameView(Context context) {
		super(context);
		this.context = context;
		animationDrawable = new AnimationDrawable();
		setFocusable(true);
		for(int i = 1 ; i <= 15; i++) {
			//查找资源文件的ID
			int id = context.getResources().getIdentifier("a" + i, "drawable", context.getPackageName());
			bitDrawable = context.getResources().getDrawable(id);
			//将资源文件的Drawable添加到Frame里
			animationDrawable.addFrame(bitDrawable, 500);
		}
		//是否只运行一次
		animationDrawable.setOneShot(false);
		//加入到背景中 
		this.setBackgroundDrawable(animationDrawable);
		
		/**
		//以下是从xml中加载,对应的xml在res/anim/animation_list.xml
		animationDrawable =  (AnimationDrawable) context.getResources().getDrawable(R.anim.animation_list);
		animationDrawable.setOneShot(false);
		this.setBackgroundDrawable(animationDrawable);
		**/
	}
	
	@Override
	public void onWindowFocusChanged(boolean hasWindowFocus) {
		super.onWindowFocusChanged(hasWindowFocus);
		//让视图获得焦点时,启动,默认情况下是不会启动的
		animationDrawable.start();
	}
}

   对应的XML部分的XML代码(该图片放在res/drawable下,该xml文件放在res/anim下):

   <?xml version="1.0" encoding="utf-8"?>

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >
    <item android:drawable="@drawable/a1" android:duration="500"/>
    <item android:drawable="@drawable/a2" android:duration="500"/>
    <item android:drawable="@drawable/a3" android:duration="500"/>
    <item android:drawable="@drawable/a4" android:duration="500"/>
    <item android:drawable="@drawable/a5" android:duration="500"/>
    <item android:drawable="@drawable/a6" android:duration="500"/>
    <item android:drawable="@drawable/a7" android:duration="500"/>
    <item android:drawable="@drawable/a8" android:duration="500"/>
    <item android:drawable="@drawable/a9" android:duration="500"/>
    <item android:drawable="@drawable/a10" android:duration="500"/>
    <item android:drawable="@drawable/a11" android:duration="500"/>
    <item android:drawable="@drawable/a12" android:duration="500"/>
    <item android:drawable="@drawable/a13" android:duration="500"/>
    <item android:drawable="@drawable/a14" android:duration="500"/>
    <item android:drawable="@drawable/a15" android:duration="500"/>
</animation-list>