callstack / callstack/react-native-pager-view

Rendering in ScrollView makes gestures hard to be picked up on Android

Offen
#606 5 Kommentare 4 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
Vorherrschende Sprache
TypeScript
Sterne
3.4k
Forks
476
Ø Merge
10 T. 21 Std.
Gemergte PRs (30 T.)
2

Beschreibung

## Environment

Android
react-native: 0.66.4
react-native-pager-view: 5.4.15

## Description

Running into a couple of issues when rendering pager view inside ScrollView on Android.
1. Swiping diagonally at a small angle - 10-20 degrees - gets captured by scrollview and not pager view.
2. Swiping horizontally while the the scroll still has momentum doesn't get captured by pager view.3.

These issues combined make a terrible user experience on Android.

| Diagonal swipe | Scroll momentum |
|:--------------------------:|:-------------------------:|
| ![ezgif-3-9b2f3ca01b](https://user-images.githubusercontent.com/10097195/190983276-7d64ef2a-5a50-4c4e-81b5-0a164c159731.gif) | ![ezgif-3-6767ceb422](https://user-images.githubusercontent.com/10097195/190983313-d325c31e-91ed-491f-835b-84d3940307e1.gif) |

## Reproducible Demo

https://snack.expo.dev/D1avOzeAs?platform=android

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit der verlinkten reproduzierbaren Expo Snack-Demo auf Android und reproduziere sowohl die Fälle mit diagonalem Wischen als auch mit Scroll-Impuls, die im Issue beschrieben sind. Verfolge, wie React Native PagerView und die umgebende ScrollView Gesten verarbeiten; abgeschlossen ist die Aufgabe, wenn horizontale Pager-Wischbewegungen in beiden Situationen zuverlässig erfasst werden, ohne das Scrollen zu beeinträchtigen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
android, react-native, typescript
Bereich
mobile
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
38/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.