Unwanted offset when using Rotate + borderRadius on a view #22215
Labels
Bug
Component: View
Platform: Android
Android applications.
Platform: Linux
Building on Linux.
Priority: Low
Resolution: Locked
This issue was locked by the bot.
Environment
React Native Environment Info:
System:
OS: Linux 4.8 Ubuntu 16.10 (Yakkety Yak)
CPU: (4) x64 Intel(R) Core(TM) i5-6267U CPU @ 2.90GHz
Memory: 1.90 GB / 7.65 GB
Shell: 5.2 - /bin/zsh
Binaries:
Node: 8.3.0 - ~/.nvm/versions/node/v8.3.0/bin/node
Yarn: 1.10.1 - ~/.yarn/bin/yarn
npm: 5.3.0 - ~/.nvm/versions/node/v8.3.0/bin/npm
npmPackages:
react: 16.5.0 => 16.5.0
react-native: https://github.com/expo/react-native/archive/sdk-31.0.1.tar.gz => 0.57.1
npmGlobalPackages:
react-native-cli: 2.0.1
react-native: 0.57.4
I was developing with Expo SDK29 (based on react-native 0.55.4), and the issue happened only on Android 7 and higher. This is fine on iOS and Android < 7
Tried updating Expo to SDK 31 (based on react-native 0.57), and the behavior is still the same
Description
When using borderRadius + transform-rotate on a view, it is offset, as if the rotation was not based off the center of the view.
Issue only occurs when using both borderRadius and transform[{rotate: "xdeg"}], if using only one or the other, it behaves as expected.
Related to #19637
Related to #18266
Reproducible Demo
https://snack.expo.io/@justgox/react-native---border-radius-rotate-bug
I included three different views to illustrate variations of borderRadius and transform
The text was updated successfully, but these errors were encountered: