0
303
Vistas¿Cómo hacer diseños complicados como la barra de pestañas inferior curva en reaccionar nativo?
Soy nuevo en el desarrollo de aplicaciones. Quiero hacer una barra de pestañas como la siguiente en la aplicación, pero no puedo. Traté de hacerlo mediante el estilo, pero no responde. ¿Cómo puedo hacer eso?
3 Respuestas
Responde la pregunta0
Para este tipo de formas poco ortodoxas, es mejor crear sus propias formas con SVG y hacer animaciones con bibliotecas reanimadas. Encontrarás muchos trabajos similares en GitHub.
Esto realmente podría ayudarlo, https://github.com/nomi9995/react-native-curved-bottom-tabbar no es exactamente su requisito, pero lo descubrirá si revisa el código
Este también https://www.npmjs.com/package/react-native-curved-bottom-bar
0
Existe una cosa llamada restricciones que es el posicionamiento de los elementos en los dispositivos móviles, si comprende cómo funciona, será más fácil para usted, https://developer.android.com/reference/androidx/constraintlayout/widget/ConstraintLayout . Sé que esta no es la respuesta, pero el estilo móvil es diferente al de la web, también puede consultar esta implementación de flexbox como referencia: https://www.javatpoint.com/react-native-positioning-element-with-flex
0
intente los pasos a continuación.
- crear una vista redonda (alto = ancho, borderRadius = alto/2)
- agregar borde con 10-20 con color de borde
- hazlo absoluto y alignSelf al centro.
- nuevo crear una nueva vista para la barra inferior con color de fondo y altura, ancho: '100%'
- agregue una vista redondeada después de la vista de barra y proporcione (inferior = <valor apropiado para mantener el redondeo un poco hacia arriba)