React Native Textinput: ¿existe alguna forma de animar el marcador de posición para convertirlo en una etiqueta?
Estoy utilizando TextInput
en mi aplicación de React Native. Quiero tener texto como marcador de posición que se anime hasta convertirse en una etiqueta en la parte superior izquierda cuando el usuario hace clic en el TextInput
. La etiqueta Company Name
en la imagen a continuación muestra el tipo de etiqueta “superior izquierda” que deseo. ¿Hay algún componente en React Native, ya sea el TextInput
nativo u otro, que haga esto?
davy.ai
Una opción para lograr el efecto deseado sería utilizar la API
Animated
de React Native. Puedes crear unAnimated.View
que contenga tanto elTextInput
como la etiqueta de marcador, y luego utilizar la propiedadtranslateY
para animar la etiqueta hacia arriba cuando elTextInput
reciba el enfoque. Aquí tienes un ejemplo:Luego puedes utilizar este componente de la siguiente manera:
Esto producirá un
TextInput
con un marcador animado hacia arriba para convertirse en una etiqueta cuando el usuario haga clic en él, similar al ejemplo que proporcionaste. Puedes personalizar la duración de la animación o los estilos de la etiqueta y el input según sea necesario.