Layouts externos: ConstraintLayout

Es importante que todos los elemetos dentro de un constraintLayout deben tener al menos una alineación horizontal y una alineación vertical; sino AS no va a permitirnos compilar nuestro proyecto.

Para estructurar el XML de manera ordenada aplicaremos el comando: CRTL+ALT+L

El ConstraintLayout es que se encarga de que los elementos estén estirados con respectos a otros.
Ejemplo: Si se hiciera invisible el elemento usuario el elemento password heredaría la configuración previa de usuario.

Mi login realizado con ConstraintLayout

El papa de los layout, con este layout haces de todo.

https://github.com/sierisimo/Android-Interfaces-PlatziMusic/tree/04-constraintlayout

En la nueva actualización de Android Studio, para centrar los elementos, ya no se realiza con Start o End, sino hay que especificarlo con los atributos que se mencionan aquí.

        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"

Excelente clase! mucho tiempo le estuve huyendo al Constraint Layout porque parecia ser muy engorroso y resulto ser más fácil de lo que pensé

Ese contraintLayout me dió mucha lidia, pero al final lo logré:

La ventaja de trabajar con Constraint Layout es trabajar con posiciones relativas de elementos y se evidencia al er los tipos de relaciones:

En Horizontal tenemos: Start to Start, Start to End, End to End y End to Start.

En Vertical tenemos: Top to Top, Top to Bottom, Bottom to Bottom y Bottom to Top.

El primero es el elymento sobre el que trabajo, el segundo es el elemento respecto al cual alinearé el elemento con el que estoy trabajando.

Mis apuntes de la Clase
Es un layout externo similar a RelativeLayout con la excepción de que en ConstraintLayout los elementos reaccionan a las modificaciones que ocurran en la pantalla. Es un Layout muy usado, tanto que es cuando se crea una nueva Activity es el tipo de Layout por default, de hecho ya se encuentra agregado por defecto en las dependencias.

ConstraintLayout tiene algunas ventajas como:

• Facilita el hacer animaciones

• Permite agregar elementos más dinámicos que reaccionen a cambios en el ancho de la pantalla, etc.

• Es más flexible que otros tipo de layouts pues permite establecer relaciones entre todos los elementos y la propia vista padre.

• Mejora el uso de la memoria al evitar usar layouts anidados para generar interfaces complejas

ConstraintLayout usa un namespace llamado app para estructurar la pantalla.

Cada uno de los círculos de la imagen representan los puntos sobre los que se puede alinear cada elemento. Dichos puntos son start, end, top, bottom.

Ejemplo:

app:layout_constraintTop_toTopOf="parent" <!-- Alinea el Top del elemento conel Top del padre -->

🛈 Nota: todos los elementos de un ConstraintLayout deben tener por lo menos una alineación horizontal y vertical.

🛈 Nota: Ctrl + L → Organiza los atributos del XML

Una ventaja de este tipo de layout es que si ocurre un cambio en la pantalla, como por ejemplo que se quite un elemento, el elemento de abajo se va a alinear con respecto a los constraints que tenia el elemento previo, permitiendo así crear interfaces dinámicas.

este es el que creo que mejor ordena

Mejora mucho al forma de ordenar con respecto a los demás elementos

si no puedes encontrar el contraint layout. debes de agregarlos en las depencdencias de android estudio

Comparto mi proyecto combina ConstrainLayout con LinearLayout 😄

.

Hecho con ConstraintLayout, de lo aprendido en clase y un poquito mas 🥰

Buen tema.

Tipos de Layouts

Tipos de Layouts:

ConstraintLayout es como RelativeLayout pero la diferencia es que los elementos reacciona dependiendo de como se acomodan

Soy mas dev de IOS y con este me senti en real comodidad ya que es el que mas utilizo haya

Como complemento en Relative Layout no tenemos el match parent para las propiedades de altura y anchura para eso utilizamos 0dp.

Cabe mencionar que este constraint puede que sea el más potente ya que requerimos de menos anidamiento, se puede ajustar todo lo que encuentra dentro de el.

Aun que faltaron ciertos elementos como layout_constraintHorizontal/Vertcal_bias, las Chains y las GuideLines considero que da a entender el concepto de ConstraintLayout.

Documentación:
https://developer.android.com/training/constraint-layout?hl=es-419

A mi los elementos se me alinearon bien con solo ponerles a los TextEdit app:layout_constraintTop_toBottomOf="@id/idElementoDeArriba" y al botón app:layout_constraintBottom_toBottomOf="parent". Ocuparon de una el ancho la pantalla mientras que al profesor sólo una parte de la misma y además en la pestaña de Blueprint no me muestra ninguna fecha blanca. ¿Alguien sabe porqué?