Vistas y ViewGroups en Android: Diferencias y Uso Práctico

Curso Básico de Diseño de Interfaces con Android Studio

Contenido del curso

Introduccion

1
Creación de Interfaces de Usuario en Android con XML
03:39 min

Revisando los archivos para una UI

Creando una UI

Widgets y Vistas

Layouts base

Estilos y temas

Extendiendo los widgets

Cierre

20
Estilos y Atributos en XML: Curso Completo
00:37 min

Tomar examen

Cursos Empresas Blog Live Conf Eventos Precios

0:004:13

Vistas y ViewGroups en Android: Diferencias y Uso Práctico

Curso Básico de Diseño de Interfaces con Android Studio

Clase 6 de 20

Clase 6 / 20

Recursos

¿Cómo se manejan las vistas en Android?

En el desarrollo de Android, las vistas son esenciales para crear interfaces de usuario efectivas. Las vistas se definen mediante archivos XML, los cuales proporcionan una representación estructurada de cómo se verá una aplicación en pantalla. Aunque Android Studio ofrece una vista visual atractiva de estas interfaces, bajo la superficie, todo se reduce a este lenguaje de marcado.

¿Qué son las vistas y los grupos de vistas?

Vista (View): Es un elemento individual que se mostrará en la pantalla. Estos elementos suelen cerrarse en la misma línea en que se definen, un concepto conocido como "inland elements". Ejemplos incluidos en la mayoría de las aplicaciones son TextView y EditText.
Grupo de vistas (ViewGroup): Sirve para contener y organizar varias vistas. Su papel principal es agrupar elementos relacionados, permitiendo que cualquier cambio aplicado al grupo afecte a todos sus elementos hijos. Este comportamiento se observa claramente con el atributo gravity que alineará los elementos de acuerdo con su configuración dentro de un LinearLayout.

¿Cómo funciona el atributo gravity en Android?

El atributo gravity permite controlar la alineación de los elementos dentro de un grupo de vistas en Android. Puedes usar esta herramienta para elegir hacia dónde deseas alinearlos, ya sea a la izquierda, centro o derecha de la pantalla. Algunas configuraciones y sus efectos son:

start: Alínea los elementos al lado izquierdo de la pantalla.
center: Sitúa los elementos en el centro.
end: Mueve los elementos al lado derecho.

El atributo gravity no se limita solo a alineaciones simples. Puedes combinar valores para alinear elementos tanto horizontal como verticalmente usando el carácter |. Por ejemplo, bottom|end posicionaría los elementos al final y parte baja de la pantalla.

¿Qué tipo de efectos especiales pueden tener los grupos de vistas?

Android facilita el uso de efectos y animaciones en los grupos de vistas gracias a su diseño flexible. No sólo permiten la agrupación lógica de vistas, sino que también se pueden usar para implementar transiciones estéticas, mejorando la experiencia del usuario con efectos visuales atractivos. Estos efectos pueden incluir animaciones de entrada y salida, transiciones suaves entre estados de vista, y más, sin impactar directamente el rendimiento de la aplicación.

En resumen, entender el funcionamiento subyacente de las vistas en Android es crucial para crear interfaces de usuario eficientes y agradables. La manipulación adecuada de estos elementos garantiza una aplicación robusta y atractiva, mejorando así la experiencia del usuario final. ¡Sigue explorando y experimentando para dominar el desarrollo Android!

Andres López

Hace 6 años

View

Es un elemento individual que se va a mostrar por pantalla. Por lo generar estos tags se cierran en la misma línea en la que se definen.
```
<TextView />
<ImageView />
<EditText />
```

ViewGroup

Agrupa vistas relacionadas entre si. Cuando se tiene elementos dentro de este los cambios que se hagan a un ViewGroup afectarán también a los elementos que lo contienen.

<LinealLayout android:gravity="start"> <!-- ViewGroup -->
	<TextView />
    <ImageView />
    <EditText />
</LinealLayout>

En el ejemplo anterior el atributo gravity aplicado al ViewGroup <LinealLayout> afectará también a los Views que están en su interior.

🛈 Nota: pueden haber tantos ViewGroups anidados como sea necesario, no hay una limitación al respecto. Ejemplo:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"    
    android:layout_height="match_parent"
    android:gravity="end|bottom"> 
    <!-- gravity afectará a los elementos del ViewGroup. "end|bottom" → Permite poner varios valores -->
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hola Mundo!" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:autofillHints="Hi" />
    
</LinearLayout>

Comentarios (51)51 comentarios

Nolbert Juarez

Hace 7 años

Mario Enrique Ascencio Garcia

Hace 5 años

Rodolfo Morales Moreno

Emanuel Agustín Serdeiro

Antonio Martínez Elías

Fernando Mora

Oscar Rodrigo Leon Mojica

Jorge Luis Pilo Torres

Jeferson Apaza

Moises Almonte

Hace 2 años

Murray Walker Greer Cifuentes

juan gago

Danilo Francisco Espinoza Pino

Maria Del Mar Artunduaga Artunduaga

Hace 3 años

Jessica Maria Jimenez Soto

Anghello Eduardo Rodríguez Risco

Christian Gómez

Edgar Balderrama

Diego Ernesto Cuaycal Tirira

Hace un año

Miguel Angel Montaña Gutierrez

Usuario anónimo

User

Daniel Huerta Villanueva

David Yepes Buitrago

Enrique Rabell Talamantes

José Sebastián Garcia

Juan Diego Loaiza Martinez

Juan Pablo Rodríguez Morales

Luis Vértiz

Tomás André Peñaloza Avilés

Hace 4 años

David Campos

Gonzalo García

Introduccion

Creación de Interfaces de Usuario en Android con XML

Revisando los archivos para una UI

Instalación de Android Studio para Desarrollo de Apps

Creación y gestión de proyectos en Android Studio

Creando una UI

Diseño de Interfaces en Android Studio: Herramientas y Técnicas

Gestión de Vistas y Recursos en Android Studio

Widgets y Vistas

Vistas y ViewGroups en Android: Diferencias y Uso Práctico

Atributos de Layout en Android: Width y Height

Atributos de Diseño y Referencias en Android Studio

Layouts base

Alineación de elementos con LinearLayout en Android

Diseño de Interfaces con RelativeLayout en Android

Diseño de Interfaces con Layout Relativo en Android

Uso de FrameLayout para Organizar Elementos en Android

Diseño de Interfaces con FrameLayout en Android Studio

Diseño de Interfaces con ConstraintLayout en Android Studio

Estilos y temas

Estilos en Android: Creación y Aplicación en Elementos de UI

Temas y Estilos en Android: Personalización Global de la App

Gestión de Dimensiones y Estilos en Android XML

Extendiendo los widgets

Integración de Librerías Externas en Proyectos Android

Reutilización de Layouts en Android: Incluyendo y Merging Elementos

Cierre

Estilos y Atributos en XML: Curso Completo

Vistas y ViewGroups en Android: Diferencias y Uso Práctico

Progreso del curso

Introduccion

Revisando los archivos para una UI

Creando una UI

Widgets y Vistas

Layouts base

Estilos y temas

Extendiendo los widgets

Cierre

Recursos

Recursos