Animation动画效果简单汇总

2024-08-31 23:58

本文主要是介绍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动画效果简单汇总的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1125362

相关文章

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

csu 1446 Problem J Modified LCS (扩展欧几里得算法的简单应用)

这是一道扩展欧几里得算法的简单应用题,这题是在湖南多校训练赛中队友ac的一道题,在比赛之后请教了队友,然后自己把它a掉 这也是自己独自做扩展欧几里得算法的题目 题意:把题意转变下就变成了:求d1*x - d2*y = f2 - f1的解,很明显用exgcd来解 下面介绍一下exgcd的一些知识点:求ax + by = c的解 一、首先求ax + by = gcd(a,b)的解 这个

hdu2289(简单二分)

虽说是简单二分,但是我还是wa死了  题意:已知圆台的体积,求高度 首先要知道圆台体积怎么求:设上下底的半径分别为r1,r2,高为h,V = PI*(r1*r1+r1*r2+r2*r2)*h/3 然后以h进行二分 代码如下: #include<iostream>#include<algorithm>#include<cstring>#include<stack>#includ

usaco 1.3 Prime Cryptarithm(简单哈希表暴搜剪枝)

思路: 1. 用一个 hash[ ] 数组存放输入的数字,令 hash[ tmp ]=1 。 2. 一个自定义函数 check( ) ,检查各位是否为输入的数字。 3. 暴搜。第一行数从 100到999,第二行数从 10到99。 4. 剪枝。 代码: /*ID: who jayLANG: C++TASK: crypt1*/#include<stdio.h>bool h

uva 10387 Billiard(简单几何)

题意是一个球从矩形的中点出发,告诉你小球与矩形两条边的碰撞次数与小球回到原点的时间,求小球出发时的角度和小球的速度。 简单的几何问题,小球每与竖边碰撞一次,向右扩展一个相同的矩形;每与横边碰撞一次,向上扩展一个相同的矩形。 可以发现,扩展矩形的路径和在当前矩形中的每一段路径相同,当小球回到出发点时,一条直线的路径刚好经过最后一个扩展矩形的中心点。 最后扩展的路径和横边竖边恰好组成一个直

poj 1113 凸包+简单几何计算

题意: 给N个平面上的点,现在要在离点外L米处建城墙,使得城墙把所有点都包含进去且城墙的长度最短。 解析: 韬哥出的某次训练赛上A出的第一道计算几何,算是大水题吧。 用convexhull算法把凸包求出来,然后加加减减就A了。 计算见下图: 好久没玩画图了啊好开心。 代码: #include <iostream>#include <cstdio>#inclu

uva 10130 简单背包

题意: 背包和 代码: #include <iostream>#include <cstdio>#include <cstdlib>#include <algorithm>#include <cstring>#include <cmath>#include <stack>#include <vector>#include <queue>#include <map>

防近视护眼台灯什么牌子好?五款防近视效果好的护眼台灯推荐

在家里,灯具是属于离不开的家具,每个大大小小的地方都需要的照亮,所以一盏好灯是必不可少的,每个发挥着作用。而护眼台灯就起了一个保护眼睛,预防近视的作用。可以保护我们在学习,阅读的时候提供一个合适的光线环境,保护我们的眼睛。防近视护眼台灯什么牌子好?那我们怎么选择一个优秀的护眼台灯也是很重要,才能起到最大的护眼效果。下面五款防近视效果好的护眼台灯推荐: 一:六个推荐防近视效果好的护眼台灯的

Flutter 进阶:绘制加载动画

绘制加载动画:由小圆组成的大圆 1. 定义 LoadingScreen 类2. 实现 _LoadingScreenState 类3. 定义 LoadingPainter 类4. 总结 实现加载动画 我们需要定义两个类:LoadingScreen 和 LoadingPainter。LoadingScreen 负责控制动画的状态,而 LoadingPainter 则负责绘制动画。

用Unity2D制作一个人物,实现移动、跳起、人物静止和动起来时的动画:中(人物移动、跳起、静止动作)

上回我们学到创建一个地形和一个人物,今天我们实现一下人物实现移动和跳起,依次点击,我们准备创建一个C#文件 创建好我们点击进去,就会跳转到我们的Vision Studio,然后输入这些代码 using UnityEngine;public class Move : MonoBehaviour // 定义一个名为Move的类,继承自MonoBehaviour{private Rigidbo