属性动画简要介绍
安卓属性动画分为四种:
- 位置变化:TranslateAnimation
- 缩放: ScaleAnimation
- 旋转: RotateAnimation
- 渐变: AlphaAnimation
当然还可以将上面四种动画进行各种组合,可以采用串联或者并联实现多种效果.
动画实例
1. 位置变化
-
效果图:
- 代码:
private fun move(srcView: View, destView: View) {
val animateTime = 2000L
val yOffset = destView.top - srcView.top
val xOffset = destView.left - srcView.left
val animation = TranslateAnimation(0f, xOffset.toFloat(), 0f, yOffset.toFloat())
animation.fillAfter = true
animation.duration = animateTime
animation.setAnimationListener(object : Animation.AnimationListener {
override fun onAnimationEnd(animation: Animation) {
srcView.clearAnimation()
srcView.visibility = View.INVISIBLE
}
override fun onAnimationStart(animation: Animation) {}
override fun onAnimationRepeat(animation: Animation) {}
})
srcView.startAnimation(animation)
}
2. 缩小
-
效果图:
- 代码:
private fun scaleDown(srcView: View) {
val animateTime = 2000L
val animation = ScaleAnimation(1f, 0.2f, 1f, 0.2f,
Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f)
animation.fillAfter = true
animation.duration = animateTime
srcView.startAnimation(animation)
}
3. 放大
-
效果图:
- 代码:
private fun scaleDown(srcView: View) {
val animateTime = 2000L
val animation = ScaleAnimation(1f, 2f, 1f, 2f,
Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f)
animation.fillAfter = true
animation.duration = animateTime
srcView.startAnimation(animation)
}
4. 旋转
-
效果图:
- 代码:
private fun rotate(srcView: View) {
val animateTime = 2000L
val animation = RotateAnimation(0f, 360f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f)
animation.fillAfter = true
animation.duration = animateTime
srcView.startAnimation(animation)
}
5. 渐变(淡出)
-
效果图:
- 代码:
private fun fadeOut(srcView: View) {
val animateTime = 2000L
val animation = AlphaAnimation(1f, 0f)
animation.fillAfter = true
animation.duration = animateTime
srcView.startAnimation(animation)
}
6. 串联,淡出淡入
-
效果图:
- 代码:
private fun fadeOutAndFadeIn(srcView: View) {
val animateTime = 2000L
val fadeOutAnimation = AlphaAnimation(1f, 0f)
fadeOutAnimation.fillAfter = true
fadeOutAnimation.duration = animateTime
val fadeInAnimation = AlphaAnimation(0f, 1f)
fadeInAnimation.fillAfter = true
fadeInAnimation.duration = animateTime
fadeOutAnimation.setAnimationListener(object : Animation.AnimationListener {
override fun onAnimationEnd(animation: Animation) {
srcView.startAnimation(fadeInAnimation)
}
override fun onAnimationStart(animation: Animation) {}
override fun onAnimationRepeat(animation: Animation) {}
})
srcView.startAnimation(fadeOutAnimation)
}
7. 并联,移动并缩小
-
效果图:
- 代码:
private fun scaleDownAndMove(srcView: View, destView: View) {
val animateTime = 2000L
val scaleAnimation = ScaleAnimation(1f, 0.2f, 1f, 0.2f,
Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f)
val yOffset = destView.top - srcView.top
val xOffset = destView.left - srcView.left
val translateAnimation = TranslateAnimation(0f, xOffset.toFloat(), 0f, yOffset.toFloat())//平移动画 从0,0,平移到100,100
val animations = AnimationSet(false)
animations.addAnimation(scaleAnimation)
animations.addAnimation(translateAnimation)
animations.fillAfter = true
animations.duration = animateTime
animations.setAnimationListener(object : Animation.AnimationListener {
override fun onAnimationEnd(animation: Animation) {
srcView.clearAnimation()
srcView.visibility = INVISIBLE
}
override fun onAnimationStart(animation: Animation) {}
override fun onAnimationRepeat(animation: Animation) {}
})
srcView.startAnimation(animations)
}
Demo源代码
https://gitee.com/cxyzy1/animationDemo
安卓开发技术分享: https://www.jianshu.com/p/442339952f26
点击关注专辑,查看最新技术分享
更多技术总结好文,请关注:「程序园中猿」
网友评论