react / react/react-native

[iOS] The scroll position of the multiline TextInput affects the ScrollView auto-scroll when the keyboard opens/closes

Aperta
#52,416 1 commento 2 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

API: Keyboard Component: ScrollView Component: TextInput Issue: Author Provided Repro
Lingua principale
C++
Stelle
127k
Fork
25.3k
Merge medio
1g 23h
PR unite (30g)
4

Descrizione

Description

On iOS, when using a ScrollView with automaticallyAdjustKeyboardInsets and a multiline TextInput, the scroll position of the TextInput affects how the ScrollView auto-scrolls when the keyboard opens or closes.

Steps to reproduce
<ScrollView automaticallyAdjustKeyboardInsets>
   // Any content above the TextInput to position it at the bottom of the screen
   <TextInput multiline style={{ height: 100 }} /> // multiline TextInput with fixed height and many lines of text (let say 20)
   // More content to allow the ScrollView to scroll if needed
</ScrollView>
  1. ScrollView with automaticallyAdjustKeyboardInsets
  2. Content above the TextInput to fill the screen
  3. Multiline TextInput with fixed height and many lines of text
  4. Content below the TextInput to allow the ScrollView to scroll if needed
  5. Focus on the input and scroll it to the end
  6. Scroll the ScrollView to align the TextInput at the bottom of the screen
  7. Focus on the last line in the TextInput
  8. The keyboard slides up, and the ScrollView scrolls too much
  9. With the keyboard open, scroll the ScrollView to align the TextInput at the bottom of the screen (above the keyboard)
  10. Close the keyboard
  11. The ScrollView scrolls up
React Native Version

0.79.5

Affected Platforms

Runtime - iOS

Output of npx @react-native-community/cli info
This is not relevant
Stacktrace or Logs
This is not relevant
MANDATORY Reproducer

https://snack.expo.dev/@serge0n/the-scroll-position-of-the-multiline-textinput-affects-the-scrollview-auto-scroll-when-the-keyboard-opens-or-closes?platform=ios

Screenshots and Videos

https://github.com/user-attachments/assets/1566ea6e-e936-4670-a18a-80090857f58c

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia con il reproducer obbligatorio di iOS Snack e confronta il comportamento di ScrollView e multiline TextInput durante l'apertura e la chiusura della tastiera. Traccia la gestione di automaticallyAdjustKeyboardInsets, quindi verifica che ScrollView non scorra più troppo all'apertura della tastiera e non si sposti verso l'alto alla chiusura.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
ios, 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
42/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.