DSLAnimator

This is a quick and elegant tool for writing Android animations using DSL in Kotlin. The project is a DSL tool wrapped in Kotlin’s lambda expressions and extension functions. If you have some Kotlin background and like the elegance of DSLS, this project is a good learning experience.

What can it do?

When we write projects, it is essential that we often animate the components with transition animations so that they can interact with the user more vividly without being boring and disjointed. So what DSLAnimator can do is make it easier and clearer for you to write animations without having a lot of animation code confusing the rest of your business reading experience. Basically, we moved the XML configuration animation into the Kotlin code and made the process much more integrated. The only feature of DSLAnimator is that it makes Android animation development easier and clearer.

Use the compare

The traditional writing

The animation above increases the width and height of a button and has a gradient animation of color.

val width = ValueAnimator.ofInt(mButton.width, 500)
val widthParams = mButton.layoutParams
width.addUpdateListener {
      widthParams.width = it.animatedValue as Int
      mButton.layoutParams = widthParams
}

val height = ValueAnimator.ofInt(mButton.height, 500)
val heightParams = mButton.layoutParams
      height.addUpdateListener {
      heightParams.height = it.animatedValue as Int
      mButton.layoutParams = heightParams
}

val color = ValueAnimator.ofFloat(0f, 1f)
color.addUpdateListener {
      val value = it.animatedValue as Float
      val color = ArgbEvaluator().evaluate(value,
                  Color.parseColor("# 636978"),
                  Color.parseColor("#1AD372")) as Int
      mButton.setBackgroundColor(color)
}

val set = AnimatorSet()
set.playTogether(width, height, color)
set.duration = 500
set.interpolator = OvershootInterpolator()
set.start()Copy the code

Use the DSL

With DSLS, you can see a lot less code and much clearer logic.

animSet {
   widthAnim {
        target = mButton
        values = intArrayOf(mButton.width, 500)
   }
   heightAnim {
        target = mButton
        values = intArrayOf(mButton.height, 500)
   }
   colorAnim {
        target = mButton
        startColor = "# 636978"
        endColor = "#1AD372"
   }

   duration = 500
   interpolator = OvershootInterpolator()
}.start()Copy the code

Two, how to use?

Please go to the project home page for detailed usage github.com/550609334/D…

1. Supported animation types

Currently only property animations are supported, and the following table lists the DSL node names corresponding to each property animation

The animation name	The node name
alpha	alphaAnim
scaleX	scaleXAnim
scaleY	scaleYAnim
translationX	translationXAnim
translationY	translationYAnim
translationZ	translationZAnim
rotation	rotationAnim
rotationX	rotationXAnim
rotationY	rotationYAnim
width	widthAnim
height	heightAnim
color	colorAnim

4. Supported configuration items

1) Single animation

Configuration items	describe
target	The View to be animated on
values	The value of the animation to be moved is the same as the original property animation. Float to floatArray and int to intArray, such as floatArrayOf(0F, 100F) and intArrayOf(500).
repeatCount	Same as normal property animation
repeatMode	Same as normal property animation
duration	The last time
startDelay	How long to delay before the animation starts
interpolator	interpolator
startColor	Start color value, only colorAnim has this configuration item
endColor	End of color value, only colorAnim has this configuration item
onStart{}	The callback at the beginning of the animation
onRepeat{}	The animation repeats the callback
onCancel{}	The callback to which the animation was cancelled
onEnd{}	The callback at the end of the animation
onUpdate{}	During the animation run, the value is updated in the callback. The lambda also takes a callback to a ValueAnimator object. Variable values are available.

2) Assemble animation

Configuration items	describe
duration	The last time
startDelay	How long to delay before the animation starts
interpolator	interpolator
playMode	Set animation playback mode, two options. Play playmode. TOGETHER and playmode. SEQUENTIALLY, which is parallel by default.
onStart{}	The callback at the beginning of the animation
onRepeat{}	The animation repeats the callback
onCancel{}	The callback to which the animation was cancelled
onEnd{}	The callback at the end of the animation
onUpdate{}	During the animation run, the value is updated in the callback. The lambda also takes a callback to a ValueAnimator object. Variable values are available.

2, Use suggestions.

You can actually declare an animation at the head of the class with a lazy load. Then call it where you need it. This will not waste resources, keep the animation code out of the way and not interfere with business, and dynamically configure the value of the animation.

class MainActivity : AppCompatActivity() {

    private val anim by lazy {
        animSet {
            widthAnim {
                target = mButton
                values = intArrayOf(mButton.width, 500)
            }
            heightAnim {
                target = mButton
                values = intArrayOf(mButton.height, 500)
            }
            colorAnim {
                target = mButton
                startColor = "# 636978"
                endColor = "#1AD372"
            }

            duration = 500
            interpolator = OvershootInterpolator()
        }
    }

    override fun onCreate(savedInstanceState: Bundle?). {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        mButton.setOnClickListener {
            anim.start()
        }
    }
}Copy the code

Email:[email protected]