Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Here’s how I handle keyboard avoidance in React Native 👇 The keyboard covering your inputs is one of the most annoying UX issues on mobile. In this video, I show how I use react-native-keyboard-controller with reanimated to smoothly avoid this problem (👨‍💻 source code below)

50,772 Aufrufe • vor 1 Jahr •via X (Twitter)

11 Kommentare

Profilbild von Beto
Betovor 1 Jahr

Source Code: If you are interested in my scheduling app, get access at:

Profilbild von Rainmaker
Rainmakervor 1 Jahr

Don’t trust your strategy until it’s passed this test. Walk-Forward Validation is the key to crafting a reliable machine learning model. Learn how this method helps you avoid overfitting and prepares your model for live market scenarios. Full article and code on my Substack:

Profilbild von Vitor Oliveira
Vitor Oliveiravor 1 Jahr

Thank you for the tip, Beto! Recently I discovered we can achieve this behavior using insets.ime from react-native-unistyles (v3). @jpudysz did a demo in this live on the Expo youtube channel.

Profilbild von Beto
Betovor 1 Jahr

@jpudysz Oh that is awesome! 👏 thanks for sharing 📝

Profilbild von Nevo David
Nevo Davidvor 1 Jahr

pretty cool fix, honestly this problem annoys me like crazy - you think mobile ui stuff ever stops being a pain point or its just the price for flexibility

Profilbild von Sujeet Kumar
Sujeet Kumarvor 1 Jahr

That keyboard related all issue should fix from react native core. It's really very annoying 😭 to handle every screen

Profilbild von Dibakar Mandal
Dibakar Mandalvor 1 Jahr

Can this handle android custom keyboards as well? Like Ms swiftkey

Profilbild von Thomas Viaud
Thomas Viaudvor 1 Jahr

What is the difference between your code and using components such as KeyboardAvoidingView or others provided with the package ?

Profilbild von Thijs Sondag
Thijs Sondagvor 1 Jahr

This is super helpfull, since I'm building a tool that sits on top of the keyboard 🙂 Thanks for this!

Profilbild von MartycFly.base.eth | 𝝠 |👨‍🎓 = 🔑
MartycFly.base.eth | 𝝠 |👨‍🎓 = 🔑vor 1 Jahr

Love all the content 🙌🙌

Profilbild von Alexandre Morgado
Alexandre Morgadovor 1 Jahr

Thanks for this tutorial! I was struggling with something similar and i used KeyboardAwareScrollView which made it work perfectly!

Ähnliche Videos