feat(android): added support for shared element transitions on ExtendedImageView #23
Conversation
|
This looks awesome! I'll look at it today :) |
|
Awesome :) |
|
@IjzerenHein do you mind setting up a repo with an example of using both libraries? |
Yes you're right, there should be an example for this. What kind of example would be the right one, a bare-bone one or a react-navigation integration? Also, I've noticed the border-radius isn't working as expected in the new code path. I'll need to fix that. I'll let you know when that is done. |
|
@IjzerenHein I think just a bare bone so I can see it in action. It doesn't have to be a part of this repo (that wasn't my intention), just something I can clone and run locally. |
Okay I understand. I've given it some thought it would probably be easiest if I extend the example in this project to show a shared-element transition. It has all the firebase stuff setup so it would basically be an additional screen (or 2) that I would need to add. I'll try to do that next week. cheers and have a good weekend Erez! |
|
Have a great weekend :) |
|
Hi, I haven't gotten around to this yet. For me it's a lower prio than other stuff atm, so I'll get back to this sometime later. |
|
Hey @IjzerenHein I'll try to look at it tomorrow |
|
@IjzerenHein Great solution with wrapping the image with a view. Love all the code removal. |
Hi! First of all, I'm a big fan of this library and it's awesome that it exists! 🎉🎉
This PR adds support for shared-element transitions to the Android ImageView.
This may sound strange but, but it's really a subtle change to how the transform is applied to the underlying BitmapDrawable, which is needed to make this library work with my new react-native-shared-element library, which is about to launch soon. It uses the ability of the underlying drawable in the ImageView to make perfect transitions between differently sized image-elements (and even different resize-modes).
When I was reading the code I figured out that the way the transform were done using Glide was to support images with different corner-radii. I have therefore updated the code in such a way so that it keeps this behavior when the border-radii are not the same for all corners. When however, no border-radii are defined (or they are all the same), then it lets the ImageView do the scaleType transform itself, instead of Glide. This in turn makes it possible to do pixel perfect shared element transitions.
Here is an example of a FirebaseUI Image transition after the fix:
And here is an example without the fix. You can see the incorrect stretching here due to the fact that the underlying BitmapDrawable is pre-transformed, instead of on the fly.
cheers,
Hein