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

LayoutAnimation displays black background on view with borderTopRightRadius #24004

Closed
blitzcrank opened this issue Mar 18, 2019 · 5 comments
Closed
Labels
API: LayoutAnimation Bug Priority: Low Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@blitzcrank
Copy link

blitzcrank commented Mar 18, 2019

🐛 Bug Report

A parent view has style={{ overflow: 'hidden', borderTopRightRadius: 5 }}
Inside the parent a child view is rendered with a LayoutAnimation. The surface which is hidden behind the rounded corners has a black background color during the LayoutAnimation

To Reproduce

Using LayoutAnimation to display a view inside a parent View that has style={{ overflow: 'hidden', borderTopRightRadius: 5 }} on it.
The bug is reproducable with any of the border(Top)(Bottom)(Left)(Right)Radius properties. There is no problem when using borderRadius.

Expected Behavior

There should be no black background color during the animation.

Code Example

https://snack.expo.io/@bugreport2/layoutanimation-bug

Environment

React Native Environment Info:
System:
OS: macOS 10.14.3
CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
Memory: 2.49 GB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 11.2.0 - /usr/local/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
IDEs:
Android Studio: 3.2 AI-181.5540.7.32.5056338
Xcode: 10.1/10B61 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.1 => 0.59.1
npmGlobalPackages:
react-native-cli: 2.0.1

@react-native-bot
Copy link
Collaborator

It looks like you are using an older version of React Native. Please update to the latest release, v0.59 and verify if the issue still exists.

The "Resolution: Old Version" label will be removed automatically once you edit your original post with the results of running `react-native info` on a project using the latest release.

@blitzcrank
Copy link
Author

Bug confirmed on latest version of React Native 0.59.1

@michalchudziak
Copy link
Contributor

The issue is reproducible with the latest release (0.59.5)

@stale
Copy link

stale bot commented Aug 2, 2019

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Aug 2, 2019
@stale
Copy link

stale bot commented Aug 9, 2019

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

@stale stale bot closed this as completed Aug 9, 2019
@facebook facebook locked as resolved and limited conversation to collaborators Aug 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
API: LayoutAnimation Bug Priority: Low Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

4 participants