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

Accessibility does not work properly with nested ScrollViews #14766

Closed
Cxxxx100 opened this issue Jun 28, 2017 · 4 comments
Closed

Accessibility does not work properly with nested ScrollViews #14766

Cxxxx100 opened this issue Jun 28, 2017 · 4 comments
Labels
Resolution: Locked This issue was locked by the bot.

Comments

@Cxxxx100
Copy link

Is this a bug report?

Yes

Have you read the Bugs section of the Contributing to React Native Guide?

Yes

Environment

  1. react-native -v: 0.45.1
  2. node -v: v6.2.2
  3. npm -v: 3.9.5
  4. yarn --version (if you use Yarn): N/A

Then, specify:

  1. Target Platform (e.g. iOS, Android): Android
  2. Development Operating System (e.g. macOS Sierra, Windows 10): macOS
  3. Build tools (Xcode or Android Studio version, iOS or Android SDK version, if relevant): N/A

Steps to Reproduce

  1. Turn on Accessibility / Screen reader on your device
  2. Open the app: https://snack.expo.io/BJ9DuKbEb
  3. Use right swipe gesture to navigate the page

Expected Behavior

Accessibility content is read left to right, top to bottom, scrolling to read offscreen content

Actual Behavior

Content is read starting with the second item in the horizontal scroll view, then the first, and skipping the last item. When we get to the bottom of the screen vertical ScrollView is not scrolled and instead soft buttons at the bottom of the device are read

1ro4z9

Reproducible Demo

https://snack.expo.io/BJ9DuKbEb

@Cxxxx100
Copy link
Author

I was playing around with this a bit more and resolved the issue with the horizontal ScrollViews. I just needed to give the Text components the same margins.

However, the vertical ScrollView will still not scroll when I reach the bottom of the page. See the below animated gif:

1rofja

Here's a snack of the new code: https://snack.expo.io/SyQ8Osb4Z

I changed marginBottom: 5 to margin: 10 on the instructions style

@Cxxxx100
Copy link
Author

Seems this issue is specific to FireOS. I tested the following devices:

Nexus 5: ScrollView scrolls as expected
Samsung Galaxy S5: ScrollView scrolls as expected
Fire HD 6: ScrollView does NOT scroll as expected

@hramos
Copy link
Contributor

hramos commented Sep 21, 2017

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

  • Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
  • If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
  • Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

@hramos hramos added the Icebox label Sep 21, 2017
@hramos hramos closed this as completed Sep 21, 2017
@rkhatak
Copy link

rkhatak commented Aug 13, 2018

Hi,

I am using android emulator nexus s API and here nested scrollview is not working.
Please let me know if any workaround.

@facebook facebook locked as resolved and limited conversation to collaborators Aug 13, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Sep 21, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

4 participants