1. Animation Collection
class:
- The AnimationSet
function is weak and cannot be customized to organize the animations in the set in a certain order and then execute. - AnimatorSet
Neither set duplicate functions. . .
1, AnimationSet
use:
class MainActivity : AppCompatActivity() {
var TAG = "Animation"
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val button = findViewById<Button>(R.id.btn)
val animationSet = AnimationSet(true) //true—让这些动画共用AnimationSet设置插值器
val alphaAnimation = AlphaAnimation(0f, 1f)
alphaAnimation.duration = 3000
val rotateAnimation = RotateAnimation(0f,360f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF, 0.5f)
rotateAnimation.duration = 3000
alphaAnimation.repeatCount = Animation.INFINITE
rotateAnimation.repeatCount = Animation.INFINITE
animationSet.addAnimation(alphaAnimation)
animationSet.addAnimation(rotateAnimation)
animationSet.interpolator = AccelerateDecelerateInterpolator()
button.startAnimation(animationSet)
}
}
Note that you cannot set the loop in AnimationSet, because it will not work if set.
2、AnimatorSet
There are two ways to add animation to AnimatorSet:
- You can call AnimatorSet's playTogether (Animator []) or AnimatorSet's playSequentially (Animator []) method to add a set of animations at once
- You can also use the AnimatorSet's play (Animator) method in conjunction with the methods in the AnimatorSet.Builder class to add animations one by one.
There is still no way to set a loop in AnimatorSet
Come on:
playTogether (Animator [])
just let the animation start together, but the process and result are defined by each animation
class MainActivity : AppCompatActivity() {
var TAG = "Animation"
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
fun click(view: View) {
val animatorSet = AnimatorSet()
val button = findViewById<Button>(R.id.btn)
val backgroundColorAnimator = ObjectAnimator.ofInt(button, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation= ObjectAnimator.ofFloat(button, "Rotation", 0f, 360f)
animatorSet.playTogether(backgroundColorAnimator, rotation)
animatorSet.duration = 3000
animatorSet.start()
}
fun click2(view: View) {
val animatorSet = AnimatorSet()
val button2 = findViewById<Button>(R.id.btn2)
val backgroundColorAnimator = ObjectAnimator.ofArgb(button2, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation= ObjectAnimator.ofFloat(button2, "Rotation", 0f, 360f)
animatorSet.playTogether(backgroundColorAnimator, rotation)
backgroundColorAnimator.duration = 3000
rotation.duration = 6000
animatorSet.start()
}
}
We first set a different execution time for each animation on the second button
Here comes the understanding of the difference between the following ofInt setting color and ofArgb
- ofInt is accumulated by a little bit from the starting color to the target color.
- ofArgb can be understood as setting the gradient effect we usually set with ps.
playSequentially (Animator [])
sequential execution
class MainActivity : AppCompatActivity() {
var TAG = "Animation"
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
fun click(view: View) {
val animatorSet = AnimatorSet()
val button = findViewById<Button>(R.id.btn)
val backgroundColorAnimator = ObjectAnimator.ofInt(button, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation= ObjectAnimator.ofFloat(button, "Rotation", 0f, 360f)
animatorSet.playSequentially(backgroundColorAnimator, rotation)
animatorSet.duration = 3000
animatorSet.start()
}
fun click2(view: View) {
val animatorSet = AnimatorSet()
val button2 = findViewById<Button>(R.id.btn2)
val backgroundColorAnimator = ObjectAnimator.ofArgb(button2, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation= ObjectAnimator.ofFloat(button2, "Rotation", 0f, 360f)
animatorSet.playSequentially(backgroundColorAnimator, rotation)
backgroundColorAnimator.duration = 3000
rotation.duration = 6000
animatorSet.start()
}
}
Through the two button effects, we found that
when duration is set in AnimatorSet, each animation will be duration for a duration, the total duration: n * duration
For the playSequentially loop problem, take the above as an example. If you set an infinite loop in the first animation, the second animation will never be executed, and setting the duration in Animation is also invalid. Unless you cancel it manually
AnimatorSet.Builder
builder
three commonly used functions:
- Common usage:
animatorSet.play().with().before().after()
- with animation
- before precedent
- after
- play returns an AnimatorSet.Bulider object
So which animation sequence is it? Remember:
- A after BA is executed after B is executed
- A before BA is executed before B is executed
Verify it:
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
fun click(view: View) {
val animatorSet = AnimatorSet()
val button = findViewById<Button>(R.id.btn)
val backgroundColorAnimator = ObjectAnimator.ofInt(button, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation = ObjectAnimator.ofFloat(button, "Rotation", 0f, 360f)
animatorSet.duration = 3000
animatorSet.play(backgroundColorAnimator).before(rotation)
animatorSet.start()
}
fun click2(view: View) {
val animatorSet = AnimatorSet()
val button2 = findViewById<Button>(R.id.btn2)
val backgroundColorAnimator = ObjectAnimator.ofArgb(button2, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation = ObjectAnimator.ofFloat(button2, "Rotation", 0f, 360f)
backgroundColorAnimator.duration = 3000
rotation.duration = 6000
animatorSet.play(backgroundColorAnimator).after(rotation)
animatorSet.start()
}
}
How can these complex animation sequences be played repeatedly? Look at the code below:
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
fun click2(view: View) {
val animatorSet = AnimatorSet()
val button2 = findViewById<Button>(R.id.btn2)
val backgroundColorAnimator = ObjectAnimator.ofArgb(button2, "BackgroundColor", Color.WHITE, Color.BLACK, Color.WHITE)
val rotation = ObjectAnimator.ofFloat(button2, "Rotation", 0f, 360f)
backgroundColorAnimator.duration = 3000
rotation.duration = 6000
animatorSet.play(backgroundColorAnimator).after(rotation)
animatorSet.addListener(object : Animator.AnimatorListener{
override fun onAnimationRepeat(animation: Animator?) {
}
override fun onAnimationEnd(animation: Animator?) {
animation?.start()
}
override fun onAnimationCancel(animation: Animator?) {
}
override fun onAnimationStart(animation: Animator?) {
}
})
animatorSet.start()
}
}
After the animation execution is completed, reopen it.
Note that although onAnimationEnd has passed in an animation here, it does not mean every animation, but a big animation synthesized by each animation in the human home, so it will not be messy.
The next section enters the interpolator estimator, and ofObject () usage.
Hope to learn from you.