2016-05-27 16 views
1

Wie kann ich automatisch die Ansicht scrollen, wenn ich in einem TextInput-Feld fokussiere und eine Tastatur so angezeigt wird, dass das TextInput-Feld nicht hinter der Tastatur verborgen ist? Diese Frage wurde einige Male bei StackOverflow gestellt und ich habe die Lösung here implementiert, die die allgemeine Lösung ist, die in den meisten Antworten empfohlen wird. Diese Lösung funktioniert im iPhone-Simulator, funktioniert aber nicht am Telefon. Hat jemand anderes dieses Problem erfahren, dass die Lösung nicht auf dem tatsächlichen Telefon funktioniert? Die zweite Sache, die ich nach dem Hinzufügen dieser Lösung bemerkte, ist, dass jetzt, wenn ich in einem TextInput-Feld fokussiere und die Tastatur angezeigt wird, wenn ich eine Taste drücke oder versuche, in ein anderes TextInput-Feld zu fokussieren, wird die erste Berührung immer verbraucht um die Tastatur zu verbergen, und die Schaltfläche wird nicht gedrückt oder die andere TextInput-Box wird nicht fokussiert. Es ist ein wenig lästig für den Benutzer, die Operation zweimal durchzuführen. Hat jemand anderes dieses Problem beobachtet?Automatisches Scrollen der Ansicht nach oben, wenn Tastatur in reaktionsbereit angezeigt wird

Bitte lassen Sie mich wissen, wenn Sie irgendwelche Informationen haben, wie Sie diese Probleme lösen können?

+0

Das hat gut für mich funktioniert: https://github.com/Andr3wHur5t/react-native-keyboard-spacer –

+1

@NaderDabit Ich versuchte das oben genannte Paket, das Sie empfohlen, aber es hat nicht gut für mich. ZB in einem der Bildschirme habe ich einen DatePicker und ein paar Eingabefelder und wenn ich auf irgendein Eingabefeld drücke und die Tastatur auftaucht, aufgrund derer die Ansicht nach oben gescrollt wird, werden die Eingabefelder nach oben verschoben, aber nicht der DatePicker wodurch die Eingabefelder den DatePicker überlappen. Ich konnte es nur kurz ausprobieren, da ich gerade ein Feature in der mobilen App implementiere und möglicherweise ein Problem in meinem Code vorliegt, das das obige Verhalten verursacht. Ich werde es noch einmal versuchen und neu kommentieren. –

Antwort

3

Ich nehme an, Sie verwenden this solution. Ich stieß auf das gleiche Problem und machte einige Anpassungen (see gist). Ich habe beide Probleme angesprochen, die Sie beschreiben. keyboardShouldPersistTaps löst Ihr zweites Problem.

Ich habe nicht den genauen Grund gefunden, warum der Abstand im Simulator funktioniert, aber nicht auf einem echten Gerät. Es hat etwas mit dem Timing zu tun. Der ursprüngliche Code legt eine Zeitüberschreitung für den Eingabefokus fest und versucht, nach 50 ms nach unten zu scrollen. Wenn man das auf 500ms erhöht, funktioniert es auch auf Geräten, aber ich mag es nicht, magische Timeouts hinzuzufügen, die ich nicht verstehe. Ich habe es geändert, also schaue ich auf das Element, um zu einer Referenz zu blättern und sie zu speichern. Wenn onKeyboardDidShow ausgelöst wird, verwende ich die Referenz.

+0

Danke für die Antwort. Ich bin in der Mitte von etwas, aufgrund dessen ich Ihre Lösung nicht ausprobieren konnte. Ich werde es so schnell wie möglich versuchen und meine Erfahrung teilen. Danke nochmal für all deine Hilfe! –

+0

Ihre Lösung hat perfekt funktioniert. Ich bestätigte auch, dass, wenn ich das Timeout in der anderen Lösung auf 500 erhöhte, es ohne irgendwelche anderen Änderungen zu arbeiten begann, was ein sehr guter Einblick war. –

Verwandte Themen