本文主要是介绍Animation动画效果简单汇总,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
————————————案例结构很复杂一步步来————————————
1、activity_main.xml(首先看启动界面布局文件,里面有2个button)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><Buttonandroid:layout_width="match_parent"android:layout_height="wrap_content"android:onClick="toTestVA"android:text="Test View Animation" /><Buttonandroid:layout_width="match_parent"android:layout_height="wrap_content"android:onClick="toTestDA"android:text="Test Drawable Animation" />
</LinearLayout>
2、MainActivity.java(看加载布局文件的主入口代码,代码做的就是启动2个activity)
package com.atguigu.l10_animation;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends Activity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);}/** 测试View Annimation*/public void toTestVA(View v) {startActivity(new Intent(this, VAActivity.class));}/** 测试Drawable Annimation*/public void toTestDA(View v) {startActivity(new Intent(this, DAActivity.class));}
}
3、首先看startActivity(new Intent(this, VAActivity.class));启动的界面布局文件如下
activity_animation_va.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startCodeScale"android:text="Code Scale" /><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startXmlScale"android:text="Xml Scale" /></LinearLayout><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startCodeRotate"android:text="Code Rotate" /><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startXmlRotate"android:text="Xml Rotate" /></LinearLayout><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startCodeAlpha"android:text="Code Alpha" /><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startXmlAlpha"android:text="Xml Alpha" /></LinearLayout><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startCodeTranslate"android:text="Code Translation" /><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startXmlTranslate"android:text="Xml Translation" /></LinearLayout><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startCodeAnimationSet"android:text="Code AnimationSet" android:textSize="15sp"/><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:onClick="startXmlAnimationSet"android:text="Xml AnimationSet" android:textSize="15sp"/></LinearLayout><Buttonandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:onClick="testAnimationListener"android:text="Test Animation Listener"/><ImageViewandroid:id="@+id/iv_animation"android:layout_width="wrap_content"android:layout_height="wrap_content"android:src="@drawable/atguigu" android:layout_gravity="center_horizontal"/><TextViewandroid:id="@+id/tv_animation_msg"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="显示动画描述信息" android:textSize="18dp"/>
</LinearLayout>
4、然后看VAActivity.java(就是操作
activity_animation_va.xml视图的代码)
VAActivity.java(代码里有5种简单的动画效果,每种动画效果都有代码和.xml文件2种形式)
package com.atguigu.l10_animation;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView;public class VAActivity extends Activity {//定义图片视图资源private ImageView iv_animation;//显示动画描述信息private TextView tv_animation_msg;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_animation_va);//获取图片iv_animation = (ImageView) findViewById(R.id.iv_animation);//获取描述信息的对象tv_animation_msg = (TextView) findViewById(R.id.tv_animation_msg);}/*** 1.1 编码实现: 缩放动画 ScaleAnimation* fromX : 开始时X轴上的缩放比例 toX : 结束时X轴上的缩放比例 * fromY :开始时Y轴上的缩放比例 toY :结束时Y轴上的缩放比例* * pivotXType : X轴坐标的类型(计算x轴上的偏移量的方式) pivotXVlaue : 中心点相对视图左顶点在x轴上的偏移量* pivotYType : Y轴坐标的类型(计算x轴上的偏移量的方式) pivotYValue : 中心点相对视图左顶点在y轴上的偏移量*/public void startCodeScale(View v) {//ScaleAnimation animation = new ScaleAnimation(fromX, toX, fromY, toY, pivotXType, pivotXValue, pivotYType, pivotYValue)ScaleAnimation animation = new ScaleAnimation(0.0f, 1.0f, 0.5f, 1.0f,Animation.ABSOLUTE, 10.0f, Animation.ABSOLUTE, 20.0f);// 延迟时间, 单位msanimation.setStartOffset(1000);// 持续的时间, 单位msanimation.setDuration(5000);// 固定在原来大小animation.setFillBefore(true);// 开启动画iv_animation.startAnimation(animation);}/*** 1.2 xml实现: 缩放动画 <scale>*/public void startXmlScale(View v) {// 加载动画配置文件Animation animation = AnimationUtils.loadAnimation(this,R.anim.scale_test);// 启动动画iv_animation.startAnimation(animation);}/*** 2.1 编码实现: 旋转动画 RotateAnimation(fromDegrees, toDegrees, pivotXType, pivotXValue, pivotYType, pivotYValue)fromDegrees : 开始时的角度toDegrees : 结束时的角度pivotXType : X轴坐标的类型pivotXVlaue : X轴坐标的值pivotYType : Y轴坐标的类型pivotYValue : Y轴坐标的值*/public void startCodeRotate(View v) {//逆时针旋转180度RotateAnimation animation = new RotateAnimation(90f, -90f,Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,0.5f);//顺时针旋转360度(以对角线重点为中心)//animation = new RotateAnimation(0f, 360f, Animation.RELATIVE_TO_SELF,//0.5f, Animation.RELATIVE_TO_SELF, 0.5f);animation.setDuration(9000);// 设置无限重复动画animation.setRepeatCount(Animation.INFINITE);//启动动画iv_animation.startAnimation(animation);}/*** 2.2 xml实现: 旋转动画 <rotate>????????????????*/public void startXmlRotate(View v) {Animation animation = AnimationUtils.loadAnimation(this,R.anim.rotate_test);iv_animation.startAnimation(animation);}/*** 3.1 编码实现: 透明度动画 AlphaAnimationnew AlphaAnimation(fromAlpha, toAlpha)*/public void startCodeAlpha(View v) {AlphaAnimation animation = new AlphaAnimation(0.0f, 1.0f);animation.setDuration(2000);iv_animation.startAnimation(animation);}/*** 3.2 xml实现: 透明度动画 <alpha>*/public void startXmlAlpha(View v) {Animation animation = AnimationUtils.loadAnimation(this,R.anim.alpha_test);iv_animation.startAnimation(animation);}/*** 4.1 编码实现: 平衡动画 TranslateAnimationnew TranslateAnimation(fromXType, fromXValue, toXType, toXValue, fromYType, fromYValue, toYType, toYValue)fromXType : 坐标类型fromXValue : 开始时X轴的坐标toXType :坐标类型toXValue : 结束时X轴的坐标fromYType :坐标类型fromYValue : 开始时Y轴的坐标toYType :坐标类型toYValue : 结束时Y轴的坐标*/public void startCodeTranslate(View v) {TranslateAnimation animation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,1.0f, Animation.RELATIVE_TO_SELF, 0.0f,Animation.RELATIVE_TO_SELF, 1.0f);animation.setDuration(2000);iv_animation.startAnimation(animation);}/*** 4.2 xml实现: 平衡动画 <translate>*/public void startXmlTranslate(View v) {Animation animation = AnimationUtils.loadAnimation(this,R.anim.translate_test);iv_animation.startAnimation(animation);}/*** 5.1 编码实现: 复合动画 AnimationSet*/public void startCodeAnimationSet(View v) {//参数为false、没有任何动画效果AnimationSet animationSet = new AnimationSet(false);// 透明度动画AlphaAnimation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);alphaAnimation.setDuration(2000);animationSet.addAnimation(alphaAnimation);// 旋转动画RotateAnimation rotateAnimation = new RotateAnimation(0.0f, 360f,Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,0.5f);rotateAnimation.setDuration(1000);rotateAnimation.setStartOffset(2000);// 延迟2sanimationSet.addAnimation(rotateAnimation);// 启动动画iv_animation.startAnimation(animationSet);}/*** 5.2 xml实现: 复合动画 <set>*/public void startXmlAnimationSet(View v) {Animation animation = AnimationUtils.loadAnimation(this,R.anim.set_test);iv_animation.startAnimation(animation);}/*** 6. 测试动画监听*/public void testAnimationListener(View v) {AlphaAnimation animation = new AlphaAnimation(0.0f, 1.0f);animation.setDuration(2000);animation.setRepeatCount(2);//设置动画监听animation.setAnimationListener(new Animation.AnimationListener() {@Overridepublic void onAnimationStart(Animation animation) {Log.e("TAG", "动画开始");}@Overridepublic void onAnimationRepeat(Animation animation) {Log.e("TAG", "动画重复");}@Overridepublic void onAnimationEnd(Animation animation) {Log.e("TAG", "动画结束");}});iv_animation.startAnimation(animation);}
}
5、针对上面的代码,下面是依次的动画的布局文件
5-1、缩放动画布局文件如下
scale_test.xml
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"android:fromXScale="0.0"android:toXScale="1.5"android:fromYScale="0.0"android:toYScale="1.0"android:startOffset="1000"android:duration="3000"android:pivotX="100%"android:pivotY="100%"android:fillAfter="true"/>
<!-- Animation.ABSOLUTE : 数值(默认以px为单位)Animation.RELATIVE_TO_SELF : 百分数,如:50% (以当前视图的宽度或高度其为基数来计算)Animation.RELATIVE_TO_PARENT : 百分数+p,如:50%p (以父视图的宽度或高度其为基数来计算)-->
5-2、旋转动画布局方式如下
rotate_test.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"android:fromDegrees="90"android:toDegrees="-90" android:duration="5000">
</rotate><!-- Xml旋转动画: 以左顶点为坐标, 从正90度到负90度, 持续5s默认中心点左顶点开始-->
5-3、透明动画布局文件如下
alpha_test.xml
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"android:fromAlpha="1.0"android:toAlpha="0.0"android:duration="1000">
</alpha>
<!-- Xml透明度动画: 从完全不透明到完全透明, 持续1s-->
5-4、平移动画布局文件如下
translate_test.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"android:fromXDelta="100%" android:toXDelta="-100%"android:duration="4000">
</translate><!-- xml移动动画: 从屏幕的右边逐渐回到原来的位置, 持续2s-->
5-5、复合动画布局如下
set_test.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"><alpha android:fromAlpha="0" android:toAlpha="1"android:duration="2000"/><rotate android:fromDegrees="0"android:toDegrees="360"android:duration="2000"android:startOffset="2000"android:pivotX="50%"android:pivotY="50%"/>
</set><!-- Xml复合动画: 透明度从透明到不透明, 持续2s, 接着进行旋转360度的动画, 持续2s-->
6、接下来看MainActivity.java启动的另外一个activity
startActivity(new Intent(this, DAActivity.class));
先看布局文件
activity_animation_da.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><ImageViewandroid:id="@+id/iv_da_mm"android:layout_width="80dp"android:layout_height="80dp"android:layout_marginTop="160dp"android:background=<span style="color:#ff6666;">"@drawable/anim_da</span>"/><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true"android:layout_alignParentRight="true" ><Buttonandroid:id="@+id/btn_da_start"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="启动动画" /><Buttonandroid:id="@+id/btn_da_stop"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:text="结束动画" /></LinearLayout></RelativeLayout>
<span style="color:#ff6666;">anim_da</span>
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"><!-- oneshot: 是否只显示一次 --><item android:drawable="@drawable/nv1" android:duration="500"></item><item android:drawable="@drawable/nv2" android:duration="500"></item><item android:drawable="@drawable/nv3" android:duration="500"></item><item android:drawable="@drawable/nv4" android:duration="500"></item>
</animation-list>
DAActivity.java
package com.atguigu.l10_animation;
import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
/** 测试: Drawable Animation*/
public class DAActivity extends Activity implements OnClickListener {private ImageView iv_da_mm;private Button btn_da_start;private Button btn_da_stop;private AnimationDrawable animationDrawable;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_animation_da);iv_da_mm = (ImageView) findViewById(R.id.iv_da_mm);btn_da_start = (Button) findViewById(R.id.btn_da_start);btn_da_stop = (Button) findViewById(R.id.btn_da_stop);animationDrawable = (AnimationDrawable) iv_da_mm.getBackground();btn_da_start.setOnClickListener(this);btn_da_stop.setOnClickListener(this);}@Overridepublic void onClick(View v) {if (v == btn_da_start) {//启动图片动画animationDrawable.start();} else if (v == btn_da_stop) {//停止图片动画animationDrawable.stop();}}
}
这篇关于Animation动画效果简单汇总的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!