Bienvenido a Klr20mg

Cronicas de un desarrollador

Actualmente soy Jefe de Desarrollo del area Flash en Sapotek de México en la cual trabajo desde hace mas de 4 años. Desarrollando aplicaciones en Flash para Web mas comúnmente llamadas (RIAs)

Estas en : Blog » Trabajando con SQLite, AIR y FLASH CS3
  • Decrease font size
  • Default font size
  • Increase font size
  • color default
  • color verde
  • color azul
Trabajando con SQLite, AIR y FLASH CS3
AddThis Social Bookmark Button
 Post2PDF Print
January 17th, 2008

Air desde su versión beta 2 si no mal recuerdo trae integrado un engine de base de datos SQL mediante SQLite.

¿Que significa esto?

Significa que podemos crear base de datos locales desde nuestra aplicación de AIR sin la necesidad de que el usuario final instale nada más que el Runtime de AIR.

Con esto podemos crear eliminar modificar bases de datos, tablas, registro etc.

Para propósitos de este tutorial vamos a crear un simple cliente que cree una base de datos si no existe, que cree la tabla con la cual trabajaremos y donde consultaremos, agregaremos y eliminaremos entradas.

Cabe mencionar que para efectos prácticos no posteare todo el código en cada ejemplo. Al final del tutorial estará la clase final así como los archivos fuente para su estudio ;)

Creación de Base de Datos

Al ser una base de datos local, evidentemente dicho archivo se tiene que crear en la maquina del usuario, para saber si la base de datos existe o no, debemos verificar si el archivo existe, para ello hacemos uso de la Clase File

PLAIN TEXT
Actionscript:
  1. package com.tmeister.samples.sql
  2. {
  3.     import flash.filesystem.File;
  4.    
  5.     public class sqlSample extends MovieClip
  6.     {
  7.         private var db:File;
  8.        
  9.         public function sqlSample()
  10.         {
  11.             db = File.applicationStorageDirectory.resolvePath("myFirst.db");
  12.             (!db.exists) ? createDatabase() : dbExist();
  13.         }
  14.         private function createDatabase()
  15.         {
  16.             trace("Creamos la BD")
  17.         }
  18.         private function dbExist()
  19.         {
  20.             trace("La Base de datos ya existe")
  21.         }
  22.     }
  23. }

Con esto sabremos si la base de datos existe o no, si dicha base de datos no existe debemos crearla, pero antes de poder crearla debemos crear una instancia de la clase SQLConnection para poder conectarnos con el engine y después de esto entonces si crear la BD.

PLAIN TEXT
Actionscript:
  1. //Importamos las clases para trabajar con SQLite
  2. import flash.data.SQLConnection;
  3. import flash.events.SQLErrorEvent;
  4. import flash.events.SQLEvent;
  5.  
  6. //Creamos una nueva conexion y seteamos sus respectivos handlers
  7. conn = new SQLConnection();
  8. conn.addEventListener(SQLEvent.OPEN, dbConnOpen);
  9. conn.addEventListener(SQLErrorEvent.ERROR, dbConnError);
  10.  
  11. //"Abrimos" la base de datos, si no existe se crea
  12. conn.openAsync(db);
  13.  
  14. // Handlers de los eventos
  15. private function dbConnOpen(e:SQLEvent)
  16. {
  17.     trace("Se conecto a la base de datos ")
  18.     trace("Ya podemos hacer uso de la base de datos.")
  19. }
  20. private function dbConnError(e:SQLErrorEvent)
  21. {
  22.     trace("Error al conectarse a la base de datos");
  23.     trace(e)
  24. }

En esta parte de código asignamos 2 listeners a conn que es nuestra conexión con el engine, Los listeners son:

  • SQLEvent.OPEN : El cual se ejecuta cuando la base de datos esta lista para ser usada.
  • SQLErrorEvent.ERROR : El cual se ejecuta si un error ocurrió al momento de intentar acceder a la base de datos.

La línea “mágica” es

PLAIN TEXT
Actionscript:
  1. conn.openAsync(db);

Con esta instrucción abrimos la base de datos pasando como referencia el archivo respectivo, si el archivo no existe se crea automáticamente. Hay dos formas de trabajar con SQLite, de forma Síncrona o Asíncrona, en este ejemplo trabajamos con la segunda opción, en una entrada posterior tratare de explicar las diferencias entre cada una de ellas.

Con esto ya tenemos una base de datos creada ahora lo siguiente es crear un tabla

Creación de Tablas

Una vez que ya tenemos nuestra base de datos ahora necesitamos una tabla en donde insertar datos.

Las interacciones hacia la base de datos es exactamente igual que en otros lenguajes de programación (dígase PHP), se crea la conexión a la base de datos se escribe el SQL y se ejecuta la instrucción.

Lo único que cambia en AS3 es que debemos crear una instancia de la clase SQLStatement en la cual seteamos que conexión a DB usar, asignar la cadena de consulta o ejecución (SQL) y asignar los valores.

Todo esto se resume a lo siguiente.

PLAIN TEXT
Actionscript:
  1. import flash.events.SQLErrorEvent;
  2. import flash.events.SQLEvent;
  3.  
  4. private const TABLE_NAME:String = "people"
  5.  
  6. //Creamos una instancia de la clase
  7. var dbManager:SQLStatement = new SQLStatement();
  8.  
  9. //Asignamos la conexion a la base de datos
  10. dbManager.sqlConnection  = conn
  11.  
  12. //Asignamos listeners a los eventos
  13. dbManager.addEventListener(SQLErrorEvent.ERROR, sqlError);
  14. dbManager.addEventListener(SQLEvent.RESULT, tableResult);
  15.  
  16. //Sentencia a ejecutar
  17. var sql:String = "CREATE TABLE " + TABLE_NAME + " (";
  18. sql += "id INTEGER PRIMARY KEY AUTOINCREMENT,"
  19. sql += "name TEXT,";
  20. sql += "age NUMERIC";
  21. sql += ")";
  22.  
  23. //La sentencia SQL debe ser asignada a la propiedad text del SQLStatement
  24. dbManager.text = sql;
  25.  
  26. //Por ultimo ejecutamos la sentencia
  27. dbManager.execute();
  28.  
  29. //Handlers
  30. private function tableResult(e:SQLEvent)
  31. {
  32.     trace("La tabla se creo correctamente");
  33. }
  34. private function sqlError(e:SQLErrorEvent)
  35. {
  36.     trace("Error: "+ e.error.message);
  37.     trace("Detalles: "+ e.error.details);
  38. }

Inserts

Como mencione antes todas las interacciones con la base de datos se deben de hacer mediante una instancia de la clase SQLStatement. Lo único que cambia de acuerdo con el ejemplo anterior (Creación de tablas) es la sentencia SQL y la asignación de los valores de los campos.

Ejemplo de Insert

PLAIN TEXT
Actionscript:
  1. import flash.events.SQLErrorEvent;
  2. import flash.events.SQLEvent;
  3.  
  4. //Creamos una instancia de la clase
  5. var insertManager:SQLStatement = new SQLStatement();
  6.  
  7. //Asignamos la conexion a la base de datos
  8. insertManager.sqlConnection = conn;
  9.  
  10.  
  11. //Asignamos listeners a los eventos
  12. insertManager.addEventListener(SQLEvent.RESULT, insertResult);
  13. insertManager.addEventListener(SQLErrorEvent.ERROR, sqlError);
  14.  
  15. //Sentencia a ejecutar
  16. var sql:String = "INSERT INTO " + TABLE_NAME + " (name, age) VALUES (:name, :age)";
  17.  
  18. //Asignacion de valor a los parametros de la sentencia
  19. insertManager.parameters[":name"] = "Tmeister";
  20. insertManager.parameters[":age"] = "29";
  21.  
  22. //La sentencia SQL debe ser asignada a la propiedad text del SQLStatement
  23. insertManager.text = sql;
  24.  
  25. //Por ultimo ejecutamos la sentencia
  26. insertManager.execute();
  27.  
  28. //Handlers
  29. private function tableResult(e:SQLEvent)
  30. {
  31.     trace("La tabla se creo correctamente");
  32. }
  33. private function sqlError(e:SQLErrorEvent)
  34. {
  35.     trace("Error: "+ e.error.message);
  36.     trace("Detalles: "+ e.error.details);
  37. }

Aqui vemos cosas nuevas en la sentencia.

Primero

PLAIN TEXT
Actionscript:
  1. var sql:String = "INSERT INTO " + TABLE_NAME + " (name, age) VALUES (:name, :age)";

Si pueden ver los valores de los campos están precedidos de dos puntos : esto significa que son parámetros de la sentencia.

La clase SQLStatement tiene una propiedad llamada parameters que es un Array en donde se tiene que asignar el valor de cada parámetro escrito en nuestra sentencia, en este ejemplo tenemos 2 parámetros :name y :age entonces necesitamos asignarle valores esto se hace con estas líneas

PLAIN TEXT
Actionscript:
  1. insertManager.parameters[":name"] = "Tmeister";
  2. insertManager.parameters[":age"] = "29";

En realidad es algo simple. no?

Obteniendo datos de la base de datos

Para obtener datos de la base de datos es exactamente lo mismo que hicimos para crear la tabla, solamente cambia la sentencia SQL

PLAIN TEXT
Actionscript:
  1. import flash.events.SQLErrorEvent;
  2. import flash.events.SQLEvent;
  3. import flash.data.SQLStatement;
  4.  
  5. private const TABLE_NAME:String = "people"
  6.  
  7. //Creamos una instancia de la clase
  8. var query:SQLStatement = new SQLStatement();
  9.  
  10. //Asignamos la conexion a la base de datos
  11. query.sqlConnection = conn
  12.  
  13. //Asignamos listeners a los eventos
  14. query.addEventListener(SQLErrorEvent.ERROR, sqlError);
  15. query.addEventListener(SQLEvent.RESULT, sqlResult);
  16.  
  17. //Sentencia a ejecutar
  18. var sql:String = "SELECT * FROM " + TABLE_NAME + " order by id";
  19.  
  20. //La sentencia SQL debe ser asignada a la propiedad text del SQLStatement
  21. query.text = sql;
  22.  
  23. //Por ultimo ejecutamos la sentencia
  24. query.execute();
  25.  
  26. private function sqlError(e:SQLErrorEvent)
  27. {
  28.     trace("Error: "+ e.error.message);
  29.     trace("Detalles: "+ e.error.details);
  30. }
  31. private function sqlResult(e:SQLEvent)
  32. {
  33.     var result:SQLResult = e.target.getResult();
  34.     for each ( var row:Object in result.data)
  35.     {
  36.         trace(row)
  37.         trace(row.id)
  38.         trace(row.name)
  39.         //etc
  40.     }
  41. }

Para obtener el resultado de la consulta de debemos ejecutar la función getResult de la instancia SQLStatement.

PLAIN TEXT
Actionscript:
  1. var result:SQLResult = e.target.getResult();

Por último solo queda recorrer los resultados, que son devueltos como objetos

PLAIN TEXT
Actionscript:
  1. for each ( var row:Object in result.data)
  2.     {
  3.         trace(row)
  4.         trace(row.id)
  5.         trace(row.name)
  6.         //etc
  7.     }

Con esto ya podemos comenzar a trabajar con SQLite para manejar información en la maquina local del usuario final.

Archivos para descarga

download

Download: SQLite
Version: 0.1
Updated: January 17 2008
Size: 898.21 KB

download

Download: SQLSample
Version: 0.1
Updated: January 17 2008
Size: 78.04 KB

Entradas Relacionadas

Comentarios

7 Comentarios en “Trabajando con SQLite, AIR y FLASH CS3”

Fantástico Tmeister, un tutorial completísimo!

Hace sólo un par de meses que estoy tocando AIR y me encanta. Llevar Flash al escritorio pero añadiéndole características tan potentes como el acceso a SQLite es una gozada. Espero poder mostrar pronto las cosas que estoy haciendo :)

Y una pregunta respecto a Apollo-Code, ¿piensas darle continuidad? El proyecto es genial, sólo que quizá te adelantaste demasiado xD, pero la comunidad hispanoparlante va a necesitar iniciativas como esa.

llops escribio el 17-January-2008 a las 2:59 pm

Que tal Dani.

Aun no se qué hacer con apollo-code, en definitiva no será un blog, no veo caso estar manteniendo 2 blog sobre casi la misma temática, bien puedo postear en klr20mg cosas relacionadas sobre AIR como lo he venido haciendo.

He pensado mas en un sitio más complejo foros, tutoriales, repositorio de aplicaciones. Pero aun no estoy seguro que hacer pero ya lo resolveré. :P

Saludos!!

Tmeister escribio el 18-January-2008 a las 2:23 pm

Perfeito!!! Genial!!!
CAra estou a dias procurando algo sobre SQLite, que fosse claro. E você me fez encontrar. E o primeiro tutorial de toda net que disponibiliza um tutorial tão claro.
Otimo! já guardei sua pagina nos meus favoritos. Continue com os tutoriais!!!

marcondes escribio el 18-January-2008 a las 11:17 pm

Buen tutorial, me agrada que actionscript siga extendiendose, aunque a los opositores les duela...

Tmeister, se que AIR es para hacer aplicaciones de escritorio, por lo tanto para poner aplicaciones como esta en un web hosting ya no requeriría AIR... mi pregunta es: ¿AS3 aun sin AIR puede interactuar con SQLite directamente si la aplicacion estubiera alojada en un web hosting, o necesitaria un intermedario como php (por ejemplo) como lo necesitaba en AS2?

Gracias

deftones_sv escribio el 20-February-2008 a las 10:07 am

Gracias por toda esta información, pero me gustaría que hiciera vídeotutoriales, ya que llegarían los conocimientos, a mas personas, me refiero a la pedagogía que ofrecen los productos audiovisuales.
Perdón si sueno exigente ( no es mi intención es mi emoción ), pero se necesita tanto de estos conocimientos.
Muchas Gracias por su labor, cuando afiance mis conocimientos en estas tecnologías estaré para ayudar en lo que sea necesario.

christian escribio el 2-March-2008 a las 8:55 am

¿Y si el usuario no tiene instalado SQLite?

David escribio el 10-March-2008 a las 4:27 pm

@David,

No, el usuario no tiene que tener instalado SQLite, solo el Runtime de AIR

Saludos!!

Tmeister escribio el 10-March-2008 a las 4:36 pm

Leave a Reply

[ Back ]

 Blog editado por:

Enrique Chavez aka Tmeister
Si los codigos de este sitio te han ayudado y gustas ayudar de alguna forma:

 Compra Links

 Suscribete


AddThis Social Bookmark Button

 Archivo

2008
2007
2006
2005
2004