Android动画和Transition系列文章
- 初识属性动画——使用Animator创建动画
- 再谈属性动画——介绍以及自定义Interpolator插值器
- 三谈属性动画——Keyframe以及ViewPropertyAnimator
- 让View具有减速效果的动画——FlingAnimation
- 让View具有弹性效果的动画——SpringAnimation
- 让View跟随状态动起来——StateListAnimator
- 仿抖音发布按住拍呼吸效果
- Jetpack学习之——使用动画缩放图片
- 使用动画隐藏或显示View
- Android中具有动画效果的图片资源
- ViewGroup内容改变时的动画效果—LayoutTransition
- 在布局切换之间实现Transition动画
- 在Activity切换之间实现Transition动画
- 让转场更加酷炫——自定义Transition
Android的Transition框架提供了在两个布局,即Scene之间的自动过渡,内置了AutoTransition、Fade、ChangeBounds动画,除此之外,也提供了给我们自定义Transition的途径。先看个效果:
可以看到,在两个场景中,背景色在渐渐变化。 ## 自定义Transition
将以上述例子,说明自定义Transition的步骤。
继承Transition
继承Transition,代码框架如下:
class CustomTransition : Transition() {
override fun captureStartValues(transitionValues: TransitionValues) {}
override fun captureEndValues(transitionValues: TransitionValues) {}
override fun createAnimator(
sceneRoot: ViewGroup,
startValues: TransitionValues?,
endValues: TransitionValues?
): Animator? {}
}
其中前两个方法是Transition中的抽象方法,为记录开始布局和结束布局的属性值所用;第三个方法为创建过渡动画,可以看到是一个属性动画Animator。
获取View属性值
通过对已有Transition代码的学习以及官方指导,可以这么写:
override fun captureStartValues(transitionValues: TransitionValues?) {
catureValues(transitionValues)
}
private fun catureValues(transitionValues: TransitionValues?) {
transitionValues?.values!![BACKGROUND_KEY] = transitionValues?.view?.background
}
override fun captureEndValues(transitionValues: TransitionValues?) {
catureValues(transitionValues)
}
-
最终都调用captureValues()方法,在该方法中保存属性值,属性值保存在transitionValues的values中,该values是一个map,这里的BACKGROUND_KEY的定义如下:
private val BACKGROUND_KEY = "com.xingfeng.jetpackdemo.animation.layoutanimate:CustomTransition:background"
官方建议我们以"packagename:classname:property_name"命名一个Key,这样可以很好的避免重复。
创建过渡动画
接下来就是在createAnimator()方法中实现动画了,本文的代码如下:
override fun createAnimator(sceneRoot: ViewGroup?, startValues: TransitionValues?, endValues: TransitionValues?): Animator? {
if (startValues == null || endValues == null) {
return null
}
val startDrawable = startValues?.values!![BACKGROUND_KEY] as Drawable
val endDrawable = endValues?.values!![BACKGROUND_KEY] as Drawable
if (startDrawable is ColorDrawable && endDrawable is ColorDrawable) {
val startColor = startDrawable.color
val endColor = endDrawable.color
if (startColor != endColor) {
return ObjectAnimator.ofObject(ArgbEvaluator(), startColor, endColor).apply {
addUpdateListener {
endValues?.view!!.setBackgroundColor(it?.animatedValue as Int)
}
duration = 3000
}
}
}
return null
}
createAnimator()方法的参数有三个,其中后两个保存了起始和结束的属性值,通过key可以取出值,这里如果两个view的背景是ColorDrawable,那么将执行一个动画,否则为null。
总结
可以看到自定义Transition的流程是比较简单的,主要可以说是两步:
-
在captureValues()方法中保存刚兴趣的属性值,该方法是captureStartValues()和captureEndValues()的委托;
-
在createAnimator()中取出感兴趣的属性,创建属性动画即可。
关于代码,请参考Github地址
参考
-
https://developer.android.google.cn/training/transitions/custom-transitions
-
https://medium.com/@belokon.roman/custom-transitions-in-android-f8949870bd63
-
https://github.com/lgvalle/Material-Animations