Crear una aplicación con SQLite en iOS 6 (Parte 1)

Crear una aplicación para operaciones básicas con SQLite en iOS

Parte 1: Crear la base de datos y mostrar datos en una tabla

En el siguiente tutorial vamos a explicar cómo crear una aplicación sencilla que nos permita realizar las cuatro operaciones básicas contra una base de datos SQLite: altas, bajas, modificaciones y consultas. En esta primera parte del tutorial, vamos a crear la base de datos mediante un gestor, introducir algunos datos de prueba y luego crear una aplicación que muestre estos datos en la pantalla de nuestro dispositivo mediante una tabla.

Paso 1: Crear la base de datos

1.1 Descargar un gestor de SQLite

En primer lugar, necesitamos descargar un gestor de SQLite. Recomendamos el addon de Firefox llamado "SQLite Database Manager". Si no utilizas Firefox, puedes descargar otro gestor desde SQLAbs.

1.2 Crear una nueva base de datos

Ejecuta el addon de SQLite Database Manager y crea una nueva base de datos. Asegúrate de elegir un nombre para la base de datos y guarda el archivo .sqlite en la ubicación deseada.

Elegimos el nombre que queramos. Una vez aceptemos, nos creará un fichero .sqlite con el nombre que hayamos elegido en la ubicación que queramos. Para este tutorial, hemos elegido el nombre vehiculos.sqlite.

1.3 Crear la tabla en la base de datos

A continuación hacemos click en el botón de Crear Tabla y podremos crear la primera tabla de nuestra nueva base de datos. Utiliza los siguientes campos para la tabla:

• ID (tipo: INTEGER)
• Nombre del vehículo (tipo: TEXT)
• Número de ruedas (tipo: INTEGER)

Paso 2: Insertar datos de prueba en la tabla

2.1 Abrir la tabla en el gestor de base de datos

Despliega la sección de tablas en el gestor de base de datos y selecciona la tabla que has creado.

2.2 Añadir datos de prueba

Con nuestra tabla seleccionada, en la parte derecha de la ventana veremos un botón que nos permitirá añadir una nueva fila a la tabla. En la siguiente imagen vemos de qué botón se trata:

Nos aparecerá una ventana con los tres campos de la tabla para rellenar. Insertamos los datos que queramos (para este tutorial, con tres vehículos nos bastará) rellenando todos los campos y confirmando los cambios cuando el programa nos lo pida. Repetimos la operación hasta completar el número de vehículos que queramos. Para finalizar, una vez hayamos insertado el último, hacemos click en el botón de cancelar y nos aparecerá lo siguiente por pantalla:

Con esto terminan nuestras operaciones con el gestor de base de datos.

Paso 3: Crear el proyecto en Xcode

3.1 Crear un proyecto de Xcode

A continuación vamos a crear el proyecto de XCode con el que crearemos nuestra aplicación. Elegimos un proyecto de tipo Single View Application y lo nombramos como queramos, en este caso hemos elegido el nombre VehiculosCRUD.Indicaremos que la aplicación será para iPhone, utilizará Storyboards y también utilizará ARC.

3.2 Añadir la librería SQLite

Dirígete a la sección "Linked Frameworks and Libraries" en la configuración del proyecto y añade una nueva entrada utilizando el botón "+". Busca y añade la librería "libsqlite3.0.dylib" a tu proyecto.

3.3 Añadir el archivo de base de datos al proyecto

Ahora, buscamos el fichero que contiene nuestra base de datos, la cual hemos creado antes. Busca el archivo .sqlite que has creado anteriormente y arrástralo a la lista de archivos del proyecto en Xcode. Asegúrate de seleccionar las opciones correctas en la ventana que aparece, tal y como muestra la imagen:

Paso 4: Crear las clases para las operaciones con la base de datos

Ahora vamos a crear las operaciones.

4.1 Crear la clase Vehiculo

Primero crearemos un grupo y lo haremos desde el menú File y seleccionando la opción New Group. Le pondremos como nombre modelo. Una vez creado el nuevo grupo, crearemos la clase que nos mapeará la tabla de vehiculo. La clase la crearemos seleccionando el nuevo grupo y, desde el menú contextual, seleccionaremos New File. Elegimos Objective-C class, le indicamos que será una subclase de NSObject y la llamaremos Vehiculo. Una vez la creemos, le añadimos las propiedades necesarias para mapear los campos de la tabla de base de datos, tal y como podemos ver en el siguiente código:

1Vehiculo.h
2#import
3@interface Vehiculo : NSObject{
4    NSInteger vehiculoID;
5    NSString *nombreVehiculo;
6    NSInteger numeroRuedas;
7}
8@property (nonatomic, assign) NSInteger vehiculoID;
9@property (nonatomic, retain) NSString *nombreVehiculo;
10@property (nonatomic, assign) NSInteger numeroRuedas;
11
12@end
13
14Vehiculo.m
15#import "Vehiculo.h"
16
17@implementation Vehiculo
18
19@synthesize vehiculoID;
20@synthesize nombreVehiculo;
21@synthesize numeroRuedas;
22
23@end

4.2 Crear el método obtenerRutaBD

A continuación creamos la clase que nos permitirá realizar las operaciones contra la base de datos. Esta clase también la crearemos dentro del grupo modelo. Repetimos la misma operación con la que creamos la clase Vehiculo: Objective-C class, subclase de NSObject y la llamaremos VehiculoDAO. Una vez creada, le añadiremos las propiedades necesarias y definiremos los métodos de obtener datos y obtener la ruta de base de datos, tal y como podemos ver en el siguiente código:

1VehiculoDAO.h
2#import
3@interface VehiculoDAO : NSObject{
4sqlite3 *bd;
5}
6- (NSMutableArray *) obtenerVehiculos;
7- (NSString *) obtenerRutaBD;
8
9@end
10
11VehiculoDAO.m
12#import "VehiculoDAO.h"
13#import "Vehiculo.h"
14
15@implementation VehiculoDAO
16
17- (NSString *) obtenerRutaBD{
18    NSString *dirDocs;
19    NSArray *rutas;
20    NSString *rutaBD;
21rutas = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
22dirDocs = [rutas objectAtIndex:0];
23NSFileManager *fileMgr = [NSFileManager defaultManager];
24rutaBD = [[NSString alloc] initWithString:[dirDocs stringByAppendingPathComponent:@"vehiculos.sqlite"]];
25if([fileMgr fileExistsAtPath:rutaBD] == NO){
26[fileMgr copyItemAtPath:[[[NSBundle mainBundle] resourcePath] stringByAppendingPathComponent:@"vehiculos.sqlite"] toPath:rutaBD error:NULL];
27}
28    return rutaBD;
29}
30- (NSMutableArray *) obtenerVehiculos{NSMutableArray *listaVehiculos = [[NSMutableArray alloc] init];
31NSString *ubicacionDB = [self obtenerRutaBD];if(!(sqlite3_open([ubicacionDB UTF8String], &bd) == SQLITE_OK)){NSLog(@"No se puede conectar con la BD");
32}
33const char *sentenciaSQL = "SELECT id, nombre_vehiculo, numero_ruedas FROM vehiculo";
34sqlite3_stmt *sqlStatement;
35if(sqlite3_prepare_v2(bd, sentenciaSQL, -1, &sqlStatement, NULL) != SQLITE_OK){
36    NSLog(@"Problema al preparar el statement");
37}
38while(sqlite3_step(sqlStatement) == SQLITE_ROW){
39    Vehiculo *vehiculo = [[Vehiculo alloc] init];vehiculo.vehiculoID = sqlite3_column_int(sqlStatement, 0);
40    vehiculo.nombreVehiculo = [NSString stringWithUTF8String:(char *) sqlite3_column_text(sqlStatement, 1)];
41    vehiculo.numeroRuedas = sqlite3_column_int(sqlStatement, 2);
42    [listaVehiculos addObject:vehiculo];
43}
44    return listaVehiculos;
45}

Hemos creado el método obtenerRutaBD con vistas a la segunda parte de este tutorial, en el que realizaremos inserciones, modificaciones y borrados. El propósito de este método es el de copiar al directorio de Documents del dispositivo el fichero .sqlite siempre y cuando éste no exista. Esto es debido a que no se puede escribir en ficheros que se encuentren en la raíz de la aplicación (main bundle) ya que es de sólo lectura. Por otro lado, en el método obtenerVehiculos podemos ver cómo se obtiene la ruta de nuestro fichero de base de datos, se abre la conexión, se prepara la sentencia y se lanza. Todo esto puede hacerse gracias a los métodos sqlite3_open, sqlite3_prepare_v2 y sqlite3_step.

Paso 5: creación de Storyboard

Ahora crearemos nuestro storyboard para poder gestionar todas estas operaciones. Primero de todo, añadiremos a nuestro storyboard un TableViewController. Una vez añadido, seleccionamos el controller y una vez hecho esto, abrimos el menú Editor y seleccionamos la opción Embed In -> Navigation Controller. También añadiremos un ViewController al storyboard, y a este nuevo ViewController le añadimos dos UILabel y dos UITextField y le ponemos como identificador el nombre visualización, quedando finalmente nuestro storyboard tal y como muestra la siguiente imagen:

También seleccionamos la celda del TableViewController y le ponemos como identificador el nombre celda.

Paso 6: mostrar datos en TableViewController

Ahora vamos a centrarnos en mostrar datos en el TableViewController. Lo primero que haremos será crear una nueva clase que sea una subclase de UITableViewController, la llamaremosListaVehiculosViewController y en nuestro storyboard se la asignaremos al TableViewController. En esta nueva clase definiremos un objeto de tipo VehiculoDAO y otro de tipo NSMutableArray. En el método viewDidLoad inicializaremos estos dos objetos y, una vez inicializados, lanzaremos una consulta para que nos devuelva todos los vehículos de nuestra tabla con este código:

1ListaVehiculosViewController.h
2#import
3#import "VehiculoDAO.h"
4@interface ListaVehiculosViewController : UITableViewController{
5    VehiculoDAO *dao;NSMutableArray *vehiculos;
6}
7
8@property (nonatomic, strong) VehiculoDAO *dao;
9@property (nonatomic, strong) NSMutableArray *vehiculos;
10
11@end
12
13ListaVehiculosViewController.m@synthesize dao;
14@synthesize vehiculos;
15- (void)viewDidLoad{
16    dao = [[VehiculoDAO alloc] init];
17    vehiculos = [[NSMutableArray alloc] init];
18    vehiculos = [dao obtenerVehiculos];
19    [super viewDidLoad];
20}
21- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
22    return 1;
23}
24- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
25    return [vehiculos count];
26}
27- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
28    static NSString *CellIdentifier = @"celda";
29    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
30    cell.textLabel.text = [[vehiculos objectAtIndex:[indexPath row]] valueForKey:@"nombreVehiculo"];
31    return cell;
32}
33- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
34    ModVehiculoViewController *destino = [self.storyboard instantiateViewControllerWithIdentifier:@"visualizacion"];
35    Vehiculo *tmp = [vehiculos objectAtIndex:[indexPath row]];
36    destino.vehiculo = tmp;
37    [self.navigationController pushViewController:destino animated:YES];
38}

Como podemos ver en el código, le indicaremos que sólo tendrá una sección y el número de filas será el tamaño del array que nos devuelva la consulta. También hemos implementado el método didSelectRowAtIndexPath para hacer la transición desde la celda hasta el ViewController que nos enseñará los datos del vehículo.

Paso 7: modificaciones y resultado

Por último, nos centraremos en el ViewController de destino. Para ello, vamos a aprovecharnos de la clase ViewController que se crea por defecto cuando creamos el proyecto. Primero de todo, la renombramos a ModVehiculoViewController y se la asignamos en el storyboard al ViewController. Una vez hecho esto, en la clase definiremos los IBOutlet necesarios, un objeto de tipo VehiculoDAO y otro objeto de tipo Vehiculo. Por último, definiremos también un método para ocultar el teclado. La clase quedará como puede verse en el siguiente código:

ModVehiculoViewController.h

1#import
2#import "VehiculoDAO.h"
3#import "Vehiculo.h"
4@interface ModVehiculoViewController : UIViewController{
5    IBOutlet UILabel *etqNombre;IBOutlet UILabel *etqRuedas;IBOutlet UITextField *txtNombre;IBOutlet UITextField *txtRuedas;VehiculoDAO *dao;Vehiculo *vehiculo;
6}
7
8@property (nonatomic, strong) IBOutlet UILabel *etqNombre;
9@property (nonatomic, strong) IBOutlet UILabel *etqRuedas;
10@property (nonatomic, strong) IBOutlet UITextField *txtNombre;
11@property (nonatomic, strong) IBOutlet UITextField *txtRuedas;
12@property (nonatomic, strong) Vehiculo *vehiculo;
13@property (nonatomic, strong) VehiculoDAO *dao;
14
15- (IBAction) ocultarTeclado:(id)sender;
16
17@end
18
19ModVehiculoViewController.m
20@synthesize etqNombre;
21@synthesize etqRuedas;
22@synthesize txtNombre;
23@synthesize txtRuedas;
24@synthesize dao;
25@synthesize vehiculo;
26-(void) touchesBegan :(NSSet *) touches withEvent:(UIEvent *)event{
27    [txtNombre resignFirstResponder];
28    [txtRuedas resignFirstResponder];
29    [super touchesBegan:touches withEvent:event ];
30}
31- (IBAction)ocultarTeclado:(id)sender{}
32- (void)viewDidLoad{
33    [txtNombre setText:vehiculo.nombreVehiculo];
34    [txtRuedas setText:[NSString stringWithFormat:@"%d", vehiculo.numeroRuedas]];
35    [txtRuedas setKeyboardType:UIKeyboardTypeNumberPad];
36    dao = [[VehiculoDAO alloc] init];
37    [super viewDidLoad];
38}

Y con esto ya tenemos la primera parte de nuestro tutorial terminada. Bastará con ejecutar el simulador para ver el resultado:

Parte 2 del tutorial

Puedes continuar con la segunda parte del tutorial haciendo click aquí.