Android的View动画
View动画其实就是使ImageView上的图片在隐藏、旋转、缩放、平移通过动画的过程显示。
布局代码,设置图片要通过src设置
<Button
android:text="透明动画"
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="@+id/alpha_image"
android:src="@mipmap/ic_launcher"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="@+id/alpha_image"
android:src="@mipmap/ic_launcher"
android:layout_width="match_parent"
android:layout_height="match_parent" /><ImageView
android:id="@+id/alpha_image"
android:src="@mipmap/ic_launcher"
android:layout_width="match_parent"
android:layout_height="match_parent" />
Java代码:
final ImageView alpha = (ImageView) findViewById(R.id.alpha_image);
Button button = (Button) findViewById(R.id.button2);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
/**
* AlphaAnimation 透明动画
* RotateAnimation 旋转动画
* ScaleAnimation 缩放动画
* TranslateAnimation 平移动画
* AnimationSet 组合动画
* 第一个参数是开始的透明度
* 第二个参数是结束的透明度
*/
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f,0.0f);
//设置动画的时间长度
alphaAnimation.setDuration(2000);
//设置重复的类型
alphaAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
alphaAnimation.setRepeatCount(2);
//设置是否停留在最终状态
alphaAnimation.setFillAfter(false);
//让动画执行起来
alpha.startAnimation(alphaAnimation);
}
});
效果图,就几行代码就可以完成了
要注意的一些问题
有些朋友不是使用startAnimation(alphaAnimation)启动的,而是使用下面的方式,会发现有些手机没有反应,这是因为一些手机不支持这种方法。
imageView.setAnimation(alphaAnimation);
alphaAnimation.start();
各种动画的Java代码
这种动画一般分成四类,那么我们就创建一个项目好好玩玩
透明动画
//AlphaAnimation 透明动画
//第一个参数是开始的透明度,第二个参数是结束的透明度,1.0完全透明,0.0完全透明
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
//设置动画的时间长度
alphaAnimation.setDuration(2000);
//设置重复的类型
alphaAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
alphaAnimation.setRepeatCount(2);
//设置是否停留在最终状态
alphaAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(alphaAnimation);
效果图
旋转动画
//RotateAnimation 旋转动画
//第一个参数是开始的的角度,第二个参数是结束的角度
//第三个参数是旋转中心的X坐标类型,Animation.RELATIVE_TO_SELF 表示自身
//第四个参数是X坐标,0.5f表示X的一半
//第五个参数是旋转中心的坐标类型,Animation.RELATIVE_TO_PARENT 表示父级容器
//第六个参数是Y坐标,0.5f表示X的一半
RotateAnimation rotateAnimation = new
RotateAnimation(0, 360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
//设置动画的时间长度
rotateAnimation.setDuration(2000);
//设置重复的类型
rotateAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
rotateAnimation.setRepeatCount(2);
//设置是否停留在最终状态
rotateAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(rotateAnimation);
效果图
缩放动画
//ScaleAnimation 缩放动画
//第一个参数和第二个参数是表示X轴从1倍变宽2倍
//第三个参数和第四个参数是表示轴从1倍变宽2倍
//第五个参数是中心的X坐标类型,Animation.RELATIVE_TO_SELF 表示自身
//第六个参数是X坐标,0.5f表示X的一半
//第七个参数是中心的坐标类型,Animation.RELATIVE_TO_PARENT 表示父级容器
//第八个参数是Y坐标,0.5f表示X的一半
ScaleAnimation scaleAnimation = new
ScaleAnimation(1,2,1,2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
//设置动画的时间长度
scaleAnimation.setDuration(2000);
//设置重复的类型
scaleAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
scaleAnimation.setRepeatCount(2);
//设置是否停留在最终状态
scaleAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(scaleAnimation);
效果图
平移动画
//TranslateAnimation 平移动画
//前四个参数是表示X轴父级容器的-0.5平移到父级容器的0.5
//后四个参数是表示Y轴父级容器的-0.5平移到父级容器的0.5
TranslateAnimation translateAnimation = new
TranslateAnimation(Animation.RELATIVE_TO_PARENT,-0.5f,Animation.RELATIVE_TO_PARENT,0.5f,
Animation.RELATIVE_TO_PARENT,-0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
//设置动画的时间长度
translateAnimation.setDuration(2000);
//设置重复的类型
translateAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
translateAnimation.setRepeatCount(2);
//设置是否停留在最终状态
translateAnimation.setFillAfter(true);
//可以设置一个动画插入器,可以添加一些效果,以下是一个跳动的效果
translateAnimation.setInterpolator(new BounceInterpolator());
//让动画执行起来
imageView.startAnimation(translateAnimation);
效果图
组合动画
//AnimationSet 组合动画
AnimationSet animationSet = new AnimationSet(false);
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
alphaAnimation.setDuration(2000);
alphaAnimation.setRepeatMode(Animation.REVERSE);
alphaAnimation.setRepeatCount(2);
alphaAnimation.setFillAfter(false);
//添加透明动画
animationSet.addAnimation(alphaAnimation);
RotateAnimation rotateAnimation = new
RotateAnimation(0, 360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
rotateAnimation.setDuration(2000);
rotateAnimation.setRepeatMode(Animation.REVERSE);
rotateAnimation.setRepeatCount(2);
rotateAnimation.setFillAfter(false);
//添加旋转动画
animationSet.addAnimation(rotateAnimation);
ScaleAnimation scaleAnimation = new
ScaleAnimation(1,2,1,2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
scaleAnimation.setDuration(2000);
scaleAnimation.setRepeatMode(Animation.REVERSE);
scaleAnimation.setRepeatCount(2);
scaleAnimation.setFillAfter(false);
//添加缩放动画
animationSet.addAnimation(scaleAnimation);
TranslateAnimation translateAnimation = new
TranslateAnimation(Animation.RELATIVE_TO_PARENT,-0.5f,Animation.RELATIVE_TO_PARENT,0.5f,
Animation.RELATIVE_TO_PARENT,-0.5f,Animation.RELATIVE_TO_PARENT,0.5f);
translateAnimation.setDuration(2000);
translateAnimation.setRepeatMode(Animation.REVERSE);
translateAnimation.setRepeatCount(2);
translateAnimation.setFillAfter(true);
translateAnimation.setInterpolator(new BounceInterpolator());
//添加平移动画
animationSet.addAnimation(translateAnimation);
//把整个动画组执行起来
imageView.startAnimation(animationSet);
效果图
整篇代码
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.dell.myapplication.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="alpha"
android:text="透明" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="rotate"
android:text="旋转" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="scale"
android:text="缩放" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="translate"
android:text="平移" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="set"
android:text="组合" />
</LinearLayout>
<LinearLayout
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imageView"
android:src="@mipmap/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
MainActivity.java
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.BounceInterpolator;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity {
private ImageView imageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.imageView);
}
public void alpha(View view) {
//AlphaAnimation 透明动画
//第一个参数是开始的透明度,第二个参数是结束的透明度,1.0完全透明,0.0完全透明
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
//设置动画的时间长度
alphaAnimation.setDuration(2000);
//设置重复的类型
alphaAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
alphaAnimation.setRepeatCount(2);
//设置是否停留在最终状态
alphaAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(alphaAnimation);
}
public void rotate(View view) {
//RotateAnimation 旋转动画
//第一个参数是开始的的角度,第二个参数是结束的角度
//第三个参数是旋转中心的X坐标类型,Animation.RELATIVE_TO_SELF 表示自身
//第四个参数是X坐标,0.5f表示X的一半
//第五个参数是旋转中心的坐标类型,Animation.RELATIVE_TO_PARENT 表示父级容器
//第六个参数是Y坐标,0.5f表示X的一半
RotateAnimation rotateAnimation = new
RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
//设置动画的时间长度
rotateAnimation.setDuration(2000);
//设置重复的类型
rotateAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
rotateAnimation.setRepeatCount(2);
//设置是否停留在最终状态
rotateAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(rotateAnimation);
}
public void scale(View view) {
//ScaleAnimation 缩放动画
//第一个参数和第二个参数是表示X轴从1倍变宽2倍
//第三个参数和第四个参数是表示轴从1倍变宽2倍
//第五个参数是中心的X坐标类型,Animation.RELATIVE_TO_SELF 表示自身
//第六个参数是X坐标,0.5f表示X的一半
//第七个参数是中心的坐标类型,Animation.RELATIVE_TO_PARENT 表示父级容器
//第八个参数是Y坐标,0.5f表示X的一半
ScaleAnimation scaleAnimation = new
ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
//设置动画的时间长度
scaleAnimation.setDuration(2000);
//设置重复的类型
scaleAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
scaleAnimation.setRepeatCount(2);
//设置是否停留在最终状态
scaleAnimation.setFillAfter(false);
//让动画执行起来
imageView.startAnimation(scaleAnimation);
}
public void translate(View view) {
//TranslateAnimation 平移动画
//前四个参数是表示X轴父级容器的-0.5平移到父级容器的0.5
//后四个参数是表示Y轴父级容器的-0.5平移到父级容器的0.5
TranslateAnimation translateAnimation = new
TranslateAnimation(Animation.RELATIVE_TO_PARENT, -0.5f, Animation.RELATIVE_TO_PARENT, 0.5f,
Animation.RELATIVE_TO_PARENT, -0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
//设置动画的时间长度
translateAnimation.setDuration(2000);
//设置重复的类型
translateAnimation.setRepeatMode(Animation.REVERSE);
//设置重复的次数
translateAnimation.setRepeatCount(2);
//设置是否停留在最终状态
translateAnimation.setFillAfter(true);
//可以设置一个动画插入器,可以添加一些效果,以下是一个跳动的效果
translateAnimation.setInterpolator(new BounceInterpolator());
//让动画执行起来
imageView.startAnimation(translateAnimation);
}
public void set(View view) {
//AnimationSet 组合动画
AnimationSet animationSet = new AnimationSet(false);
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
alphaAnimation.setDuration(2000);
alphaAnimation.setRepeatMode(Animation.REVERSE);
alphaAnimation.setRepeatCount(2);
alphaAnimation.setFillAfter(false);
//添加透明动画
animationSet.addAnimation(alphaAnimation);
RotateAnimation rotateAnimation = new
RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
rotateAnimation.setDuration(2000);
rotateAnimation.setRepeatMode(Animation.REVERSE);
rotateAnimation.setRepeatCount(2);
rotateAnimation.setFillAfter(false);
//添加旋转动画
animationSet.addAnimation(rotateAnimation);
ScaleAnimation scaleAnimation = new
ScaleAnimation(1, 2, 1, 2, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scaleAnimation.setDuration(2000);
scaleAnimation.setRepeatMode(Animation.REVERSE);
scaleAnimation.setRepeatCount(2);
scaleAnimation.setFillAfter(false);
//添加缩放动画
animationSet.addAnimation(scaleAnimation);
TranslateAnimation translateAnimation = new
TranslateAnimation(Animation.RELATIVE_TO_PARENT, -0.5f, Animation.RELATIVE_TO_PARENT, 0.5f,
Animation.RELATIVE_TO_PARENT, -0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
translateAnimation.setDuration(2000);
translateAnimation.setRepeatMode(Animation.REVERSE);
translateAnimation.setRepeatCount(2);
translateAnimation.setFillAfter(true);
translateAnimation.setInterpolator(new BounceInterpolator());
//添加平移动画
animationSet.addAnimation(translateAnimation);
//把整个动画组执行起来
imageView.startAnimation(animationSet);
}
}
使用XML方式创建动画
在res下创建文件夹anim,在anim创建alpha.xml(平移动画)
写上以下的代码:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="1"
android:toAlpha="0"
android:duration="2000"
android:repeatMode="reverse"
android:repeatCount="1">
</alpha>
在执行动画时,只需要两行代码就可以了
Animation animation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.alpha);
alpha.startAnimation(animation);
也可以实现动画,建议使用xml,思路更清晰