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

ScrollView does not work inside position: absolute on Android. #38729

Closed
mirekuhlir opened this issue Aug 1, 2023 · 1 comment
Closed

ScrollView does not work inside position: absolute on Android. #38729

mirekuhlir opened this issue Aug 1, 2023 · 1 comment

Comments

@mirekuhlir
Copy link

mirekuhlir commented Aug 1, 2023

Description

ScrollView does not work inside position: absolute on Android. Scrolling works on iOS.

React Native Version

0.71.11

Output of npx react-native info

System:
OS: macOS 12.6.4
CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
Memory: 131.35 MB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node
Yarn: 1.22.17 - /usr/local/bin/yarn
npm: 8.5.0 - ~/.nvm/versions/node/v16.14.0/bin/npm
Watchman: 2023.04.03.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.12.1 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
Android SDK: Not Found
IDEs:
Android Studio: 2022.1 AI-221.6008.13.2211.9514443
Xcode: 14.2/14C18 - /usr/bin/xcodebuild
Languages:
Java: 19.0.2 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.2.0 => 18.2.0
react-native: 0.71.11 => 0.71.11
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

Scrolling does not work on Android. It works on iOS.
<View style={{ height: 300, paddingTop: 100 }}> <View style={{ position: 'relative', height: 40, borderColor: 'red', borderWidth: 1, }}> <View style={{ height: 60, position: 'absolute', width: '100%', borderColor: 'green', borderWidth: 1, zIndex: 1000, elevation: 1000, }}> <ScrollView> <Text>1</Text> <Text>2</Text> <Text>3</Text> <Text>4</Text> <Text>5</Text> <Text>6</Text> </ScrollView> </View> </View> </View>

Snack, screenshot, or link to a repository

https://snack.expo.dev/3enX3_UHW

@github-actions
Copy link

github-actions bot commented Aug 1, 2023

⚠️ Too Old Version of React Native
ℹ️ It looks like your issue or the example you provided uses a Too Old Version of React Native.

Due to the number of issues we receive, we're currently only accepting new issues against one of the supported versions. Please upgrade to latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If you cannot upgrade, please open your issue on StackOverflow to get further community support.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant