You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
There's a good workaround at #627 (comment), 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 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.
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.
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...
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 @TWiStErRobpointed 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.
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...
After about an incredibly long day of debugging, I too figured out that the latest version of Glide still has issues when mixing lower-quality thumbnails with shared element transitions. I guess that when the full resource is ready, it replaces into the imageview, and that causes issues with the shared element transition (SET) zooming-in weirdly. The second time on, the SET fails completely because the image is replaced into the target so quickly that things just don't work.
I'm still exploring what can be done to fix this. My potential fix would be to just load the thumbnail (which would onlyRetrieveFromCache(true) so that the SET is quick), and on the success of that load will I trigger a load of the full-sized image resource in a separate Glide call.
Activity
TWiStErRob commentedon Jun 18, 2015
Check #487, but mostly the related Glide group conversation I linked... I know it's long and messy, but that may help.
jmrboosties commentedon Jun 18, 2015
I'll have a look at this, thank you!
sjudd commentedon Jun 18, 2015
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 commentedon Jun 21, 2015
Let us know if you have more questions or want to post that sample app :)
jmrboosties commentedon Jun 22, 2015
Sorry, was away from computer this weekend. I'll upload the sample app shortly.
jmrboosties commentedon Jun 22, 2015
@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 commentedon Sep 15, 2015
Same issue. Any news?
TWiStErRob commentedon Sep 15, 2015
Hmm, this needs to be reopened, because we have a sample now.
TWiStErRob commentedon Oct 16, 2015
There's a good workaround at #627 (comment), 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.
1 remaining item
TWiStErRob commentedon Oct 21, 2015
@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 commentedon Oct 21, 2015
@TWiStErRob
Is this possible if I don't use a separate request but
thumbnail(0.1f)
?TWiStErRob commentedon Oct 21, 2015
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 commentedon Oct 21, 2015
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 commentedon Oct 29, 2015
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 commentedon Jun 5, 2016
so,what is the final solution?
TWiStErRob commentedon Jun 5, 2016
@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 commentedon Jun 5, 2016
@TWiStErRob Thanks a lot!! i will try the support project later~
sjaramillo10 commentedon Jun 6, 2018
Hopefully this answer can help you.
fenrir-wangxin commentedon Jul 6, 2018
Same issue. Any news?
dakshj commentedon Jun 16, 2022
After about an incredibly long day of debugging, I too figured out that the latest version of Glide still has issues when mixing lower-quality thumbnails with shared element transitions. I guess that when the full resource is ready, it replaces into the imageview, and that causes issues with the shared element transition (SET) zooming-in weirdly. The second time on, the SET fails completely because the image is replaced into the target so quickly that things just don't work.
I'm still exploring what can be done to fix this. My potential fix would be to just load the thumbnail (which would
onlyRetrieveFromCache(true)
so that the SET is quick), and on the success of that load will I trigger a load of the full-sized image resource in a separate Glide call.