TUTORIAL: Desarrollo de aplicaciones para Android (XIV)

Antes de empezar con el primer ejercicio de creación de un bloc de notas, asegúrate de que te has bajado los archivos del tutorial que comenté en el anterior post.

¿Preparado?

Ejercicio 1

En este ejercicio, vamos a crear una simple lista de notas que permita al usuario añadir notas, pero no editarlas. Aprenderemos:

- Los fundamentos de las ListActivities y la creación y gestión de las opciones de menú
- Cómo utilizar una base de datos SQLite para almacenar los datos
- Cómo enlazar datos de un cursor de una base de datos a una ListView utilizando un SimpleCursorAdapter
- Los fundamentos de los "screen layouts" (diseños de pantalla): cómo añadir elementos al menú de la actividad, cómo la actividad gestiona esas selecciones de menú, etc.

Paso 1

Abrir el proyecto Notepadv1 en Eclipse:

1. Crea un nuevo proyecto Android seleccionando "File->New->Android Project".
2. A continuación, selecciona "Create project from existing source" (crear proyecto a partir de código existente).
3. Haz clic en "Browse", navega hasta dónde tengas la carpeta "NotepadCodeLab" que te has bajado y descomprimido antes, y selecciona Notepadv1.
4. El nombre de proyecto y demás propiedades deberían rellenarse automáticamente. Debes seleccionar un "Build Target" (yo he seleccionado "Google APIs" y añadir un número entero en "MinSDK Version" que corresponda al "API Level" seleccionado en el "Build Target" (en mi caso es 7) .

5. Haz clic en "Finish". Ahora el proyecto debería abrirse y verse como cualquier otro en Eclipse.

Si ves un error relacionado con "AndroidManifest.xml" u otro fichero zip de Android, tienes que hacer clic derecho en el proyecto y seleccionar "Android Tools -> Fix Project Properties" para que el proyecto busque las librerías que necesite en el lugar correcto.

Paso 2

Echa un vistazo a la clase NotesDbAdapter (clase que encapsula el acceso a datos de una base de datos SQLite y que guardará nuestras notas y permitirá modificarlas).

Podemos ver que:

- Nuestra base de datos se va a llamar "data"

- La tabla que contendrá las notas de texto se llamará "notes", y que ésta tendrá los campos "_id" (identificador de la nota), "title" (título de la nota) y "body" (nota en sí)

- El constructor de la clase DatabaseHelper toma como parámetro un "Context", que le permitirá comunicarse con el sistema operativo de Android para efectuar algunas acciones internas

- El método onCreate() ejecuta la siguiente sentencia SQL para crear la base de datos:

create table notes (_id integer primary key autoincrement, " + "title text not null, body text not null);

- El método onUpgrade() ejecuta un par de sentencias que actualizan la base de datos a una nueva versión (elimina la existente y crea una nueva)

- El constructor de la clase NotesDbAdapter toma el contexto como parámetro para permitir a la base de datos ser abierta/cerrada

- El método open() abre la base de datos mediante una instancia de la clase DatabaseHelper (que es nuestra implementación de la clase SQLiteOpenHelper) y llama a getWritableDatabase(), que se encarga de la creación/abertura de la base datos por nosotros

- El método close() cierra la base de datos, liberando recursos asociados a la conexión

- El método createNote() inserta (INSERT) una nota en la base de datos con el título y cuerpo pasados como parámetro y devuelve su identificador "_id"

- El método deleteNote() elimina (DELETE) la nota con el identificador pasado como parámetro

- El método fetchAllNotes() devuelve un Cursor (apuntador/índice) a la lista de todas la notas de la base de datos

- El método fetchNote() devuelve un Cursor que apunta a la nota con el identificador pasado como parámetro

- El método updateNote() actualiza la nota con el identificador pasado como parámetro con el título y cuerpo especificados

Paso 3

Abre el fichero res/layout/notepad_list.xml y échale un vistazo.
Se trata de un fichero de defición de layout casi vacío.
Estas son algunas cosas que deberías saber sobre un fichero de layout:

- Todos los ficheros de layout de Android deben empezar con la cabecera:

- La siguiente definición será a menudo (no siempre) una definición de layout de algún tipo, en nuestro caso un LinearLayout

- El espacio de nombres del XML de Android siempre debe ser definido en el componente de nivel superior o layout en el XML, de manera que las etiquetas de Android se puedan usar en el resto del archivo

xmlns:android="http://schemas.android.com/apk/res/android"


Paso 4

Necesitamos crear un layout personalizado para mostrar la lista de notas. Añade el siguiente código dentro del elemento LinearLayout (se puede copiar del paso 4 de esta página):

El fichero debe tener el siguiente aspecto:

- El símbolo @ de las cadenas id significa que el parser XML debe parsear y expandir el resto de la cadena id y utilizar un recurso identificador
- ListView y TextView pueden ser considerados como dos vistas alternativas, con la peculiaridad de que sólo una sólo se mostrará una a la vez. ListView se utilizará cuando haya notas que mostrar, mientras que TextView se mostrará si aún no hay notas que mostrar
- Los identificadores list y empty nos los proporciona la plataforma Android, por lo que tenemos que poner el prefijo android: antes del id (por ej. @android:id/list)
- La vista con el id empty se utiliza automáticamente cuando el ListAdapter no tiene datos para la ListView. También se puede cambiar la vista por defecto para empty mediante el método setEmptyView(View) en la ListView

La clase android.R es un conjunto de recursos predefinidos proporcionados por cada plataforma, mientras que la clase R de nuestro proyecto es el conjunto de recursos que éste ha definido. Los recursos de la clase android.R se pueden utilizar en los ficheros XML mediante el prefijo de espacio de nombres android:, como hemos visto.

Paso 5

Para crear la lista de notas en la ListView, necesitamos definir una vista para cada fila:

1. Crea un nuevo fichero en res/layout llamado notes_row.xml
2. Añade las siguientes líneas (se pueden copiar del paso 5 de esta página):

Se trata de la vista que se utilizará para cada título de nota.
En este caso creamos un nuevo id llamado text1. El + después de la @ indica que el id se debe crear automáticamente como recurso si no existe.

3. Guarda el fichero

Abre la clase gen/com.android.demo.notepadv1/R.java y mírala. Deberías ver las nuevas definiciones de notes_row y text1.

Paso 6

Ahora abre la clase Notepadv1. En los siguientes pasos vamos a hacer que sea un ListAdapter, que muestre nuestras notas, y que nos permita añadir nuevas.

Notepadv1 heredará de una subclase de Activity llamada ListActivity, que ofrece funciones extras para el manejo de listas.

Observa el código de la clase. Notarás que hay un atributo privado llamado mNoteNumber sin utilizar. Nos servirá para crear títulos de nota numerados.

Podemos ver que hay 3 métodos que hay que sobrescribir (override):
- onCreate(): llamado cuando se inicia la actividad (especie de método main para una Activity)
- onCreateOptionsMenu(): se muestra cuando el usuario presiona el botón de menú y éste tiene una lista de opciones a mostrar
- onOptionsMenuItemSelected(): se usa para gestionar los eventos generados por el menú (qué hacer cuando se selecciona un ítem determinado)

Paso 7

Cambia la herencia de Notepadv1 de Activity a ListActivity:

public class Notepadv1 extends ListActivity

NOTA: para importar todos los paquetes necesarios presiona Ctrl+Shift+O.


Paso 8

Rellena el método onCreate() con el siguiente código (lo puedes copiar del paso 8 de esta página):

Y asegúrate de que existe la definición del atributo mDbHelper:

private NotesDbAdapter mDbHelper;

Con este código establecemos el título de la Activity (el que se mostrará en la aprte superior de la pantalla), utilizamos el layout de notepad_list que creamos, creamos la instancia de NotesDbAdapter que accederá a los datos de las notas y rellenaremos la lista con los títulos de las notas disponibles.

Paso 9

Rellena el método onCreateOptionsMenu() con el siguiente código (lo puedes copiar del paso 9 de esta página):

Con esto creamos el botón "Añadir nota" que aparecerá cuando presionemos el botón de menú de la aplicación, especificando que queremos que este en la posición 0 (la primera).

Después, crea esta constante en la clase, que indica la posición en el menú:

public static final int INSERT_ID = Menu.FIRST;

Por último, edita el fichero res/values/strings.xml y añade este string:

Y ya que estamos, traducimos el otro string de manera que el fichero quede así:



Paso 10

Rellena el método onOptionsItemSelected() con el siguiente código (lo puedes copiar del paso 10 de esta página):

Con esto gestionamos el ítem "Añadir nota" del menú. Cuando lo seleccionemos, el método será invocado mediante el item.getItemId() que devolverá siempre el único valor definido: INSERT_ID (la constante que usamos para identificar el ítem de menú). Una vez detectado, tomará las acciones apropiadas, en este caso crear una nota con createNote().

Paso 11

Crea un nuevo método llamado createNode() con el siguiente código (se puede copiar del paso 11 de esta página):

Lo que hace es crear una nota con nombre "Nota x" (donde x será el valor de mNoteNumber) y contenido vacío. Luego llama al método fillData() que veremos en el siguiente paso.

Paso 12

Define el método fillData() con el siguiente código (se puede copiar del paso 12 de esta página):

Y presiona Ctrl+Shift+O para importar los paquetes necesarios.

Esto es lo que hemos hecho:

1. Después de obtener el Cursor de mDbHelper.fetchAllNotes(), utilizamos el método startManagingCursor() que permite a Android controlar el ciclo de vida del Cursor, en vez de tener que hacerlo nosotros.

2. Luego creamos un array de cadenas de texto en las que declaramos las columnas que queremos y un array de enteros que define las vistas que queremos asignar a cada columna (deben estar en orden)
3. Luego instanciamos el SimpleCursorAdapter. Necesita un contexto, por lo que le pasamos this (ya que las subclases de Activity implementan Context). También le pasamos la vista notes_row que hemos creado, el Cursor y los arrays.

Paso 13

Ejecuta la aplicación y prueba a añadir algunas notas presionando el botón de menú y seleccionando "Añadir nota".

Solución

Puedes ver la solución abriendo el proyecto Notepadv1Solution para compararla con la tuya.
En la próxima parte seguiremos con el ejercicio 2, que nos permitirá crear, editar y eliminar notas.