react-native-svg: Incorrect Image top/bottom alignment xMidYMin/xMidYMax between same iOS/Android SVG
Bug
If preserveAspectRatio used to align image to top/bottom on iOS and Android we can see diametrically opposite alignment. Looks like Y axis is incorrect on one of the platforms.
Environment info
React native info output:
System:
OS: macOS 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 23.68 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.4.0 - /usr/local/bin/node
Yarn: 1.19.0 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
Android SDK:
API Levels: 23, 25, 26, 27, 28
Build Tools: 27.0.3, 28.0.3
System Images: android-24 | Google Play Intel x86 Atom, android-25 | Google APIs Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-27 | Google APIs Intel x86 Atom, android-27 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5791312
Xcode: 11.0/11A420a - /usr/bin/xcodebuild
npmPackages:
@react-native-community/cli: 2.9.0 => 2.9.0
react: 16.9.0 => 16.9.0
react-native: 0.61.2 => 0.61.2
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-create-library: 3.1.2
react-native: 0.61.2 => 0.61.2
Library version: 9.9.5
Steps To Reproduce
<Image
x="0" y="100" width="50 height="150" source={ { uri: ... } }
preserveAspectRatio="xMidYMin meet" />
<Image
x="200" y="100" width="50" height="150" source={ { uri: ... } }
preserveAspectRatio="xMidYMax meet" />
Guys, please check, thanks a lot!
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 18
Commits related to this issue
- fix(ios): image viewBox opposite handling of y alignment, fixes #1138 — committed to software-mansion/react-native-svg by msand 5 years ago
- chore(release): 9.12.0 [skip ci] # [9.12.0](https://github.com/react-native-community/react-native-svg/compare/v9.11.1...v9.12.0) (2019-10-19) ### Bug Fixes * handle setting transform attribute on ... — committed to software-mansion/react-native-svg by semantic-release-bot 5 years ago
- chore(release): 9.12.0 [skip ci] # [9.12.0](https://github.com/react-native-community/react-native-svg/compare/v9.11.1...v9.12.0) (2019-10-19) ### Bug Fixes * handle setting transform attribute on ... — committed to JackWillie/react-native-svg by JackWillie 5 years ago
at least works fine for me locally