<Image /> with GIF renders incorrectly when resizeMode is set to "repeat"
Nessuno ha ancora preso questa issue.
- Lingua principale
- C++
- Stelle
- 127k
- Fork
- 25.3k
- Merge medio
- 1g 23h
- PR unite (30g)
- 4
Descrizione
Description
<Image /> cannot render GIF correctly when (Android) or after (iOS) setting resizeMode to "repeat".
The issue on iOS and Android are different:
- on iOS,
1.1. the first issue is GIF cannot animate whenresizeModeis set to"repeat"
1.2. the second issue is<Image />cannot get out of"repeat"mode after settingresizeModeto it. - on Android, the issue is
<Image />cannot render"repeat"mode correctly -- there GIF will not "repeat", but shrink to top left corner instead
JPG and PNG files don't have any issue.
Steps to reproduce
Setup: create a vanilla React Native app, add a Image component in it. Or try the linked Expo Snack below
- try JPG and PNG with various resizeMode value, including "repeat", and observe JPG and PNG are always rendered correctly
- try the same with GIF, and observe:
2.1. on iOS, GIF cannot animate whenresizeModeis set to "repeat"
2.2. on iOS, GIF cannot recover from "repeat" after settingresizeModeto "repeat" and then other value (e.g. "cover")
2.2. on Android, GIF cannot "repeat", but shrinks to the top left corner instead
React Native Version
0.72.6
Affected Platforms
Runtime - Android, Runtime - iOS
Output of npx react-native info
N/A
Stacktrace or Logs
N/A
Reproducer
https://snack.expo.dev/@l1m2p3/image-gif-resizemode-bug
Screenshots and Videos
iOS:
https://github.com/facebook/react-native/assets/6405712/9d2795bd-79f1-444e-8815-228db3446855
Android:
https://github.com/facebook/react-native/assets/6405712/ca4e803e-56bc-4f58-9fb6-77bfa03279eb
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Direzione di ricerca
Inizia con l’Expo Snack collegato e il punto di ingresso del componente React Native Image, riproducendo il comportamento delle GIF sia su iOS che su Android con resizeMode impostato su repeat e poi modificato con un altro valore. Il lavoro è completato quando le GIF si animano, si ripetono e si ripristinano correttamente, mentre il comportamento di JPG e PNG rimane invariato su entrambe le piattaforme.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- react-native
- Ambito
- mobile
- Tipo di issue
- Bug
- Difficoltà
- 4/5
- Tempo stimato
- 3-5 giorni
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 35/100