补间动画:图片的原形态到新形态过度过程中生成的动画。包括位移、旋转、透明和缩放。
用到的四个类:TranslateAnimation scaleAnimation AlphaAnimation RotateAnimation 这四个类都继承了Animation。
效果图:
点击每个按钮实现响应的效果。。。
实现步骤: 1.布局文件包括以上几个按钮和一个ImageView,比较简单,代码就不贴了。
2.然后就是找到控件设置控件的点击事件。
代码:
package com.hasee.animation;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.Button;
import android.widget.ImageView;
public class MainActivity extends Activity {
private ImageView iv;
private Button ta;
private Button sa;
private Button aa;
private Button to;
private Button ra;
private TranslateAnimation a1;
private ScaleAnimation a2;
private AlphaAnimation a3;
private RotateAnimation a4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv = (ImageView) findViewById(R.id.iv);
ta = (Button) findViewById(R.id.bt_weiyi);
sa = (Button) findViewById(R.id.bt_suofang);
aa = (Button) findViewById(R.id.bt_touming);
to = (Button) findViewById(R.id.bt_yiqifei);
ra = (Button) findViewById(R.id.bt_xuanzhuan);
//位移
ta.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
a1 = new TranslateAnimation(-100,100,-50,50);
//设置位移移动时间
a1.setDuration(2000);
//位移移动次数
a1.setRepeatCount(2);
//设置重复模式
a1.setRepeatMode(Animation.REVERSE);
//让组件停留在结束位置
a1.setFillAfter(true);
iv.startAnimation(a1);
}
});
//缩放
sa.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
a2 = new ScaleAnimation(2,0.5f, 1.5f,0.4f);
//设置位移移动时间
a2.setDuration(2000);
//位移移动次数
a2.setRepeatCount(2);
//设置重复模式
a2.setRepeatMode(Animation.REVERSE);
//让组件停留在结束位置
a2.setFillAfter(true);
iv.startAnimation(a2);
}
});
//透明
aa.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
a3 = new AlphaAnimation(1,0.2f);
//设置位移移动时间
a3.setDuration(2000);
//位移移动次数
a3.setRepeatCount(1);
//设置重复模式
a3.setRepeatMode(Animation.REVERSE);
//让组件停留在结束位置
a3.setFillAfter(true);
iv.startAnimation(a3);
}
});
//一起飞
to.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//创建动画集合,传入false表示每个动画使用自己的校对器
AnimationSet set = new AnimationSet(false);
set.addAnimation(a1);
set.addAnimation(a2);
set.addAnimation(a3);
set.addAnimation(a4);
iv.setAnimation(set);
}
});
//旋转
ra.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//a4 = new RotateAnimation(0, 720);
a4 = new RotateAnimation(0, 720,iv.getWidth()/2,iv.getHeight()/2);
a4.setDuration(2000);
a4.setRepeatCount(1);
a4.setRepeatMode(Animation.REVERSE);
a4.setFillAfter(true);
iv.startAnimation(a4);
}
});
}
}
************************************************************************************************************************************
一个小应用:实现图片的2D反转
布局文件:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:id="@+id/screen"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<ImageView
android:id="@+id/iv_E"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/e"
/>
<ImageView
android:id="@+id/iv_A"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/dog"
/>
</FrameLayout>
逻辑实现:
package com.hasee.reverse;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.ScaleAnimation;
import android.widget.ImageView;
public class MainActivity extends Activity {
//设置图片收缩和扩展两个动作
private ScaleAnimation sa0 = new ScaleAnimation(1, 0, 1, 1,//设置收缩动作
Animation.RELATIVE_TO_PARENT, 0.5f,//设置中心点
Animation.RELATIVE_TO_PARENT, 0.5f);
private ScaleAnimation sa1 = new ScaleAnimation(0, 1, 1, 1,//设置扩展动作
Animation.RELATIVE_TO_PARENT, 0.5f,//设置中心点
Animation.RELATIVE_TO_PARENT, 0.5f);
private ImageView imgA;
private ImageView imgE;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
findViewById(R.id.screen).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
if(imgA.getVisibility() == View.VISIBLE){
imgA.startAnimation(sa0);
}else{
imgE.startAnimation(sa0);
}
}
});
}
private void initView() {
imgA = (ImageView) findViewById(R.id.iv_A);
imgE = (ImageView) findViewById(R.id.iv_E);
showA();//初始默认是xx的照片
sa0.setDuration(500);
sa1.setDuration(500);
//监听图片缩放结束
sa0.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationEnd(Animation animation) {
//缩放动作结束,就执行另一个图片的扩展动作,但是需要判断具体哪一个图片
if(imgA.getVisibility() == View.VISIBLE){
imgA.setAnimation(null);
showE();
imgE.startAnimation(sa1);
}else{
imgE.setAnimation(null);
showA();
imgA.startAnimation(sa1);
}
}
});
}
private void showA() {
//设置A图片可见
imgE.setVisibility(View.INVISIBLE);
imgA.setVisibility(View.VISIBLE);
}
private void showE() {
//设置狗图片可见
imgA.setVisibility(View.INVISIBLE);
imgE.setVisibility(View.VISIBLE);
}
}
效果图:反转前
效果图: 反转后