Ediciones ENI Editorial | líder en informática
Consulta e introducción de datos
Introducción
Las actividades son la base de una aplicación Android: toda pantalla que se presente a los usuarios está basada en una actividad.
Este capítulo realiza una presentación completa de las actividades: uso, ciclo de vida, vínculo entre el código de la actividad y el archivo de descripción de interfaz.
El capítulo aborda a continuación los componentes de creación de interfaces más sencillos: controles de visualización y de introducción de datos textuales, así como los botones.
Por último, la sección Configurar una pantalla, gestionar la representación adaptativa describirá cómo construir una interfaz que se adapte a la representación del terminal.
Cuando termine este capítulo, la aplicación LocDVD permitirá introducir y visualizar la información correspondiente a un DVD.
Las actividades: ciclo de vida de una pantalla
La primera actividad que se va a agregar al proyecto es la que se encarga de mostrar y consultar una ficha de DVD.
1. Creación de una nueva actividad
Para crear la actividad de visualización de un DVD, hay que situarse, en el explorador del proyecto de Android Studio, en la carpeta app/java/com.ejemplo.locdvd y crear un archivo Java en esta carpeta.
Abra el proyecto LocDVD en Android Studio.
Vaya al árbol del proyecto en modo Proyecto.
Sitúese en la carpeta app/src/main/java/com.ejemplo.locdvd: debe existir un archivo MainActivity.java; se trata del archivo generado por Android Studio durante la creación del proyecto.
Haga clic con el botón derecho en la carpeta com.ejemplo.locdvd y seleccione la opción New - Java class.
Se abre una ventana pop-up, que le permite introducir un nombre para la nueva clase. Introduzca el nombre ViewDVDActivity y, a continuación, haga clic en el botón OK.
Android Studio genera el archivo ViewDVDActivity.java y lo muestra en el editor de Java.
De momento, el archivo contiene únicamente el código de definición de la clase.
Las actividades deben heredar de la clase android.app.Activity o de alguna clase derivada de Activity: por lo tanto, la primera acción que debe llevar a cabo es declarar esta herencia.
package com.ejemplo.locdvd;
import android.app.Activity;
public class ViewDVDActivity extends Activity{
}...Construcción de una pantalla de consulta de datos
El archivo de layout de la actividad ViewDVDActivity debe almacenarse en la carpeta /res/layout/.
Hay que definir este archivo, vincularlo con la actividad y, a continuación, construir la interfaz de visualización.
Sitúese en la carpeta app/src/main/res/layout en el explorador del proyecto Android Studio. Ya debe existir un archivo activity_main.xml, generado por Android Studio y correspondiente a la actividad MainActivity creada también por Android Studio.
Haga clic con el botón derecho y seleccione la opción New - Layout resource file.
Se abre una ventana pop-up que le pregunta el nombre del archivo y el elemento raíz del layout (Root element). Escriba activity_viewdvd y deje la sugerencia para la ocpión Root element (que debe ser LinearLayout).
Es importante aplicar una conversión de nombre bastante estricta para los archivos de layout, pues, en efecto, es imposible crear subcarpetas dentro de la carpeta layout. Por ello, la carpeta contendrá, por lo general, una lista significativa de archivos que, sin una regla de nomenclatura, se vuelve rápidamente ingobernable.
Para los archivos de layout, como con todos los recursos, es obligatorio utilizar solo caracteres en minúsculas.
Android Studio crea el archivo y lo abre directamente en modo Design.
1. Creación de la interfaz
Inicialmente, la interfaz de la aplicación es muy sencilla; se completará más adelante.
Esta pantalla contiene la información básica acerca del DVD: título de la película, año de aparición, actores principales y resumen.
La pantalla se ilustra en la siguiente maqueta.
Observe que el número de actores principales es, a priori, desconocido. Hay que prever que la interfaz debe adaptarse y presentar un número variable de campos correspondientes al nombre de los actores.
La primera etapa consiste en implementar el componente que muestra el título del DVD.
Abra (haciendo doble clic en el nombre del archivo), si no lo estuviera, el archivo activity_viewdvd.xml en el editor, en modo Design.
Android Studio adapta la visualización en curso y presenta una visualización previa de la pantalla, actualmente vacía.
En la lista llamada Palette se presenta un conjunto de componentes que pueden situarse...
Introducción de datos, controles principales
Además de una pantalla de consulta de datos, la aplicación debe permitir al usuario introducir un nuevo DVD. Como con la pantalla de consulta, hay que crear una actividad y un archivo de layout asociado.
El registro de los datos se abordará en el siguiente capítulo, de modo que la parte esencial del desarrollo para esta pantalla está, de momento, vinculada a la gestión de los actores y a la verificación de los datos introducidos.
1. Creación del esqueleto de la pantalla
La maqueta de la pantalla es, aunque más compleja que la pantalla de visualización, relativamente sencilla: la pantalla se basa en un LinearLayout. Además de utilizar el componente TextView, también hay que invocar aquí el componente de introducción de texto, llamado EditText, así como el componente Button: en la aplicación, un botón permite registrar los datos y se utiliza un botón para agregar los campos que permiten introducir los distintos actores.
El componente EditText es muy parecido al componente TextView: EditText hereda, en efecto, de TextView. Su integración en un archivo de layout es también bastante similar.
El componente de tipo botón tampoco difere de los componentes TextView y EditText (Button hereda, a su vez, de TextView). La dificultad aquí, si es que reviste alguna, es gestionar el posicionamiento de los botones: el botón + debe situarse a la derecha de la etiqueta Actores, el botón ok debe estar a la derecha de la pantalla.
Respecto al botón +, si existen varias soluciones, la más sencilla aquí consiste en encapsular ambos componentes, etiqueta y botón, en un contenedor de vista de tipo LinearLayout cuya orientación esté definida como horizontal.
El siguiente ejemplo ofrece una implementación mínima:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content" ...Configurar una pantalla, gestionar la representación adaptativa
La pantalla configurada en la sección anterior, si bien es globalmente funcional, presenta sin embargo algunos problemas. Esta sección va a permitir conocer estos problemas y corregirlos.
1. Desplazar pantalla
Si el usuario agrega varios actores, se corre el riesgo de que la zona de introducción del resumen se salga de la pantalla. En algunos smartphones, es posible sin embargo que el resumen, o al menos el botón OK, no estén visibles al mostrar la pantalla: esto depende de la resolución de pantalla del dispositivo de prueba.
La plataforma provee, para resolver este tipo de problema, el componente ScrollView, contenedor de vista que, como su propio nombre indica, se encarga del desplazamiento de la pantalla.
Este componente es ligeramente diferente del componente LinearLayout en el sentido de que acepta un único componente hijo. Habitualmente, este componente hijo es, a su vez, un contenedor de vista clásico, que contiene los componentes hijos que constituyen la pantalla.
En el caso del archivo de layout de la actividad de introducción de datos, lo más sencillo es agregar un ScrollView en el componente padre del LinearLayout raíz actual. Preste atención y no olvide definir el espacio de nombres en este nuevo componente ScrollView, que se convierte en el primer componente definido en el archivo de layout.
El componente ScrollView debe tener el mismo ancho que la pantalla y su altura debe adaptarse a su contenido.
El archivo de layout debe, por tanto, modificarse según el siguiente código fuente:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_margin="8dp"
android:layout_height="match_parent">
<!-- Zona de título de la película -->
...