CODEWITHSUNDEEP
androidandroid-animationandroid-transitionstranslate-animation
Asset Bekbossynov
Asset Bekbossynov

Reputation: 1713

View blinks after animation

I have problem with any type of animations. I want to make material banner behavior, but with other animations. Actually I got the result, but the problem is that view is blinking after the animation. My code:

First example: 

val anim = TranslateAnimation(1f, 1f, 1f, 0f)
anim.duration = 300
banner.startAnimation(anim)
banner.visibility = View.INVISIBLE

Second example

val mTransition = Slide(Gravity.END)
mTransition.setDuration(300)
mTransition.addTarget(banner)

TransitionManager.beginDelayedTransition(banner, mTransition)
banner.setVisibility(View.GONE)

Can someone explain how to avoid blinking of the view and why it is happening.

Upvotes: 0

Views: 1015

Answers (3)

Asset Bekbossynov
Asset Bekbossynov

Reputation: 1713

I understand what was my problem with the help of @John Lee, but it solution does not was suitable for me, so I used Guideline component with AnimatedValue. My solution:

params = view.layoutParams as ConstraintLayout.LayoutParams
    anim = ValueAnimator.ofInt(fromY, toY)
    anim.addUpdateListener {
        params.guideBegin = it.animatedValue as Int
        view.layoutParams = params
    }

So, here fromY value is 0, toY value is height of banner and view is Guideline, which could received by view.height. I should mention that first my banner is constrained to top of Guideline, which is placed at constraintGuide_begin=0. Then I animated this guideline with help of code above and using anim.start(), anim.reverse() methods.

Upvotes: 0

Asset Bekbossynov
Asset Bekbossynov

Reputation: 1713

I solved problem of blinking of the view by animating it on other way. I used following strategy. First of all I used Guideline component of the ConstraintLayout. I constraint my banner to the top of it and place parameter layout_constraintGuide_begin = "0dp". After that I used ValueAnimator in order to get animated value for my Guideline and changed the guidebegin params of it(see the code).

        val params: ConstraintLayout.LayoutParams = guideline2.layoutParams as ConstraintLayout.LayoutParams

        animBanner = ValueAnimator.ofInt(0, banner.height + toolbar.height)

        animBanner!!.addUpdateListener {
            params.guideBegin = it.getAnimatedValue() as Int
            guideline2.layoutParams = params
        }

This is the declaration of animation. At the end it is enough to use animBanner.start() for starting the animation and animBanner.reverse() for reverse animation (hiding banner).

Upvotes: 0

Gioan Le
Gioan Le

Reputation: 1168

The problem is on the code banner.visibility = View.INVISIBLE and banner.setVisibility(View.GONE). Try to remove it.

If you want to the banner is gone after the animation ended. Try to add a listener on the animation and hide the banner after the animation ended:

        val anim = TranslateAnimation(1f, 1f, 1f, 0f)
        anim.duration = 300
        anim.setAnimationListener(object : Animation.AnimationListener {
            override fun onAnimationRepeat(animation: Animation?) {

            }

            override fun onAnimationEnd(animation: Animation?) {
                // banner.visibility = View.INVISIBLE
                // or
                // banner.setVisibility(View.GONE)
            }

            override fun onAnimationStart(animation: Animation?) {
            }

        })

Upvotes: 1

Related Questions