Animation动画的xml使用

最新推荐文章于 2024-03-28 20:35:40 发布

锐湃

最新推荐文章于 2024-03-28 20:35:40 发布

阅读量824

点赞数

分类专栏：动画

原文链接：https://blog.csdn.net/ycwol/article/details/41118831

版权

动画专栏收录该内容

32 篇文章 0 订阅

订阅专栏

在Android应用程序，使用动画效果，能带给用户更好的感觉，做动画可以通过XML或Android代码来实现。

Animation动画效果的实现可以通过两种方式进行实现，一种是tweened animation （渐变动画），另一种是frame by frame animation （画面转换动画）。

tweened animation渐变动画有以下两种类型：

1.alpha 渐变透明度动画效果

2.scale 渐变尺寸伸缩动画效果

frame by frame animation 画面转换动画有以下两种类型：

1.translate 画面转换位置移动动画效果

2.rotate 画面转移旋转动画效果

在这里，我使用XML来做动画。实现基本的动画，如淡入，旋转等。

步骤：1、首先在res目录中新建anim的文件夹，在anim中新建需要的动画xml资源文件。

anim/alpha.xml（渐变动画）

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<alpha
android:fromAlpha="0.1"
android:toAlpha="1.0"
android:duration="3000"/>

</set>
anim/scale.xml（伸缩动画）

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXScale="0.0"
android:toXScale="1.4"
android:fromYScale="0.0"
android:toYScale="1.4"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="false"
android:duration="700" />
</set>

anim/translate.xml(移动动画)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="30"
android:toXDelta="-80"
android:fromYDelta="30"
android:toYDelta="300"
android:duration="2000"/>

</set>
anim/rotate.xml(旋转动画)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromDegrees="0"
android:toDegrees="+350"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000" />

</set>
2、xml资源文件创建完成之后，接下来就是调用这些资源文件。以alpha为例，先创建AlphaActivity。

在activity_alpha.xml中随便放一张背景图片

<RelativeLayout 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:background="@drawable/test_bg"
tools:context=".AlphaActivity" >

</RelativeLayout>
AlphaActivity.java
package com.example.animation_demo;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.Toast;

public class AlphaActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
View view=View.inflate(this, R.layout.activity_alpha, null);
setContentView(view);
//使用AnimationUtils类的静态方法loadAnimation()来加载XML中的动画XML文件
Animation animation=AnimationUtils.loadAnimation(this, R.anim.alpha);
view.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation arg0) {} //在动画开始时使用

@Override
public void onAnimationRepeat(Animation arg0) {} //在动画重复时使用

@Override
public void onAnimationEnd(Animation arg0) {
Toast.makeText(AlphaActivity.this, "在动画结束时使用", Toast.LENGTH_SHORT).show();
}
});
}
}
这个是整个layout文件的动画，也可以让任何UI元素调用starAnimation方法。

例如：textMsg.startAnimation(animation); 这时候就不需要下面代码动画填充指定xml了

View view=View.inflate(this, R.layout.activity_alpha, null);
setContentView(view);
直接setContentView(R.layout.activity_alpha); 就OK了。卒。
效果图：

附上找到的一些基本的xml效果：

Fade In：淡入
alpha是渐变透明度效果，值由0到1

fade_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >

<alpha
android:duration="1000"
android:fromAlpha="0.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="1.0" />
</set>
Fade Out ：淡出
以Fade In刚好相反，值由1到0
fade_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >

<alpha
android:duration="1000"
android:fromAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="0.0" />
</set>
Cross Fading: 交叉的淡入和淡出
同时使用Fade in和Fade out可以达到交叉的效果
public class CrossfadeActivity extends Activity implements AnimationListener {

TextView txtMessage1, txtMessage2;
Button btnStart;

Animation animFadeIn, animFadeOut;

@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_crossfade);

txtMessage1 = (TextView) findViewById(R.id.txtMessage1);
txtMessage2 = (TextView) findViewById(R.id.txtMessage2);
btnStart = (Button) findViewById(R.id.btnStart);

// load animations
animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.fade_in);
animFadeOut = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.fade_out);

// set animation listeners
animFadeIn.setAnimationListener(this);
animFadeOut.setAnimationListener(this);

// button click event
btnStart.setOnClickListener(new View.OnClickListener() {

@Override
public void onClick(View v) {
txtMessage2.setVisibility(View.VISIBLE);
txtMessage2.startAnimation(animFadeIn);
txtMessage1.startAnimation(animFadeOut);
}
});
}

@Override
public void onAnimationEnd(Animation animation) {

if (animation == animFadeOut) {
txtMessage1.setVisibility(View.GONE);
}

if(animation == animFadeIn){
txtMessage2.setVisibility(View.VISIBLE);
}
}

@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}

@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
}
BLink：若隐若现

blink.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="0.0"
android:toAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:duration="600"
android:repeatMode="reverse"
android:repeatCount="infinite"/>
</set>
Zoom In：放大
zoom_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXScale="1"
android:fromYScale="1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="3"
android:toYScale="3" >
</scale>
</set>
Zoom Out：缩小
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="0.5"
android:toYScale="0.5" >
</scale>
</set>
Rotate：旋转
rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="600"
android:repeatMode="restart"
android:repeatCount="infinite"
android:interpolator="@android:anim/cycle_interpolator"/>
</set>
好长啊。。。既然你们都看到这里了，再多说几句。。
根节点<set>的属性：

————————————————
版权声明：本文为CSDN博主「dgdisme」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/ycwol/article/details/41118831

锐湃

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
Animation动画的xml使用

在Android应用程序，使用动画效果，能带给用户更好的感觉，做动画可以通过XML或Android代码来实现。Animation动画效果的实现可以通过两种方式进行实现，一种是tweened animation （渐变动画），另一种是frame by frame animation （画面转换动画）。tweened animation渐变动画有以下两种类型：1.alpha 渐变透明度动画效果2.scale 渐变尺寸伸缩动画效果frame by frame animation ...
复制链接

扫一扫