Animation动画

曹旭东
2023-12-01

首先介绍一下Animation:

1.Animation 动画类型

Android的animation由四种类型组成:

XML中

alph渐变透明度动画效果
scale渐变尺寸伸缩动画效果
translate画面转换位置移动动画效果
rotate画面转移旋转动画效果

 

 

 

 

 

JavaCode中

AlphaAnimation渐变透明度动画效果
ScaleAnimation渐变尺寸伸缩动画效果
TranslateAnimation画面转换位置移动动画效果
RotateAnimation画面转移旋转动画效果

 

 

 

 

 2.Android动画模式

Animation主要有两种动画模式:

一种是tweened animation(渐变动画)

XML中JavaCode
alphaAlphaAnimation
scaleScaleAnimation

 

 

 

一种是frame by frame(画面转换动画)

XML中JavaCode
translateTranslateAnimation
rotateRotateAnimation

 

 

 

下面我们将用Java代码来实现这些动画,并且,可以通过手动输入参数去改变动画;

先看效果图:

 

 

由于之前动图传到的是360云盘。。。所以现在动图看不了了。。。。

我将四种动画写在了一个工具类中(注释的很详细了)

AnimationTools.java:

package com.soft.util;

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;

/**
 * @author zml2015
 * @date 2015-11-11 下午9:39:33
 * @version 1.0
 */
public class AnimationTools {

	/**
	 * @param fromAlpha
	 *            开始的透明度
	 * @param toAlpha
	 *            到大的透明度
	 * @param durationMillis
	 *            动画持续时间
	 * @return
	 */
	public static AnimationSet alphaAnimation(float fromAlpha, float toAlpha,
			long durationMillis) {
		// true表示使用Animation的interpolator,false则是使用自己的
		AnimationSet set = new AnimationSet(true);

		Animation alpha = new AlphaAnimation(fromAlpha, toAlpha);

		alpha.setDuration(durationMillis);
		set.addAnimation(alpha);
		return set;

	}

	/**
	 * @param fromDegrees
	 *            :从哪个旋转角度开始
	 * @param toDegrees
	 *            :转到什么角度
	 * @param pivotXValue
	 *            : x轴的值,0.5f表明是以自身这个控件的一半长度为x轴
	 * @param pivotYValue
	 *            :y轴的值,0.5f表明是以自身这个控件的一半长度为y轴
	 * @param durationMillis
	 *            动画持续时间
	 * @return AnimationSet
	 */
	public static AnimationSet rotateAnimation(float fromDegrees,
			float toDegrees, float pivotXValue, float pivotYValue,
			long durationMillis) {
		AnimationSet set = new AnimationSet(true);

		// Animation.RELATIVE_TO_SELF==1;
		// Animation.RELATIVE_TO_PARENTS==2;
		// 后4个参数用于设置围绕着旋转的圆的圆心在哪里
		Animation rotate = new RotateAnimation(fromDegrees, toDegrees, 1,
				pivotXValue, 1, pivotYValue);
		rotate.setDuration(durationMillis);
		set.addAnimation(rotate);
		return set;
	}

	/**
	 * @param fromX
	 *            x轴的初始值
	 * @param toX
	 *            x轴收缩后的值
	 * @param fromY
	 *            y轴的初始值
	 * @param toY
	 *            y轴收缩后的值
	 * @param pivotXValue
	 *            x轴的值,0.5f表明是以自身这个控件的一半长度为x轴
	 * @param pivotYValue
	 *            y轴的值,0.5f表明是以自身这个控件的一半长度为y轴
	 * @param durationMillis
	 *            动画持续时间
	 * @return AnimationSet
	 */
	public static AnimationSet scaleAnimation(float fromX, float toX,
			float fromY, float toY, float pivotXValue, float pivotYValue,
			long durationMillis) {
		AnimationSet set = new AnimationSet(true);

		// Animation.RELATIVE_TO_SELF==1;
		// Animation.RELATIVE_TO_PARENTS==2;
		Animation sacle = new ScaleAnimation(fromX, toX, fromY, toY, 1,
				pivotXValue, 1, pivotYValue);
		sacle.setDuration(durationMillis);
		set.addAnimation(sacle);
		return set;
	}

	/**
	 * @param fromXValue
	 *            x轴的开始位置
	 * @param toXValue
	 *            x轴的结束位置
	 * @param fromYValue
	 *            y轴的开始位置
	 * 
	 * @param toYValue
	 *            y轴的结束位置
	 * @param durationMillis
	 *            动画持续时间
	 * @return AnimationSet
	 */
	public static AnimationSet translateAnimation(float fromXValue,
			float toXValue, float fromYValue, float toYValue,
			long durationMillis) {
		AnimationSet set = new AnimationSet(true);

		// Animation.RELATIVE_TO_SELF==1;
		// Animation.RELATIVE_TO_PARENTS==2;
		Animation translate = new TranslateAnimation(1, fromXValue, 1,
				toXValue, 1, fromYValue, 1, toYValue);
		translate.setDuration(durationMillis);
		set.addAnimation(translate);
		return set;
	}
}


布局文件main.xml

<span style="font-size:18px;"><ScrollView 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" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        tools:context="com.zml.animation.MainActivity" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <EditText
                android:id="@+id/editText1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="持续时间(ms)"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/editText2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="开始状态(0~1)"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/editText3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="终止状态(0~1)"
                android:numeric="decimal" >

                <requestFocus />
            </EditText>
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <EditText
                android:id="@+id/et_rotate1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="旋转角度开始"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_rotate2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="旋转角度结束"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_rotate3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="x轴的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_rotate4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="y轴的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_rotate5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="持续时间"
                android:numeric="decimal" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <EditText
                android:id="@+id/et_scale1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="X轴初值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="X收缩后的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="Y轴初值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="Y收缩后的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="x轴位置"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale6"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="y轴位置"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_scale7"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="时间"
                android:numeric="decimal" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <EditText
                android:id="@+id/et_trans1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="X轴初值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_trans2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="X移动后的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_trans3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="Y轴初值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_trans4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="Y移动后的值"
                android:numeric="decimal" />

            <EditText
                android:id="@+id/et_trans5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:ems="10"
                android:hint="时间"
                android:numeric="decimal" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <Button
                android:id="@+id/alphaButton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="淡入淡出" />

            <Button
                android:id="@+id/rotateButton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="旋转" />

            <Button
                android:id="@+id/scaleButton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="缩放" />

            <Button
                android:id="@+id/translateButton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="移动" />
        </LinearLayout>

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dog" />
    </LinearLayout>

</ScrollView></span>


主页面管理文件(注释虽然比较少,但是写的还是比较简单明了的)

MainActivity.java

 

package com.zml.animation;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

import com.soft.util.AnimationTools;

public class MainActivity extends Activity implements OnClickListener {
	private Button alphaButton = null;
	private Button rotateButton = null;
	private Button scaleButton = null;

	private Button translateButton = null;
	private EditText et_alpha1, et_alpha2, et_alpha3, et_rotate1, et_rotate2,
			et_rotate3, et_rotate4, et_rotate5, et_scale1, et_scale2,
			et_scale3, et_scale4, et_scale5, et_scale6, et_scale7, et_trans1,
			et_trans2, et_trans3, et_trans4, et_trans5;
	private ImageView iv_show;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		alphaButton = (Button) findViewById(R.id.alphaButton);
		rotateButton = (Button) findViewById(R.id.rotateButton);
		scaleButton = (Button) findViewById(R.id.scaleButton);
		translateButton = (Button) findViewById(R.id.translateButton);
		alphaButton.setOnClickListener(this);
		rotateButton.setOnClickListener(this);
		scaleButton.setOnClickListener(this);
		translateButton.setOnClickListener(this);

		et_alpha1 = (EditText) findViewById(R.id.editText1);
		et_alpha2 = (EditText) findViewById(R.id.editText2);
		et_alpha3 = (EditText) findViewById(R.id.editText3);

		et_rotate1 = (EditText) findViewById(R.id.et_rotate1);
		et_rotate2 = (EditText) findViewById(R.id.et_rotate2);
		et_rotate3 = (EditText) findViewById(R.id.et_rotate3);
		et_rotate4 = (EditText) findViewById(R.id.et_rotate4);
		et_rotate5 = (EditText) findViewById(R.id.et_rotate5);

		et_scale1 = (EditText) findViewById(R.id.et_scale1);
		et_scale2 = (EditText) findViewById(R.id.et_scale2);
		et_scale3 = (EditText) findViewById(R.id.et_scale3);
		et_scale4 = (EditText) findViewById(R.id.et_scale4);
		et_scale5 = (EditText) findViewById(R.id.et_scale5);
		et_scale6 = (EditText) findViewById(R.id.et_scale6);
		et_scale7 = (EditText) findViewById(R.id.et_scale7);

		et_trans1 = (EditText) findViewById(R.id.et_trans1);
		et_trans2 = (EditText) findViewById(R.id.et_trans2);
		et_trans3 = (EditText) findViewById(R.id.et_trans3);
		et_trans4 = (EditText) findViewById(R.id.et_trans4);
		et_trans5 = (EditText) findViewById(R.id.et_trans5);

		iv_show = (ImageView) findViewById(R.id.imageView1);

	}

	@Override
	public void onClick(View arg0) {
		switch (arg0.getId()) {
		case R.id.alphaButton:
			if (et_alpha1.getText().toString().isEmpty()
					|| et_alpha2.getText().toString().isEmpty()
					|| et_alpha3.getText().toString().isEmpty())
				Toast.makeText(MainActivity.this, "淡入淡出内容未填完整", 0).show();
			else {
				float fromAlpha = Float.parseFloat(et_alpha2.getText()
						.toString());
				float toAlpha = Float
						.parseFloat(et_alpha3.getText().toString());
				long durationMillis = Long.parseLong(et_alpha1.getText()
						.toString());

				iv_show.startAnimation(AnimationTools.alphaAnimation(fromAlpha,
						toAlpha, durationMillis));
			}
			break;
		case R.id.rotateButton:
			if (et_rotate1.getText().toString().isEmpty()
					|| et_rotate2.getText().toString().isEmpty()
					|| et_rotate3.getText().toString().isEmpty()
					|| et_rotate4.getText().toString().isEmpty()
					|| et_rotate5.getText().toString().isEmpty())
				Toast.makeText(MainActivity.this, "旋转内容未填完整", 0).show();
			else {
				float fromDegrees = Float.parseFloat(et_rotate1.getText()
						.toString());
				float toDegrees = Float.parseFloat(et_rotate2.getText()
						.toString());
				float pivotXValue = Float.parseFloat(et_rotate3.getText()
						.toString());
				float pivotYValue = Float.parseFloat(et_rotate4.getText()
						.toString());
				long rdurationMillis = Long.parseLong(et_rotate5.getText()
						.toString());
				iv_show.startAnimation(AnimationTools.rotateAnimation(
						fromDegrees, toDegrees, pivotXValue, pivotYValue,
						rdurationMillis));
			}
			break;
		case R.id.scaleButton:
			if (et_scale1.getText().toString().isEmpty()
					|| et_scale2.getText().toString().isEmpty()
					|| et_scale3.getText().toString().isEmpty()
					|| et_scale4.getText().toString().isEmpty()
					|| et_scale5.getText().toString().isEmpty()
					|| et_scale6.getText().toString().isEmpty()
					|| et_scale7.getText().toString().isEmpty())
				Toast.makeText(MainActivity.this, "收缩内容未填完整", 0).show();
			else {
				float fromX = Float.parseFloat(et_scale1.getText().toString());
				float toX = Float.parseFloat(et_scale2.getText().toString());
				float fromY = Float.parseFloat(et_scale3.getText().toString());
				float toY = Float.parseFloat(et_scale4.getText().toString());
				float spivotXValue = Float.parseFloat(et_scale5.getText()
						.toString());
				float spivotYValue = Float.parseFloat(et_scale6.getText()
						.toString());
				long sdurationMillis = Long.parseLong(et_scale7.getText()
						.toString());
				iv_show.startAnimation(AnimationTools.scaleAnimation(fromX,
						toX, fromY, toY, spivotXValue, spivotYValue,
						sdurationMillis));
			}
			break;
		case R.id.translateButton:
			if (et_trans1.getText().toString().isEmpty()
					|| et_trans2.getText().toString().isEmpty()
					|| et_trans3.getText().toString().isEmpty()
					|| et_trans4.getText().toString().isEmpty()
					|| et_trans5.getText().toString().isEmpty())
				Toast.makeText(MainActivity.this, "收缩内容未填完整", 0).show();
			else {
				float fromXValue = Float.parseFloat(et_trans1.getText()
						.toString());
				float toXValue = Float.parseFloat(et_trans2.getText()
						.toString());
				float fromYValue = Float.parseFloat(et_trans3.getText()
						.toString());
				float toYValue = Float.parseFloat(et_trans4.getText()
						.toString());
				long tsdurationMillis = Long.parseLong(et_trans5.getText()
						.toString());
				iv_show.startAnimation(AnimationTools.translateAnimation(
						fromXValue, toXValue, fromYValue, toYValue,
						tsdurationMillis));
			}
			break;
		default:
			break;
		}

	}

}


 源码下载地址:CSDN(暂未上传)

 

 
 类似资料: