Android - Animated.event useNativeDriver:true sets incorrect translate position when scrolling interrupted by user

Ouverte
#50,496 27 commentaires 4 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Évaluation

Difficulté
4/5
Temps estimé
3-5 jours
Accessibilité débutants
35/100
Type d'issue
Bug
Clarté
À clarifier
Activité
À l'abandon
Stack technique
android, react-native
Domaine
mobile

Piste de recherche

Commencez par le reproducteur Snack lié et exécutez-le sur Android avec useNativeDriver activé. Reproduisez un défilement inertiel interrompu à l’aide de Animated.event et comparez-le avec useNativeDriver désactivé. C’est terminé lorsque le composant traduit ne saute plus vers une position incorrecte ou finale après l’interruption du geste.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

Issue: Author Provided Repro Type: New Architecture
Description

I have 2 transform translateY animation. When the useNativeDriver:false, there is no issue except performance. I can see the animation moves couple frames behind from native animation. When the useNativeDriver:true, while moving fast the component jumps around (usually to final position if there were no distruption to moementum scroll)

Steps to reproduce
  1. Install the application to you andorid using npx expo run:android --device while useNativeDriver: true
  2. Make a slide with momentum and while momentum exists stop and make small movement and remove you finger from screen. (see the video)
React Native Version

0.77.2

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info
info Fetching system and libraries information...
System:
  OS: Windows 10 10.0.19045
  CPU: (16) x64 Intel(R) Core(TM) i7-10870H CPU @ 2.20GHz
  Memory: 17.67 GB / 31.84 GB
Binaries:
  Node:
    version: 22.14.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 1.22.22
    path: ~\AppData\Roaming\npm\yarn.CMD
  npm:
    version: 11.2.0
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK:
    API Levels:
      - "22"
      - "33"
      - "33"
      - "33"
      - "34"
      - "35"
    Build Tools:
      - 30.0.2
      - 30.0.3
      - 33.0.1
      - 34.0.0
      - 35.0.0
      - 35.0.1
    System Images:
      - android-34 | Google APIs Intel x86_64 Atom
      - android-35 | AOSP ATD Intel x86_64 Atom
      - android-35 | Intel x86_64 Atom
      - android-35 | Google APIs Intel x86_64 Atom
    Android NDK: Not Found
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    Versions:
      - 10.0.19041.0
      - 10.0.22621.0
IDEs:
  Android Studio: AI-242.23726.103.2422.13016713
  Visual Studio:
    - 17.13.35825.156 (Visual Studio Community 2022)
Languages:
  Java: 17.0.7
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 15.1.3
    wanted: ^15.1.0
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.77.2
    wanted: ^0.77.2
  react-native-windows: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

info React Native v0.78.2 is now available (your project is running on v0.77.2).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.78.2
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.77.2&to=0.78.2
info For more info, check out "https://reactnative.dev/docs/upgrading?os=windows".
Stacktrace or Logs
N/A
Reproducer

https://snack.expo.dev/@kocburak/usenativedriverbug

Screenshots and Videos

https://github.com/user-attachments/assets/54fe474c-1fdb-4efd-8f84-137afce9465b

Langage dominant
C++
Étoiles
127k
Forks
25.3k
Merge moyen
1 j 23 h
PR mergées (30 j)
4

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de react/react-native

Toutes les issues de react/react-native

Issues similaires

Plus d'issues C++

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.