现在android一般分为属性动画和传统动画。
而传统动画有分为帧动画和补间动画。今天就来了解下这两个,就当做个笔记。
帧动画
帧动画有点其实就是类似gif的动画,用一张一张的图片叠加产生的动画,不过缺点也是很明显的,如果每张图片都很大,就很影响性能。所以现在其实比较少用了。
帧动画的使用也很简单,这里准备三张图片。
然后加入xml资源文件。
animation_frame_play.xml
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item
android:drawable="@drawable/animation_voice_playing_f1"
android:duration="500" />
<item
android:drawable="@drawable/animation_voice_playing_f2"
android:duration="500" />
<item
android:drawable="@drawable/animation_voice_playing_f3"
android:duration="500" />
</animation-list>
android:drawable是图片地址,duration是动画持续时间。oneshot为false表示循环执行动画,如果为true则只执行一次动画。
执行代码:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<include layout="@layout/item_head_layout" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:id="@+id/iv_frame"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="@drawable/animation_frame_play"/>
</LinearLayout>
</LinearLayout>
val animationDrawable = iv_frame.drawable as AnimationDrawable
animationDrawable.start()
补间动画
补间动画可以用xml配置,也可以java动态实现。
xml配置如下:
透明度(alpha_anim.xml)
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromAlpha="1.0"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:toAlpha="0.0" />
旋转(rotate_anim.xml)
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"/>
位移(translate_anim.xml)
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:fromXDelta="0"
android:toXDelta="100%"
android:fromYDelta="0"
android:toYDelta="100%"/>
混合动画(sets_anim.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="1000"/>
<translate android:fromXDelta="0"
android:toXDelta="100%"
android:fromYDelta="0"
android:toYDelta="100%"
android:duration="1000"/>
<rotate
android:duration="1000"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"/>
</set>
使用方法:
val animation = AnimationUtils.loadAnimation(this@AnimationTweenActivity, R.anim.translate_anim)
iv_frame.startAnimation(animation)
简单说几个点:
Interpolator: 主要作用是可以控制动画的变化速率 ,就是动画进行的快慢节奏。
pivot 决定了当前动画执行的参考位置
java动态实现
/**
* 旋转动画
*/
private fun setRotateAnimation(){
// 效果以图片中心点为中心,从负90度到正90度,持续5s
// 1创建动画对象
val rotateAnimation = RotateAnimation(0f,360f, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// 2设置
rotateAnimation.duration = 5000
// 设置线性变化的插值器(线性变化,加速变化,减速变化,周期循环变化)
rotateAnimation.interpolator = LinearInterpolator()
// 动画重复Animation.INFINITE=-1表示无限旋转
rotateAnimation.repeatCount = Animation.INFINITE
// 3启动动画
iv_frame.startAnimation(rotateAnimation);
rotateAnimation.setAnimationListener(object: Animation.AnimationListener{
override fun onAnimationRepeat(animation: Animation?) {
Log.v("animation","动画重复")
}
override fun onAnimationEnd(animation: Animation?) {
Log.v("animation","动画结束")
}
override fun onAnimationStart(animation: Animation?) {
Log.v("animation","动画开始")
}
})
}
可以发现java动态类可以实现对动画的监听,简单动画的开始结束或者动画的重复。
注:
fillAfter: 如果设置为true,控件动画结束时,将保持动画最后时的状态
fillBefore: 如果设置为true,控件动画结束时,还原到开始动画前的状态
做补间动画的你会,你会发现一个问题,控件平移动画之后,点击事件没有移动,必须点原来的位置。为什么呢?
View做在做动画的时候,它并没有真正的移动它的位置。而是根据动画时间的插值,计算出一个Matrix,然后不停的invalidate,在onDraw中的Canvas上使用这个计算出来的Matrix去draw这个View的内容。
换句话说,View在做动画的时候,它的位置根本没有变化,只是画它的时候进行了Matrix处理,使得它看起来变化了。那么,动画中的View点击事件的判断区域,应该是它“看起来”的那片区域,而不是它layout的那片区域。
当然,下一章节的属性动画就不会有这种问题。
github地址:https://gitee.com/stonezry/AndroidDemo