Muy buenas, les saluda Luis y aquí les traigo este tutorial.
Índice
Diseños de flujo, capa y movimiento
ConstraintLayout es una de las poderosas bibliotecas de Jetpack que permite a los desarrolladores crear una interfaz de usuario compleja y receptiva rápidamente con herramientas interactivas integradas en Android Studio, para obtener una vista previa de su XML.
Una de las ventajas importantes de ConstraintLayout es que podemos crear una interfaz de usuario compleja con una jerarquía de vista plana (sin grupos de vista anidados).
Este resultado es dibujar un menor número de capas, lo que aumenta el rendimiento.
Algunas características clave de ConstraintLayout
ConstraintLayout- Podemos posicionar las vistas relativamente entre sí.
- Podemos centrar las vistas usando sesgos u otras vistas.
- Podemos especificar la relación de aspecto de la vista.
- Podemos agrupar y encadenar las vistas.
Algunos objetos de ayuda
Los objetos auxiliares son los objetos que no son visibles para el usuario pero que resultan útiles para alinear las vistas de los desarrolladores.
-
Guideline. -
Barrier. -
Placeholder.
Para obtener más información sobre ConstraintLayoutv1.0.
ConstraintLayout 2.0
Basta de lecciones de historia. Es hora de integrar la v2.0 de ConstraintLayout en su proyecto. Para hacerlo, agregue la siguiente línea debajo de la etiqueta de dependencias en el archivo build.gradle.
implementation “androidx.constraintlayout:constraintlayout:2.0.1”
Esta versión trae varias características nuevas a ConstraintLayout; comencemos a investigarlos sin demora.
Fluir
Flow es un nuevo diseño virtual agregado en v2, similar al grupo en v1. Es una combinación de Chain y Group, con poderes especiales. En palabras simples Flow encadena las vistas con tamaño dinámico en tiempo de ejecución.
Similar a Group, Flow también toma los ID de vista de referencia y crea un comportamiento Chain. Una de las ventajas vitales que Flow ofertas es wrapMode (una forma de configurar las vistas cuando se desbordan).
Fuera de la caja, tenemos tres modos para elegir: none, aligned y chain.
-
Wrap none: Crea una cadena a partir de las vistas referenciadas. -
Wrap chain: Crea múltiples cadenas (una tras otra) sólo si las vistas referenciadas no encajan. -
Wrap aligned: Similar awrap chain, pero alineará las vistas creando filas y columnas.
Uso de flujo con ConstraintLayout
Esta función parece simple, pero podemos crear diseños de flujo usando ConstraintLayout 2.0. Ya no necesitamos usar bibliotecas de diseño de flujo.
Antes de ConstraintLayout 2.0, tuvimos que calcular el espacio restante después de renderizar cada vista para asegurarnos de que la siguiente vista encaja allí, de lo contrario tendremos que alinearla en la siguiente línea. Pero ahora necesitamos usar Flow.
Para aprender más sobre Flow, leer los documentos oficiales.
Capa
Layer es el nuevo ayudante en ConstraintLayout 2.0, similar a Guidelines y Barriers. Podemos crear una capa virtual como un grupo con múltiples vistas referenciadas.
Una vez que se hace referencia a las vistas, podemos aplicar transformaciones en esas vistas usando Layer.
Es similar a un asistente Group, donde podemos vincular múltiples vistas y realizar acciones básicas como visibilidad (visible y desaparecida).
Con Layer, podemos llevarlo al siguiente nivel. Podemos aplicar animaciones a rotate, translate o scale múltiples vistas juntos.
Uso de capas en ConstraintLayout 2.0
MotionLayout
MotionLayout es una subclase de ConstraintLayout que incluye todas sus características sobresalientes, y es completamente declarativa, con la capacidad de implementar transiciones complicadas en XML.
Es compatible con versiones anteriores de API nivel 14, lo que significa que cubre el 99% de los casos de uso.
El nuevo editor MotionLayout de Android Studio 4.0 facilita el trabajo MotionLayout. Proporciona un entorno elegante para implementar transiciones MotionScenes y más.
Espero que hayas aprendido algo útil, gracias por leer.
Añadir comentario