react-navigation / react-navigation/react-navigation

Native Modal is jumping when dragging up on iOS

Offen
#10,900 6 Kommentare 5 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

bug platform:ios repro provided
Vorherrschende Sprache
TypeScript
Sterne
24.5k
Forks
5.1k
Ø Merge
1 T. 5 Std.
Gemergte PRs (30 T.)
18

Beschreibung

Current behavior

I use native stack with presentation: 'modal' option. When dragging modal up, it jumps at the bottom once I release. It works fine compared to native iOS applications.

If I switch to @react-navigation/stack (not native) there is no such issue.

Video:
Actual issue is at the bottom.
Screen Recording 2022-10-01 at 23 53 05

Expected behavior

Comparing to iOS calendar app:
Screen Recording 2022-10-01 at 23 53 48
Compared

Reproduction
Platform
  • Android
  • iOS
  • Web
  • Windows
  • MacOS
Packages
  • @react-navigation/​bottom-tabs
  • @react-navigation/​drawer
  • @react-navigation/​material-bottom-tabs
  • @react-navigation/​material-top-tabs
  • @react-navigation/​stack
  • @react-navigation/​native-stack
Environment
  • I've removed the packages that I don't use
package version
@react-navigation/native 6.0.13
@react-navigation/bottom-tabs 6.4.0
@react-navigation/native-stack 6.9.0
react-native-safe-area-context 4.2.5
react-native-screens 3.17.0
react-native-reanimated 2.8.0
react-native 0.68.1
npm or yarn yarn

I am able to reproduce on difference iOS and difference devices.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne damit, die iOS-Geste mit @react-navigation/native-stack unter Verwendung der gemeldeten Paketversionen zu reproduzieren, und vergleiche sie anschließend mit @react-navigation/stack und den bereitgestellten Aufzeichnungen. Untersuche die Integration von native-stack und react-native-screens, die am Ziehen von Modals beteiligt ist. Als abgeschlossen gilt die Änderung, wenn das Loslassen des Ziehens nach oben nicht mehr dazu führt, dass das Modal springt, und dem erwarteten iOS-Verhalten entspricht.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react-native, typescript
Bereich
mobile
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Muss geklärt werden
Anfängerfreundlichkeit
30/100

Neue Issues direkt in Ihr Postfach

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