目录
1.帧动画
图片资源放入 mipmap 文件夹下
帧动画的资源文件,放在drawable文件夹下,在drawable文件夹引用drawable文件夹下的图片资源。
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/b0" android:duration="100"/>
<item android:drawable="@mipmap/b1" android:duration="100"/>
<item android:drawable="@mipmap/b2" android:duration="100"/>
<item android:drawable="@mipmap/b3" android:duration="100"/>
<item android:drawable="@mipmap/b4" android:duration="100"/>
<item android:drawable="@mipmap/b5" android:duration="100"/>
<item android:drawable="@mipmap/b6" android:duration="100"/>
</animation-list>
在布局页面,添加<Imageview> 并设置其background
<ImageView
android:id="@+id/img_snow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/snow_animation"/>
在java文件中,获取imageview,并对其background进行动画设置
public class MainActivity extends AppCompatActivity {
private ImageView img_snow;
private AnimationDrawable animationDrawable;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img_snow=findViewById(R.id.img_snow);
animationDrawable=(AnimationDrawable) img_snow.getBackground();
animationDrawable.start();
}
}
随着时代的发展,自带的动画满足不了用户需求,所以需要我们自己自定义布局。
首先创建一个普通的Java文件继承AppCompatImageView并创建构造方法
public class FrameView extends androidx.appcompat.widget.AppCompatImageView {
public FrameView(@NonNull Context context) {
super(context);
}
public FrameView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
public FrameView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
}
然后编写图片的动画效果
public class FrameView extends androidx.appcompat.widget.AppCompatImageView {
AnimationDrawable anim;
public FrameView(@NonNull Context context) {
super(context);
}
public FrameView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
public FrameView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public void setAnim(AnimationDrawable anim) {
this.anim = anim;
}
public void setLocation(int top, int left){
setFrame(left, top, left+200, top+200);
}
@Override
protected void onDraw(Canvas canvas) {
try {
Field field = AnimationDrawable.class.getDeclaredField("mCurFrame");
field.setAccessible(true);
int curframe = field.getInt(anim);
// 当执行到最后一帧时,隐藏起来
if (curframe == anim.getNumberOfFrames() - 1) {
setVisibility(View.INVISIBLE);
}
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
}
super.onDraw(canvas);
}
}
在Activity中实现动画效果
public class MainActivity extends AppCompatActivity {
private AnimationDrawable anim;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 帧布局 自定义了一个帧布局
FrameLayout fly = new FrameLayout(MainActivity.this);
setContentView(fly);
// 创建自定义控件
FrameView fv = new FrameView(MainActivity.this);
// 给控件设置背景
fv.setBackgroundResource(R.drawable.img_zhuan);
// 图片不可见
fv.setVisibility(View.INVISIBLE);
// 将背景图转为动画
anim = (AnimationDrawable) fv.getBackground();
// 将动画传递给fv,就是为了动画执行完毕后,图片隐藏起来
fv.setAnim(anim);
// 向布局当中添加控件
fly.addView(fv);
fly.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
anim.stop();
float x = event.getX();
float y = event.getY();
fv.setLocation((int) y - 40, (int) x - 20);
fv.setVisibility(View.VISIBLE);
anim.start();
}
return false;
}
});
}
}
2.补间动画
补间动画的资源文件,放在 anim文件夹下,首先创建anim文件夹。
然后在anim下创建资源文件
2.1.1透明度渐变动画
anim下的资源文件
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="2000"/>
Java代码:使用AnimationUtils加载动画效果,用图片容器启动动画。
public class MainActivity extends AppCompatActivity {
private Button btn_alpha;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_alpha=findViewById(R.id.btn_alpha);
btn_alpha.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.anim_alpha);
iv_trans.startAnimation(animation);
}
});
}
}
2.1.2缩放渐变动画
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXScale="0.0"
android:toXScale="1.5"
android:fromYScale="0.0"
android:toYScale="1.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="10000"/>
public class MainActivity extends AppCompatActivity {
private Button btn_scale;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_scale=findViewById(R.id.btn_scale);
btn_scale.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.anim_scale);
iv_trans.startAnimation(animation);
}
});
}
2.1.3位移渐变动画
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXDelta="-1085"
android:toXDelta="0"
android:fromYDelta="0"
android:toYDelta="0"
android:duration="2000"/>
public class MainActivity extends AppCompatActivity {
private Button btn_translate;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_translate=findViewById(R.id.btn_translate);
btn_translate.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.anim_translate);
iv_trans.startAnimation(animation);
}
});
}
2.1.4旋转渐变动画
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromDegrees="0"
android:toDegrees="360"
android:duration="2000"
android:repeatCount="1"
android:repeatMode="reverse"/>
public class MainActivity extends AppCompatActivity {
private Button btn_rotate;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_rotate=findViewById(R.id.btn_rotate);
btn_rotate.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.anim_translate);
iv_trans.startAnimation(animation);
}
});
}
2.1.5组合渐变动画
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator"
android:shareInterpolator="true">
<scale
android:fromXScale="0.0"
android:toXScale="1.5"
android:fromYScale="0.0"
android:toYScale="1.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="10000"/>
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:duration="20000"
android:repeatCount="1"
android:repeatMode="reverse"/>
</set>
public class MainActivity extends AppCompatActivity {
private Button btn_set;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_set=findViewById(R.id.btn_set);
btn_set.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.anim_set);
iv_trans.startAnimation(animation);
}
});
}
2.2activity进场动画
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXDelta="-1085"
android:toXDelta="0"
android:fromYDelta="0"
android:toYDelta="0"
android:duration="2000"/>
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXDelta="0"
android:toXDelta="1085"
android:fromYDelta="0"
android:toYDelta="0"
android:duration="2000"/>
public class MainActivity extends AppCompatActivity {
private Button btn_jump;
private ImageView iv_trans;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
iv_trans=findViewById(R.id.iv_trans);
btn_jump=findViewById(R.id.btn_jump);
btn_jump.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Intent intent = new Intent(MainActivity.this, MainActivity2.class);
startActivity(intent);
overridePendingTransition(R.anim.anim_translate, R.anim.anim_translate1);
}
});
}
}
3.属性动画
补间动画只是改变View的显示效果,不会去改变View的属性
使用补间动画实现左边的按钮移到右边,但是此时的按钮其实还停留在左边,假如你去点右面的按钮,是不会触发按钮的点击事件的。
属性动画通过对目标对象进行赋值来修改其属性,上面那个按钮问题就不存在了。
注:以下代码使用了butter Knife(黄油刀)butterKnife使用方法
3.1移动动画
public class MainActivity extends AppCompatActivity {
@BindView(R.id.btn_animtor1)
Button btn_animtor1;
@BindView(R.id.ly_root)
LinearLayout ly_root;
@BindView(R.id.iv_trans)
ImageView iv_trans;
private int width;
private int height;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(MainActivity4.this);
}
//移动动画
@OnClick(R.id.btn_animtor1)
public void btn_animtor1(){
width = ly_root.getWidth();
height = ly_root.getHeight();
ValueAnimator valueAnimator=ValueAnimator.ofInt(height,0,height/4,height/2,height/4*3,height);
valueAnimator.setDuration(2000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
int x = width / 2;
int y = (int) valueAnimator.getAnimatedValue();
moveView(iv_trans,x,y);
}
});
valueAnimator.setInterpolator(new LinearInterpolator());
valueAnimator.start();
}
public void moveView(View view, int x, int y){
int left=x-view.getWidth()/2;
int top=y-view.getHeight();
int weight=left+view.getWidth();
int height=top+view.getHeight();
view.layout(left,top,weight,height);
}
}
3.2缩放动画
public class MainActivity extends AppCompatActivity {
@BindView(R.id.btn_animtor)
Button btn_animtor;
@BindView(R.id.iv_trans)
ImageView iv_trans;
private int width;
private int height;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(MainActivity4.this);
}
//缩放动画
@OnClick(R.id.btn_animtor)
public void btn_animtor(){
// 第一种方式:
// final float scale=0.5f;
// AnimatorSet scaleSet=new AnimatorSet();
//
// ValueAnimator valueAnimator1=ValueAnimator.ofFloat(1.5f,scale);
// valueAnimator1.setDuration(2000);
// valueAnimator1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
// @Override
// public void onAnimationUpdate(ValueAnimator valueAnimator) {
// float scale= (float) valueAnimator.getAnimatedValue();
// iv_trans.setScaleX(scale);
// iv_trans.setScaleY(scale);
// }
// });
//
// ValueAnimator valueAnimator2=ValueAnimator.ofFloat(scale,1.5f);
// valueAnimator2.setDuration(2000);
// valueAnimator2.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
// @Override
// public void onAnimationUpdate(ValueAnimator valueAnimator) {
// float scale= (float) valueAnimator.getAnimatedValue();
// iv_trans.setScaleX(scale);
// iv_trans.setScaleY(scale);
// }
// });
//
// scaleSet.play(valueAnimator1).after(valueAnimator2);
// scaleSet.start();
// 第二种方式
ValueAnimator valueAnimator=ValueAnimator.ofFloat(1.5f,0.5f,1.5f,0.5f);
valueAnimator.setDuration(4000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
float scale = (float) valueAnimator.getAnimatedValue();
iv_trans.setScaleX(scale);
iv_trans.setScaleY(scale);
}
});
valueAnimator.setInterpolator(new LinearInterpolator());
valueAnimator.start();
}
}
3.3旋转的同时透明度变化
public class MainActivity extends AppCompatActivity {
@BindView(R.id.btn_animtor)
Button btn_animtor;
ImageView iv_trans;
private int width;
private int height;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(MainActivity4.this);
}
//旋转的同时透明度变化
@OnClick(R.id.btn_animtor)
public void btn_animtor(){
ValueAnimator valueAnimator=ValueAnimator.ofInt(0,360);
valueAnimator.setDuration(4000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
int rotateValue = (int) valueAnimator.getAnimatedValue();
iv_trans.setRotation(rotateValue);
float fractionValue = valueAnimator.getAnimatedFraction();
iv_trans.setAlpha(fractionValue);
}
});
valueAnimator.setInterpolator(new LinearInterpolator());
valueAnimator.start();
}
}
3.4圆形旋转
public class MainActivity extends AppCompatActivity {
@BindView(R.id.btn_animtor)
Button btn_animtor;
@BindView(R.id.ly_root)
LinearLayout ly_root;
@BindView(R.id.iv_trans)
ImageView iv_trans;
private int width;
private int height;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(MainActivity4.this);
}
//圆形旋转
@OnClick(R.id.btn_animtor)
public void btn_animtor(){
width = ly_root.getWidth();
height = ly_root.getHeight();
final int R=width/4;
ValueAnimator valueAnimator=ValueAnimator.ofFloat(0,(float) (2.0f * Math.PI));
valueAnimator.setDuration(2000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
// 圆的参数方程 x = R * sin(t) y = R * cos(t)
float t = (float) valueAnimator.getAnimatedValue();
int x=(int) (R * Math.sin(t)+width/2);
int y=(int) (R * Math.cos(t)+height/2);
moveView(iv_trans,x,y);
}
});
valueAnimator.setInterpolator(new LinearInterpolator());
valueAnimator.start();
}
public void moveView(View view, int x, int y){
int left=x-view.getWidth()/2;
int top=y-view.getHeight();
int weight=left+view.getWidth();
int height=top+view.getHeight();
view.layout(left,top,weight,height);
}
}
本文含有隐藏内容,请 开通VIP 后查看