ANDROID Studio (20) – La creación de la interfaz

Este artículo es una continuación del artículo anterior en el que se hablaba de la creación de la pantalla para la app.

La interfaz de pantalla que se crea en un inicio es sencilla, de forma que a medida que avanza la creación de la aplicación, se añaden elementos de diseño a la misma que aumentan su complejidad.

Los datos básicos son sobre DVD, y campos básicos.

Primero, si por ejemplo, estuviéramos interesados en crear una aplicación que permitiera comprar libros especializados en arquitectura, lo primero que hay que hacer es hacer doble clic en el archivo que se había creado en el artículo anterior, Activity_Viewbook.xml. Android presenta una visualización previa de la pantalla vacía, la cual la creamos en el artículo anterior.

En la lista Palette hay que seleccionar el componente TextView, de Widget. Para añadirlo hay que arrastrarlo hasta la pantalla, y se puede situar en la parte superior de la pantalla. En este momento que está seleccionado el rectángulo que lo configura, se puede redimensionar este rectángulo, en relación a la medida.

 

81.jpg

82.jpg

83.jpg

 

Con el panel de Atributes que está situado en la parte derecha se pueden ver las principales propiedades de este elemento. Con la opción View all atributes, se pueden ver todas las propiedades en un panel que se sitúa en la parte inferior.

 

84.jpg

85.jpg

86.jpg

Cuando se muestran todas las propiedades, se puede ver la propiedad layout.margin, que permite crear márgenes para que los campos no aparezcan demasiado cerca de los límites de la pantalla del teléfono. Realizando clic en la flecha se puede ampliar la propiedad de forma que aparecen los elementos layout_margin, layout_marginLeft, layout_marginTop, layout_marginRgiht y layout_marginBottom.

 

87.jpg

Por ejemplo se indicará en el campo layout_marginTop 14 dp. (density independent pixels).

Con la propiedad layout_gravity se puede centrar el campo. Para ello hay que hacer clic en la flecha de forma que se despliegan todas las propiedades de este elemento. Con los campos top, bottom, left, right se puede configurar esta propiedad. Se seleccionará en nuestro caso center_horizontal.

88.jpg

 

89.jpg

 

Como complemento de información, os dejo aquí este video sobre el concepto de Layout y los tipos que hay en Android.

 

Licencia Creative Commons Contenido Web de Yolanda Muriel está sujeto bajo Licencia Creative Commons Atribución-NoComercial-SinDerivadas 3.0 Unported.

 

Anuncios

1 Comment

Responder

Por favor, inicia sesión con uno de estos métodos para publicar tu comentario:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s