Glide: Shared Element Transitions not working well with Glide

[jmrboosties]

http://stackoverflow.com/questions/30923463/android-glide-library-not-working-with-shared-element-transitions

See the above Stack Overflow question for more details.

Using UIL I'm able to achieve the effect easily. I'd like to use Glide but if I can't get these transitions to work it might be a dealbreaker. Thanks!

[TWiStErRob]

Check https://github.com/bumptech/glide/issues/487, but mostly the related Glide group conversation I linked... I know it's long and messy, but that may help.

[jmrboosties]

I'll have a look at this, thank you!

[sjudd]

Are the ImageViews the same size? If not, try using override() to force them to be the same size?

Also if you have a simple sample app demonstrating this, I'd love to test this use case more. It's definitely something we should support.

[sjudd]

Let us know if you have more questions or want to post that sample app :)

[jmrboosties]

Sorry, was away from computer this weekend. I'll upload the sample app shortly.

[jmrboosties]

@sjudd link to a github project for the simple app I made trying to test the shared element transition with glide: https://github.com/jmrboosties/glide-sandbox

[boxcounter]

Same issue. Any news?

[TWiStErRob]

Hmm, this needs to be reopened, because we have a sample now.

[TWiStErRob]

There's a good workaround at https://github.com/bumptech/glide/issues/627#issuecomment-146136474, however it's async and delays transition until the image loads, which might take a while. Loading a lower quality one and then replacing it with a higher one may be better.

[MFlisar]

One important thing when postponing the transition:

DON'T use a thumbnail or so as this will result in a call of the onResourceReady when the thumbnail is ready and this does interfere with the transition...

[TWiStErRob]

@MFlisar I think you can add a separate .listener() to the thumbnail's load and to the main load separately so you have more control over when to react.

[MFlisar]

@TWiStErRob

Is this possible if I don't use a separate request but thumbnail(0.1f)?

[TWiStErRob]

Hmm that's tricky :) I think you can simply just copy the outer request into .thumbnail()'s parentheses and add .sizeMultiplier(), then you can easily add a listener. (Be careful to manually add the .fitCenter()/.centerCrop() to the thumb's load, that's not automagic.)

The main question is: is it worth loading a thumbnail if you will postpone the transition until the full load completes anyway? I would imagine adding a listener to thumbnail and start the transition on the low quality image, but I don't know what will happen when the full image arrives then... I didn't try this transition yet, but it's in my queue.

[MFlisar]

Actually, the question you ask is the reason I said "don't use a thumbnail". I just used it everywhere and therefore didn't realise that this is causing all my attempts to solve the problem to fail...

Actually I'm doing something like you say, but Glide loads my preview and afterwards the really big image is loaded behind it into a scalable subsamling view, so in my case I really don't want to use the thumbnail...

[sjudd]

So in the example @jmrboosties added a while ago, the flashing occurs because the ImageView in MainActivity and the ImageView in DifferentActivity are different sizes. To get a cache hit in Glide, the sizes need to be identical. You can force them to be identical using override().

In our applications we often define a couple of fixed sizes based on screen density to make it easy to do this kind of transition.

If you can't or don't want to use fixed sizes, then you won't get a memory cache hit, and the workaround @TWiStErRob pointed out earlier is also reasonable. As long as your images are reasonably sized, they will decode quickly and the delay won't really be noticeable.

This doesn't happen in Picasso/UIL/etc because they don't cache transformed images by default. The benefit of that approach is that it avoids this kind of problem. The disadvantage is that you frequently use more memory and end up with longer decode times than necessary. I'd imagine that you'd see a similar flash if you used the fit() API with Picasso.

Otherwise this is working as expected, so I'm going to re-close the issue.

[X3Daniel]

so,what is the final solution?

[TWiStErRob]

@X3Daniel it depends on what your problem is, read Sam's summary just above, read the related issues, try out https://github.com/TWiStErRob/glide-support/tree/master/src/glide3/java/com/bumptech/glide/supportapp/github/_847_shared_transition and if none of these help feel free to open a new issue where we can investigate your problem(s).

[X3Daniel]

@TWiStErRob Thanks a lot!! i will try the support project later~

[sjaramillo10]

Hopefully this answer can help you.

[fenrir-wangxin]

Same issue. Any news?