domingo, 18 de marzo de 2018

Continùa firme el desarrollo de unik qml engine


He estado horas, días, semanas y semanas corrigiendo unik qml engine. Durante el proceso de corrección, surgieron unas y otras cuestiones a solucionar. Lo que más me ha sorprendido, es la cantidad de nuevas ideas e implementaciones que eran necesarias y útiles para agregar a unik.

Una de las carcterísticas principales es que el módulo unik-tools, se ha convertido en la aplicación por defecto con la cuál se podrán gestionar, ejecutar y descargar todos los proyectos QML que sean necesarios utilizar. Otra característica a tener en cuenta es la posibilidad de que unik pueda cargar proyectos QML desde GitHub.com.

Hay un sin fin de nuevas funcionalidades que unik qml engine ha incorporado. Muchas de las nuevas funcionalidades han posibilitado que los módulos existentes y los que se desarrollarán en el futuro, podrán actualizarse automáticamente desde GitHub.com, podrán realizar lanzamientos de nuevas instancias en modalidades diferentes, apagar las aplicaciones anidadas de modo definitivo o dejando unik-tools a disposición.

Podemos mencionar las nuevas posibilidades de lanzar una instancia de unik qml engine con una dimensión de ventana o posición de ventana ambos con valores preterminados. Se ha modificado el modo en que se codifican o decodifican los paquetes de extensión .UPK.

La tarea està resultando ardua. Lo que màs me da ànimo es que tambièn resulta entretenida y me siento muy còmodo a cada momento, en cada tramo, segmento o jornada que aboco a ello.

Al dìa de la fecha, està a disposiciòn el instalador para GNU/Linux, Windows, Macos y Android, para todos en la versiòn 2.12.2. En breve espero tener novedades para recibir de manera oficial el apoyo y patrocinio de parte de una empresa interesada en apoyar el proyecto. Una vez que todo ya estè oficializado, de manera clara y precisa se definirà el dominio y pàgina oficial de descarga de unik qml engine.

Por ùltimo voy anticipando que harè una publicaciòn sobre lo que està sucediendo con unik qml engine en el àmbito Universitario. Hay muy buenas novedades con respecto a lo ùtil y funcional que unik qml engine para dar los primeros pasos con QtQuick y QML.

sábado, 3 de marzo de 2018

codificar y decodificar datos con unik

Nota: Para utilizar este tutorial es necesario unik version 2.5 o superior.

Si aún no conoces QML y te preguntas ¿Porqué y cuáles son las ventajas de programar en QML?, aquí tienes algo de información sobre sus características y ventajas. https://nsdocs.blogspot.com.ar/2018/01/programar-en-qml-cuales-son-sus-ventajas.html

Si te preguntas ¿Porqué programar en QML utilizando unik?, aqui tienes información sobre cuáles son sus Pros y sus Contras. https://nsdocs.blogspot.com.ar/2018/02/porque-programar-en-qml-utilizando-unik.html

En este tutorial se enseñará a crear una aplicacion que consistira en lo siguiente:

1) Crear una ventana principal de aplicación de manera sencilla y rapida con QML.
2) Crear y conectar a una base de datos SQLITE de manera rápida y sencilla con unik.
3) Crear tabla SQLITE.
4) Insertar un registro con datos codificados en la tabla SQLITE.
5) Obtener datos codificados desde una tabla SQLITE.

Requisitos para utilizar este tutorial

1) Instalar el unik qml engine. Tamaño 100Mb. desde AQUI
2) Un editor de texto.

Paso 1: Crear carpeta de nuestra aplicación
Por ejemplo qml-sqlite-encode.

Paso 2: Crear el archivo QML principal para la Ventana Principal de nuestra aplicación. El archivo lo crearemos dentro de la nuestra carpeta qml-sqlite-encode y  lo llamaremos "main.qml".

import QtQuick 2.0
import QtQuick.Controls 2.0

ApplicationWindow{
    id: app
    visible:  true
    visibility: "Maximized"
}

Explicación del código

Las primeras 2 lineas importan las librerias que utilizaremos en nuestra aplicación. Por último creamos un elemento QML del tipo ApplicationWindow{} que nos permite abrir o mostrar la ventana principal de nuestra aplicación. Le hemos seteado algunos parametros básicos. Un id de nombre "app", que la ventana sea visible y que se inicie como una ventana maximizada.

Paso 3: Inicializar la base de datos sqlite

import QtQuick 2.0
import QtQuick.Controls 2.0

ApplicationWindow{
    id: app
    visible:  true
    visibility: "Maximized"

    Component.onCompleted: {
          unik.setUkStd("Directorio actual: "+unik.getPath(5))

          unik.sqliteInit('bd.sqlite')
    }
}



Explicación del código

Hemos agregado un disparador onCompleted que se utiliza para ejecutar un bloque de código cuando un componente ha sido cargado de manera completa. Al terminar de cargarse la ventana principal ejecutara una función de unik. La función sqliteInit() de unik sirve para inicializar una base de datos sqlite. Esta función requiere 1 parametro para el nombre o path absoluto de la ubicación del archivo sqlite que deseamos crear.

Paso 4: Crear una tabla sqlite

import QtQuick 2.0
import QtQuick.Controls 2.0

ApplicationWindow{
    id: app
    visible:  true
    visibility: "Maximized"

    Component.onCompleted: {
        unik.setUkStd("Directorio actual: "+unik.getPath(5))

        unik.sqliteInit('bd.sqlite')
        var sql='CREATE TABLE IF NOT EXISTS tabla(
                        id INTEGER PRIMARY KEY AUTOINCREMENT,
                        data TEXT
                )'
        unik.sqlQuery(sql);
    }
}


Explicación del código

Creamos una variable JavaScript del tipo string llamada "sql". Esta variable contiene la sentencia SQL necesaria para crear nuestra simple tabla de ejemplo llamada "tabla". Luego ejecutamos un método de unik llamado sqlQuery(). Esta función ejecuta la sentencia SQL preparada en el string mencionado.

Paso 5: Insertar un registro codificado

import QtQuick 2.0
import QtQuick.Controls 2.0

ApplicationWindow{
    id: app
    visible:  true
    visibility: "Maximized"

    Component.onCompleted: {
        unik.setUkStd("Directorio actual: "+unik.getPath(5))

        unik.sqliteInit('bd.sqlite')
        var sql='CREATE TABLE IF NOT EXISTS tabla(
                        id INTEGER PRIMARY KEY AUTOINCREMENT,
                        data TEXT
                )'
        unik.sqlQuery(sql);


        var sqliteUserPass = 'miusuario'

        var sqliteKeyPass = 'miclave'

        var data = 'Nuevo Mundo\n\n'
                +'Un nuevo mundo apareció,\n'
                +'meta mensaje apareció.\n'
                +'Me sorprendió tomando el sol\n'
                +'en la terraza.\n'

                +'Un hongo en el cielo se formó\n'
                +'y explotaron las estrellas,\n'
                +'alguien tiró la bomba,\n'
                +'todo se puso violeta.\n\n'

                +'Naranja, amarillo, negro,\n'
                +'nubes de titanio,\n'
                +'por fin volaron\n'
                +'todas las ciudades al espacio.\n\n'

                +'Espero que sea un sueño,\n'
                +'nadie sabe quién lo hizo,\n'
                +'la lava del volcán\n'
                +'del odio de nuestro delirio.\n\n'

                +'Los pájaros de hidrógeno\n'
                +'implotaron en el aire,\n'
                +'cabezas de elefantes\n'
                +'en los centros comerciales.\n\n'

                +'Y ahora, ¿Cómo mierda\n'
                +'van a criar a sus hijos?\n'
                +'Los códigos binarios\n'
                +'los volvieron estúpidos.\n\n'

                +'Chiquitos encerrados\n'
                +'en sus casas de plata,\n'
                +'mirando por las redes\n'
                +'cómo todos se matan.\n\n'

                +'Las bandas, en Rosario,\n'
                +'se re-cagan a tiros,\n'
                +'yo busco en la música,\n'
                +'la fe y lo maldito.\n\n'

                +'Enciendo, entiendo, elijo\n'
                +'y amo amar este fuego,\n'
                +'enciendo, entiendo, elijo\n'
                +'y amo mis compañeros.\n\n'

                +'Ya se quemaron todos\n'
                +'los bosques del planeta,\n'
                +'artistas, empresarios,\n'
                +'abogados, proxenetas.\n\n'

                +'Los dioses sólo viven\n'
                +'en películas de culto\n'
                +'que ya no se verán\n'
                +'en este nuevo mundo.\n\n'

                +'Es posible que sea cierto,\n'
                +'es posible que mis besos\n'
                +'sean, en el nuevo mundo,\n'
                +'besos de un amor profundo.\n\n'

                +'Nuevo mundo delirante,\n'
                +'nuevo mundo sin escapes,\n'
                +'nuevo mundo sin controles,\n'
                +'nuevo mundo ya sin sol.\n\n'

                +'Al nuevo mundo van mis hijos,\n'
                +'los robots, los niños ewoks\n'
                +'nuevo mundo, nuevas pistas,\n'
                +'nuevas grandes utopías.\n\n'

                +'Autor: Fito Pàez\n'
                +'Album: La Ciudad Liberada\n\n'

        sql='INSERT INTO tabla(data)VALUES(\''+unik.encData(data, sqliteUserPass, sqliteKeyPass)+'\')'                
    }
}


Explicación del código

Cramos 2 variables del tipo JavaScript para nuestros datos de acceso a los datos que codificaremos. Estas 2 variables pueden ser utilizadas por ejemplo por los datos de acceso de usuario y clave de una aplicacion o los datos de acceso que nos parezcan los mas conveniente. Estos 2 datos deben ser del tipo string para ser utilizados en el metodo encData() y decData() de unik.

Creamos o redifinimos el valor de la variable JavaScript llamada "sql". En este caso la sentencia SQL que utilizaremos es la que se utiliza para insertar un registro en una tabla. Volvemos a ejecutar el método de unik sqlQuery().

Hemos ingresado en la base de datos, dentro de la tabla llamada "tabla", los siguientes datos: En la columna nombre el dato "Juan" y en la columna edad el dato "40".

Paso 6: Obtener datos de la tabla

import QtQuick 2.0
import QtQuick.Controls 2.0

ApplicationWindow{
    id: app
    visible:  true
    visibility: "Maximized"

    Flickable{    
        width: app.width
        height: app.height
        contentWidth: datos.width
        contentHeight: datos.contentHeight
        TextArea{
            id:datos
            width: app.width*0.8
            x:app.width*0.1
            height: contentHeight
            font.pixelSize: 20
            wrapMode: Text.WrapAnywhere
        }
    }    

    Component.onCompleted: {    
        unik.setUkStd("Directorio actual: "+unik.getPath(5))
        unik.sqliteInit('bd.sqlite')
        var sql='CREATE TABLE IF NOT EXISTS tabla(
                        id INTEGER PRIMARY KEY AUTOINCREMENT,
                        data TEXT
                )'
        unik.sqlQuery(sql);
        
        var sqliteUserPass = 'miusuario'

        var sqliteKeyPass = 'miclave'

        var data = 'Nuevo Mundo\n\n'
                +'Un nuevo mundo apareció,\n'
                +'meta mensaje apareció.\n'
                +'Me sorprendió tomando el sol\n'
                +'en la terraza.\n'

                +'Un hongo en el cielo se formó\n'
                +'y explotaron las estrellas,\n'
                +'alguien tiró la bomba,\n'
                +'todo se puso violeta.\n\n'

                +'Naranja, amarillo, negro,\n'
                +'nubes de titanio,\n'
                +'por fin volaron\n'
                +'todas las ciudades al espacio.\n\n'

                +'Espero que sea un sueño,\n'
                +'nadie sabe quién lo hizo,\n'
                +'la lava del volcán\n'
                +'del odio de nuestro delirio.\n\n'

                +'Los pájaros de hidrógeno\n'
                +'implotaron en el aire,\n'
                +'cabezas de elefantes\n'
                +'en los centros comerciales.\n\n'

                +'Y ahora, ¿Cómo mierda\n'
                +'van a criar a sus hijos?\n'
                +'Los códigos binarios\n'
                +'los volvieron estúpidos.\n\n'

                +'Chiquitos encerrados\n'
                +'en sus casas de plata,\n'
                +'mirando por las redes\n'
                +'cómo todos se matan.\n\n'

                +'Las bandas, en Rosario,\n'
                +'se re-cagan a tiros,\n'
                +'yo busco en la música,\n'
                +'la fe y lo maldito.\n\n'

                +'Enciendo, entiendo, elijo\n'
                +'y amo amar este fuego,\n'
                +'enciendo, entiendo, elijo\n'
                +'y amo mis compañeros.\n\n'

                +'Ya se quemaron todos\n'
                +'los bosques del planeta,\n'
                +'artistas, empresarios,\n'
                +'abogados, proxenetas.\n\n'

                +'Los dioses sólo viven\n'
                +'en películas de culto\n'
                +'que ya no se verán\n'
                +'en este nuevo mundo.\n\n'

                +'Es posible que sea cierto,\n'
                +'es posible que mis besos\n'
                +'sean, en el nuevo mundo,\n'
                +'besos de un amor profundo.\n\n'

                +'Nuevo mundo delirante,\n'
                +'nuevo mundo sin escapes,\n'
                +'nuevo mundo sin controles,\n'
                +'nuevo mundo ya sin sol.\n\n'

                +'Al nuevo mundo van mis hijos,\n'
                +'los robots, los niños ewoks\n'
                +'nuevo mundo, nuevas pistas,\n'
                +'nuevas grandes utopías.\n\n'

                +'Autor: Fito Pàez\n'
                +'Album: La Ciudad Liberada\n\n'

        sql='INSERT INTO tabla(data)VALUES(\''+unik.encData(data, sqliteUserPass, sqliteKeyPass)+'\')'
        unik.sqlQuery(sql);

         

        var rows = unik.getSqlData('tabla', 'SELECT * FROM tabla', 'sqlite')
        for(var i=0;i<rows.length;i++){
            datos.text= unik.decData(rows[i].col[1], sqliteUserPass, sqliteKeyPass)+'\n\n'
        }

    }
}


Explicación del código

Creamos un elemento QML del tipo Text{} con el id "datos". Este aparecerá centrado en la ventana principal y nos mostrará el nombre obtenido desde la base de datos en la tabla de ejemplo.

Creamos una variable JavaScript del tipo array llamada "rows". Atención! Estamos utilizando un método de unik llamado  getSqlData(). Este método nos devuelve un dato del tipo array de objetos bidimensional. Esto significa que el array "rows" contiene cuál si fuese una grilla o tabla, una clase de matriz de datos. Creamos un bucle "for" para recorrer dicha matriz de datos.

Asignamos un valor a la propiedad "text" del elemento Text{} haciendo referencia al id "datos". El valor que le asignamos son la totalidad de datos que se encuentren en la segunda columna del array o matriz de datos. El rows[i] puede ser rows[0], rows[1], rows[2] ... etc dependiendo de la cantidad de filas que tenga la tabla. El rows[i].col[0] corresponde a la columna "id", El rows[i].col[1] corresponde a la columna "nombre" y el rows[i].col[2] corresponde a la columna "edad".

El Text{} de id "datos" irá mostrando repetidas veces el nombre "Juan" por cada vez que se ejecute la aplicación de este ejemplo.

Paso 7: Ejecutar la aplicación del tutorial en unik

Desde el sistema operativo GNU/Linux, Windows o Macos, hay que ejecutar unik con 2 de los siguientes parámetros:

Explicamos lo que ejecutaremos
unik [param 1=-folder] [param 2=folder location]

Modo de ejecución final de Ejemplo en GNU/Linux
/home/nextsigner/Escritorio/unik.AppImage -folder /home/nextsigner/Escritorio/qml-sqlite

Modo de ejecución final de Ejemplo en Windows
"C:\Program Files (x86)\unik\unik.exe" -folder C:/Users/qt/Desktop/qml-sqlite

Modo de ejecución final de Ejemplo en Macos
/Applications/unik.app/Contents/MacOS/unik -folder /Users/qt/Desktop/qml-sqlite

Mas info: nextsigner@gmail.com

Entrada destacada

Aplicación QtQuick con Unik - Texto a Voz en Windows

Hemos publicado un nuevo video sobre Texto a Voz en Windows mediante la creación de una aplicación del tipo QtQuick con Unik.