Turn off blinking when loading into ImageView.

[ar-g]

I'm using
compile 'com.github.bumptech.glide:glide:3.6.1
this way, loading local drawables into imageViews

Glide.with(getContext()).load(resIds[item]).dontAnimate().diskCacheStrategy(DiskCacheStrategy.ALL).into(imageViews.get(i));

infact it works faster then setImageDrawable() but it's giving blinking effect. ImageViews changing every 300ms and when I use setImageDrawable() there is no such effect. How to avoid it?

[TWiStErRob]

The best answer looks like: use a GIF for animation.

The blinking comes from Glide setting the placeholder every time you call into. The problem is that placeholder is not set, hence null. Take a look at #527 for possible solutions (you can ignore the listener if you don't want crossfade).

Note: you shouldn't use ALL for local resources. The images are already taking up space inside the APK, no need to duplicate them.

[sebnapi]

Can you elaborate on this for Glide 4.0.0? I changed your code from #527 to:

    Glide.with(mContext)
        .asDrawable()
        .load(imagedata)
        .thumbnail(Glide.with(mContext)
                .asDrawable()
                .load(oldImagedata))
        .listener(new RequestListener<Drawable>() {
            @Override
            public boolean onLoadFailed(GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
                return false;
            }

            @Override
            public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                if (isFirstResource) {
                    return false; // thumbnail was not shown, do as usual
                }
                return new DrawableCrossFadeFactory()
                        .build(DataSource.LOCAL, false) // force crossFade() even if coming from memory cache
                        .transition(resource, (Transition.ViewAdapter) target);
            }
        })
        .into(imgView);

And it's not helping at all, the images still blink and flicker. Is this a desired behavior, why is a no-flicker-policy default?

[TWiStErRob]

The flickering is caused by you loading images into the same view in quick succession. That's not resource (CPU, memory, battery) friendly and hence not the main focus of Glide.

Try to add .fitCenter() or .centerCrop() inside the thumbnails parentheses (whichever you use on the ImageView), I think you may be missing the cache.

Above you said you're using 3.6.1. I hope it's clear that 4.0 is not released yet so there may be bugs. Can you please try what you're doing in 3.6.1 if adding the transformation doesn't help?

[sebnapi]

@TWiStErRob I'm somebody else, with a similar problem as OP. I created a No-Flicker-Target such that the onLoadStarted does not set the View null, I know it is hacky, what would be the right way to do it? The image loading happens on user input.

[TWiStErRob]

Hmm, sorry about confusing you with OP. The problem with onLoadStarted is that if you don't clear the view Glide will still consider the Bitmap still showing in the ImageView as "free to recycle", and load the next Image into it. Now, if a draw happens while loading the image, strange things can happen.

The right way is to let that Bitmap go, either by copying it, or "re-loading" it quickly via Glide. This thumbnail trick relies on the fact that onLoadStarted will set the drawable to null in the ImageView, but immediately after that Glide will hit the memory cache and set the old image back. Flicker won't happen in this case because there's no UI loop happening between onLoadStarted and onResourceReady, hence no re-draw can happen. No custom target necessary!

The possible fix I suggested still stands: you must match the transformation inside thumbnail to the outside one. Currently the thumbnail load has an implicit .dontAnimate() and the outside load has an implicit .fitCenter() or .centerCrop() based on what's set in XML. I tried to point these out in the code comments on #527 (comment) take another look. Of course for 4.0 you'll need something like: .apply(RequestOptions.fitCenterTransform(context)).

If it still doesn't work, enable logging and check what's the difference between the "real old cache key" and the "thumbnail old cache key". Even if it works, you should play around with your current code to see the difference, it's a useful tool in your toolbox of debugging.

I would also suggest commenting the .listener() out until you get the non-flicker right, and then try to force cross-fade.

[sebnapi]

Thank you, I'll try.

[TWiStErRob]

@sebnapi assuming your problem was resolved, because you didn't ask more questions
@ar-g feel free to reopen if you have more questions or information

[sondevelopervn]

The flickering is caused by you loading images into the same view in quick succession. That's not resource (CPU, memory, battery) friendly and hence not the main focus of Glide.

Try to add .fitCenter() or .centerCrop() inside the thumbnails parentheses (whichever you use on the ImageView), I think you may be missing the cache.

Above you said you're using 3.6.1. I hope it's clear that 4.0 is not released yet so there may be bugs. Can you please try what you're doing in 3.6.1 if adding the transformation doesn't help?

Thank you!