Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix incorrect border radius end value #6732

Merged
merged 2 commits into from
Nov 2, 2020
Merged

Fix incorrect border radius end value #6732

merged 2 commits into from
Nov 2, 2020

Conversation

guyca
Copy link
Collaborator

@guyca guyca commented Nov 2, 2020

While animating ReactImageView in shared element transition, we're changing the bounds of the destination image to max(sourceImage.bounds, destinationImage.bounds) and apply a clipping Rect.
This apparently messes up border-radius as Fresco isn't aware of the clipping Rect and draws the corners according to the actual image bounds.

This commit splits the clip bounds animator into two animators, one for Image and another for FastImage.
In the ReactImageView animator, we update both clip bounds and the drawable bounds

This was noticeable when the default resize mode (cover) was used.

Note: this or doesn't add support for animating border-radius in ReactImageView. This will be added hopefully in a separate PR

Before After
Screenshot_1604324543 Screenshot_1604324565

guyca added 2 commits November 2, 2020 12:16
It's currently unused but should be revisited soon.
While animating ReactImageView in shared element transition, we're changing the bounds of the destination image to max(sourceImage.bounds, destinationImage.bounds) and apply a clipping rect.
This apparently messes up border radius as Fresco isn't aware of the clipping rect and draws the corners according the actual image bounds.

This commit splits the clip bounds animator into two animators, one for Image and another for FastImage.
In the ReactImageView animator we update both clip bounds and the drawable bounds
Copy link
Collaborator

@mrousavy mrousavy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tested, borderRadius works 💪 (only scale isn't applied correctly, but that's another PR)

@guyca guyca changed the title Fix border radius issue Fix incorrect border radius end value Nov 2, 2020
@guyca guyca merged commit 1c5afc9 into master Nov 2, 2020
@guyca guyca deleted the fixBorderRadiusIssue branch November 2, 2020 16:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants