Android - AlphaAnimation - FadeOut ImageView than FadeIn other ImageView

Question

I have a logo on my page, with a certain event I would like to make an error image appear instead of the logo, which goes to FadeOut and then the logo reappears in FadeIn

  val errorDrawable = getDrawable(R.drawable.error)
        imageView.setImageDrawable(errorDrawable)

        val errorFadeOut = AlphaAnimation(1f, 0f)
        errorFadeOut.interpolator = AccelerateInterpolator()
        errorFadeOut.duration = 2000

        errorFadeOut.setAnimationListener(object: Animation.AnimationListener{
            override fun onAnimationRepeat(animation: Animation?) {

            }

            override fun onAnimationEnd(animation: Animation?) {
                imageView.visibility = View.INVISIBLE
            }

            override fun onAnimationStart(animation: Animation?) {

            }
        })
        imageView.startAnimation(errorFadeOut)

        val logoFadeIn = AlphaAnimation(0f, 1f)
        logoFadeIn.interpolator = DecelerateInterpolator()
        logoFadeIn.startOffset = 2000
        logoFadeIn.duration = 1000

        val logoDrawable = getDrawable(R.drawable.logo)
        imageView.setImageDrawable(logoDrawable)

        logoFadeIn.setAnimationListener(object: Animation.AnimationListener{
            override fun onAnimationRepeat(animation: Animation?) {
            }

            override fun onAnimationEnd(animation: Animation?) {
            }

            override fun onAnimationStart(animation: Animation?) {
                imageView.visibility = View.VISIBLE
            }

        })
        imageView.startAnimation(logoFadeIn)

In my case, with this code, the problem is that the error logo that should go to fadeOut is never displayed (while the original logo that goes to FadeIn later works)

If I removed the second animation, the first one is displayed correctly. It would seem that together, one after the other, only the second is taken (or that the second "overwrites" the first)

Answer 1

use glide. u can animate change with it and do a lots of work with images

implementation 'com.github.bumptech.glide:glide:4.11.0'


    DrawableCrossFadeFactory factory =
            new DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build();


Glide.with(java.util.Objects.requireNonNull(getActivity()))
.load(R.drawable.logo)
.transition(DrawableTransitionOptions.withCrossFade(factory))
.skipMemoryCache(true)
.diskCacheStrategy(DiskCacheStrategy.RESOURCE)
.into(imageView)

use this code

 val factory: DrawableCrossFadeFactory =
            DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build()

if(error){
        Glide.with(this).load(R.drawable.error)
            .transition(DrawableTransitionOptions.withCrossFade(factory))
            .skipMemoryCache(true)
            .diskCacheStrategy(DiskCacheStrategy.RESOURCE)
            .into(imageView)

}else{
      Glide.with(this).load(R.drawable.logo)
         .transition(DrawableTransitionOptions.withCrossFade(factory))
         .skipMemoryCache(true)
         .diskCacheStrategy(DiskCacheStrategy.RESOURCE)
         .into(imageView)

}