Tween动画
abdroid提供了两种动画:Tween金额Fram动画,下面介绍第一种:
Tween动画是通过对view的内容通过一系列的图形变化(包括平移、缩放、旋转、改变透明度)来实现动画效果。动画效果可以在xml文件里做,也可以采用编码来做:
下面的demo实现了2种方法,即,1、在代码里实现;2、在src文件下创建anim文件,用XML里实现
首先大家看一下布局:就是5个按键,点击按键的时候Imgeview图片做相应的动作。
<LinearLayout 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"
android:orientation="vertical"
tools:context="com.example.animationdemo.MainActivity$PlaceholderFragment" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="@+id/b1"
android:layout_width="48dp"
android:layout_height="wrap_content"
android:text="透明" />
<Button
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="旋转" />
<Button
android:id="@+id/b3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="缩放" />
<Button
android:id="@+id/b4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="平移" />
<Button
android:id="@+id/b5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="组合" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center_horizontal|center_vertical"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/im"
android:src="@drawable/zp"
/>
</LinearLayout>
</LinearLayout>
2、下面看看在xml文件下定义动画结构图:

因为在前面定义的透明、平移、旋转、缩放最后都复制到了set的组合动画文件里了,这里就只给出set的xml文件
<?xml version="1.0" encoding="utf-8"?>
<set>
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:duration="2000"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="1"
>
</rotate>
<alpha
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:fromAlpha="0"
android:toAlpha="1"
android:repeatCount="1"
android:duration="1000"
>
</alpha>
<scale
android:fromXScale="0"
android:toXScale="1"
android:fromYScale="0"
android:toYScale="1"
android:duration="2000"
android:repeatCount="1"
xmlns:android="http://schemas.android.com/apk/res/android">
</scale>
<translate
android:fromXDelta="-100"
android:toXDelta="150"
android:fromYDelta="-100"
android:toYDelta="150"
android:duration="2000"
android:repeatCount="1"
xmlns:android="http://schemas.android.com/apk/res/android">
</translate>
</set>
最终我们用2种方式实现了前面四个按键的操作,和第5个组合动画操作:
public class MainActivity extends ActionBarActivity implements OnClickListener {
private Button bt1,bt2,bt3,bt4,bt5;
private ImageView im;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bt1=(Button) findViewById(R.id.b1);
bt2=(Button) findViewById(R.id.b2);
bt3=(Button) findViewById(R.id.b3);
bt4=(Button) findViewById(R.id.b4);
bt5=(Button) findViewById(R.id.b5);
im=(ImageView) findViewById(R.id.im);
bt1.setOnClickListener(this);
bt2.setOnClickListener(this);
bt3.setOnClickListener(this);
bt4.setOnClickListener(this);
bt5.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.b1:
// AlphaAnimation animation=new AlphaAnimation(0f, 1f);
// animation.setDuration(2000);
// im.startAnimation(animation);
Animation animation=AnimationUtils.loadAnimation(this, R.anim.amalpha);
im.startAnimation(animation);
break;
case R.id.b2:
// RotateAnimation animation2=new RotateAnimation(0,360);
// RotateAnimation animation2=new RotateAnimation(0, 360, 200, 200);
// RotateAnimation animation2 =new RotateAnimation(0f,360f,Animation.RELATIVE_TO_SELF, 0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// animation2.setDuration(2000);
// im.startAnimation(animation2);
Animation animation2=AnimationUtils.loadAnimation(this, R.anim.roanimation);
im.startAnimation(animation2);
break;
case R.id.b3:
// ScaleAnimation animation3 =new ScaleAnimation(0f, 2f, 0f, 1f);
// animation3.setDuration(2000);
// im.startAnimation(animation3);
Animation animation3=AnimationUtils.loadAnimation(this, R.anim.scaleanimation);
im.startAnimation(animation3);
break;
case R.id.b4:
//第一个参数为动画平移相对于图片所在位置x的偏移量,第二个参数为目标地点位置离原来的位置的x偏移量,后面的y同理
// TranslateAnimation animation4=new TranslateAnimation(-100, 200, -100, 200);
//// RotateAnimation animation3=new RotateAnimation(0,90);
// animation4.setDuration(2000);
// im.startAnimation(animation4);
Animation animation4=AnimationUtils.loadAnimation(this, R.anim.animationtran);
im.startAnimation(animation4);
break;
case R.id.b5:
Animation animation5=AnimationUtils.loadAnimation(this, R.anim.set);
im.startAnimation(animation5);
break;
default:
break;
}
}
}
二、 为了简单也可以直接用代码实现,下面是用代码实现淡入淡出的动画:

浙公网安备 33010602011771号