react-native-gesture-handler icon indicating copy to clipboard operation
react-native-gesture-handler copied to clipboard

Can't scroll RNGH exported ScrollView on Android

Open tpcstld opened this issue 1 year ago • 8 comments

Description

This might be a re-regression of https://github.com/software-mansion/react-native-gesture-handler/issues/2472 not totally sure.

On an Android device with TalkBack enabled, the ScrollView exported from react-native-gesture-handler cannot be scrolled with the two-finger scroll gesture. The similar export from react-native does not have this problem.

There may be a second-layer related issue where the scrolling does work, but then after two-finger scrolling, the tap gesture (e.g. on a Pressable) stops working. I can't repro this personally but I thought I might mention it.

Steps to reproduce

Here is some sample code that can repro the issue:

import React from "react";
import {
  ScrollView as ScrollViewRN,
  Pressable,
  StyleSheet,
} from "react-native";
import {
  GestureHandlerRootView,
  ScrollView,
} from "react-native-gesture-handler";

export default function RootLayout() {
  const ScrollViewComponent = false ? ScrollView : ScrollViewRN;
  return (
    <GestureHandlerRootView
      style={[StyleSheet.absoluteFill, { backgroundColor: "red" }]}
    >
      <ScrollViewComponent>
        {[
          1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
          21, 22, 23, 24,
        ].map((item) => (
          <Pressable
            key={item}
            style={{
              height: 100,
              backgroundColor: `#${Math.floor(
                Math.random() * 16777215
              ).toString(16)}`,
            }}
            onPress={() => {
              console.log("pressed");
            }}
          />
        ))}
      </ScrollViewComponent>
    </GestureHandlerRootView>
  );
}
  1. Build the app on a physical phone
  2. Enable TalkBack
  3. Try scrolling with two fingers up and down.

As shown in the following video, the scrolling only works if we're using the react-native component, and not the react-native-gesture-handler component.

https://github.com/user-attachments/assets/c227a018-eadd-4d9a-88ef-c0904b4cb739

Snack or a link to a repository

https://github.com/tpcstld/rn-stuff/blob/talkback-scroll-android/app/_layout.tsx

Gesture Handler version

2.20.2

React Native version

0.74.5

Platforms

Android

JavaScript runtime

Hermes

Workflow

None

Architecture

Paper (Old Architecture)

Build type

Debug mode

Device

Real device

Device model

Pixel 7 (Android 14)

Acknowledgements

Yes

tpcstld avatar Nov 13 '24 00:11 tpcstld

any updates? I have a same issue

ivaniuk7531 avatar Jan 23 '25 20:01 ivaniuk7531

Confirm.

RohovDmytro avatar Jan 24 '25 01:01 RohovDmytro

This is an issue for me on v2.24.0 with ScrollView and FlatList

marcshilling avatar Apr 04 '25 18:04 marcshilling

@marcshilling This was fixed for me in 2.25.0

aLemonFox avatar May 16 '25 14:05 aLemonFox

@marcshilling This was fixed for me in 2.25.0

Hmm, not for me. 2 finger scroll still not working. Nothing in the 2.25.0 release notes related to this?

Edit: I'm getting some sporadic behavior here. Sometimes it works and sometimes it doesn't on different app launches...enabling TalkBack either before app launch or after app launch. Not reliable enough.

marcshilling avatar May 16 '25 15:05 marcshilling

Sorry I posted too soon after seeing my ScrollView work with MaxPointer 1 set. That does seem to be fixed.

aLemonFox avatar May 16 '25 15:05 aLemonFox