IjzerenHein / IjzerenHein/react-navigation-shared-element
[v5] Problem with borderRadius transformation if size of View(width, height) is different in each screen
- Dominant language
- TypeScript
- Stars
- 1.3k
- Forks
- 125
- PR merge metrics
- No merged PRs in 30d
Description
I am trying to create a shared element transition but i am facing this issue.
If the element (View) in the first screen has a borderRadius( e.g 10) and in the second screen the size of the
element is different (with or without borderRadius), then i notice a flickering transformation on the border
on my way back to the first screen.
Anyone with the same problem???
### ***EXAMPLE OF FLICKERING TRANSFORMATION ON VIEW'S BORDER***
If now, the size(width, height) of the element (View) in the second screen is equal to the size of the element (View) of the
first screen, then the animation is smooth.
### ***EXAMPLE OF SMOOTH BORDER TRANSFORMATION WHEN WIDTH, HEIGHT IS EQUAL***
Any solutions to this?
Contributor guide
No contributing guide indexed for this repository
Research direction
Reproduce the shared-element transition described in the issue with different View widths and heights, then compare it with the equal-size case. Investigate the React Native shared-element transition path; done means the border transforms without flickering when the View dimensions differ on the return transition.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100