Partie 10 — Animations & gestes
⏱️ TL;DR — Les animations RN sérieuses tournent sur le thread UI (pas le thread JS) — c’est le superpouvoir de Reanimated : shared values, worklets,
withTiming/withSpring. On anime le timer circulaire de Drill (SVG + Reanimated), on gère les gestes (react-native-gesture-handler), et on saupoudre les micro-interactions (Layout Animations, flash des réponses, écran record) qui font une app « premium ».
Pourquoi cette partie
Le chapitre 6.1 l’a posé : animer par re-renders JS est une impasse (60-120 mises à jour/s sur un thread occupé). Reanimated exécute vos animations directement côté natif — fluides même si le JS calcule. C’est aussi la partie la plus gratifiante visuellement : Drill passe de fonctionnel à désirable.
Les chapitres
| Chapitre | Contenu |
|---|---|
| 10.1 — Le paysage | Animated historique vs Reanimated : pourquoi le thread UI change tout |
| 10.2 — Reanimated : fondations | Shared values, worklets, useAnimatedStyle, withTiming/withSpring |
| 10.3 — ⭐ Le timer circulaire | SVG + Reanimated : le décompte animé de Drill |
| 10.4 — Gestes | Gesture Handler : swipe, drag, et le swipe-to-delete de l’historique |
| 10.5 — Micro-interactions | Layout Animations, flash des réponses, l’écran nouveau record |
👉 Commencez par le chapitre 10.1.