Y llego el día, Nokia anuncio por fin el N9, su primer dispositivo MeeGo compatible(*) enfocado al publico en general, quiero aprovechar este post, no para hacer una review del evento de presentación, ni para hablar de las features del mismo, sino para aclarar algunos aspectos sobre la personalidad del OS y sobre los recursos y herramientas que ya tenemos disponibles para comenzar a desarrollar.

Harmattan?, que es eso?

MeeGo 1.2 Harmattan es la implementación MeeGo de Nokia, es altamente compatible a nivel de APIs y arquitectura, lo que permitirá fácilmente tomar los cambios que se hagan en el upstream de MeeGo he incorporarlos cuando se vayan liberando, Harmattan trae integrado, Qt 4.7.?, Qt Quick Components 1.0, Qt Mobility 1.2.0, Qt Webkit 2.1.1, PulseAudio y GStreamer para crear aplicaciones y plugins que hagan uso de audio y video, Telepathy-Qt4 para aplicaciones que usen vídeo llamadas y mensajería instantánea y por ultimo la Qt Games API para el desarrollo de juegos basados en OpenGL ES 2.0.

N9 & N950

Como dije al principio, el N9 es el primer dispositivo MeeGo de Nokia para el publico en general, en cambio para los desarrolladores se encuentra disponible el N950, el mismo no puede ser comprado directamente, sino que Nokia se encargara de entregarlos usando un criterio que aun no se ha hecho publico, pero que seguramente incluirá a los Forum Nokia Champions, los miembros del programa Launchpad y a contribuyentes destacados de las comunidades MeeGo, Maemo y Qt.

Developer and Design Tools

Apenas terminada la presentación del Nokia N9, fueron liberadas las herramienta necesarias para comenzar a diseñar y desarrollar aplicaciones para el mismo.

Qt SDK 1.1.2 Update for Meego 1.2 Harmattan

Este update incorpora una actualización menor de Qt Creator y el toolchain para crear aplicaciones compatibles con Meego 1.2 Harmattan, el toolchain aun esta en fase experimental y no están completas aun muchas de sus herramientas y características..

Pueden instalar el SDK haciendo una instalación limpia del mismo usando algunos de los siguientes instaladores:

O si ya tienen instalado Qt SDK, pueden actualizarlo utilizando la herramienta SDKMaintenanceTool y seleccionado Harmattan en la sección Experimental

Harmattan UX Guidelines

Se ha habilitado toda una nueva sección en Nokia Developer para hacer lugar a la nuevas Nokia N9 UX Guidelines, la documentación es realmente muy completa, visual e interactiva, tratando de guiarnos en el nuevo paradigma que acompaña la UI del N9, ademas de la documentación en linea, es posible bajar, las guidelines y templates para el diseño de iconos, como así también un toolkit con los graficos de los distintos componentes que forman parte de la UI para ser usados en el prototipado de aplicaciones.

Creo que con estos recursos y estas herramientas tenemos como para entretenernos un buen rato, conociendo y explorando las posibilidades que MeeGo nos puede proveer y como aplicarlas a futuros proyectos.

Mañana 23 de Mayo (14:00 hs. Argentina) comienza en San Francisco la MeeGo Conference 2011, para quienes que como yo no pueden asistir a la misma, existe muchas alternativas para seguir el evento online, a continuación les dejo una lista de las mismas:

• la pagina oficial de la MeeGo Conference 2011
• la agenda de la MeeGo Conference 2011
• live streaming de la conferencia
• @meegocom la cuenta oficial del proyecto MeeGo
• @meegoconference la cuenta oficial del evento
• #meegoconf el hashtag oficial

Ayer y tal como lo marcaba el roadmap ha sido liberada MeeGo 1.2 en su versiones Core, Netbook UX, IVI, Tablet Developer Preview, como así también el SDK, tanto para las arquitecturas Intel Atom y ARMv7

Lo nuevo

Actualización del QML Application Framework y nuevas APIs soportadas por Qt Mobility incluyendo, localización, conectividad, acceso a sensores y soporte haptico.

También se han agregado mejoras en las capacidades de telefonía y conectividad:

• Soporte para GSM, GPRS y HSPA+
• SIM Application Toolkit
• Bluetooth profiles
• USB, WiFi, BT-PAN y capacidad para tethering
• Mejor soporte para multimedia, incluyendo RTSP streaming con download progresivo

Lo que viene

Como verán entre los anuncios no se nombra a la versión Handset UX, todos los esfuerzos de esta versión están puestos en MeeGo 1.2 Developer Edition for N900 de la cual ya se encuentra disponible una Release Candidate y cuya liberación es inminente y posiblemente se haga en el marco de la MeeGo Conference 2011 ha realizarse la semana que viene.

Otro gran ausente es las versión para OS X de SDK, de la cual se planea tenerlo listo para finales de año.

Y por ultimo tenemos a MeeGo 1.3, versión que según el roadmap seria liberada en Octubre de este año, seguramente la próxima semana en la MeeGo Conference 2011 nos enteraremos de las características planeadas a implementar en MeeGo 1.3, por mientras pueden ir viendo en MeeGo Featurezilla algunas de las características aceptadas para ser incorporadas en la próxima versión.

Hace un tiempo escribí sobre lo fácil que es consumir XML con QML, hoy le toca el turno a JSON, consumir JSON con QML requiere un poco mas de trabajo comparado con XML, pero no mucho mas.

Pasemos al código, lo primero que haremos sera crear un archivo data.js que contendrá la lógica que poblara al Model con los datos, para este ejemplo vamos a usar el API de Wikileaks para mostrar un listado con los últimos cables liberados, lo siguiente es agregar el ListModel, el Delegate cuyo código esta al final y no necesita muchos comentarios, el ListView que mostrara los datos y vamos a disparar la función getLatestCables() cuando la view se haya cargado.

main.qml

import QtQuick 1.0
import "data.js" as Data

Rectangle {
    width:360
    height:640

    Component.onCompleted:Data.getLatestCables();

    ListModel {
        id:cablesModel
    }

    CablesDelegate {
        id:cablesDelegate
    }

    Item {
        id:cablesList
        anchors.fill:parent

        ListView {
            model:cablesModel
            delegate:cablesDelegate
            anchors.fill:parent
        }
    }
}

La magia que no es mucha, pasa aquí, esto es simple y puro JavaScript, utilizaremos un XMLHttpRequest para acceder al feed con los datos, luego lo parseamos e iremos agregando uno a uno los datos al Model.

data.js

function getLatestCables(){
    var xhr = new XMLHttpRequest;
    xhr.open("GET", "http://api.leakfeed.com/v1/cables/latest.json");
    xhr.onreadystatechange = function() {
        if (xhr.readyState == XMLHttpRequest.DONE) {
            var a = JSON.parse(xhr.responseText);
            for (var c in a) {
                var i = a[c];
                cablesModel.append({identifier: i.identifier, classification: i.classification, office: i.office, subject: i.subject});
            }
        }
    }
    xhr.send();
}

CablesDelegate.qml

import QtQuick 1.0

Component {

    Rectangle {
        border.color:"#b7b7b7"
        border.width:1
        width:parent.width
        height:cableIdentifier.height + cableOffice.height + cableClass.height + cableSubject.height + 10
        color:"#fff"

        Item {
            width:parent.width
            height:parent.height

            Grid {
                rows:4
                width:parent.width
                anchors.verticalCenter:parent.verticalCenter
                anchors.left:parent.left
                anchors.leftMargin:5
                anchors.right:parent.right
                anchors.rightMargin:5

                Text {
                    id:cableIdentifier
                    text:identifier
                    font.bold:true
                    font.pixelSize:18
                    smooth:true
                    color:"#333"
                }

                Text {
                    id:cableOffice
                    color:"#0076A3"
                    text:office
                    font.pixelSize:18
                    font.bold:true
                    smooth:true
                }

                Text {
                    id:cableClass
                    color:"#aa1317"
                    text:classification
                    font.pixelSize:16
                    font.bold:true
                    smooth:true
                }

                Text {
                    id:cableSubject
                    text:subject
                    font.pixelSize: 14
                    wrapMode:Text.WrapAtWordBoundaryOrAnywhere
                    width:parent.width
                    smooth:true
                    color:"#333"
                }
            }
        }
    }
}

Si todo sale bien, al correr la demo deberíamos obtener como resultado algo parecido a los que se ve en la siguiente imagen.

Qt/3D es un conjunto de herramientas y funciones que permiten crear aplicaciones que hagan uso de gráficos 3D, Qt3D extiende las clases del modulo OpenGL de Qt, estas APIs facilitan escribir código que sea fácil de portar entre aplicaciones de escritorio OpenGL y aplicaciones embebidas o mobile OpenGL/ES, por ultimo pero no menos importante, contamos con un binding para utilizar Qt/3D desde QML.

Para comenzar con Qt/3D lo primero que debemos hacer es instalarlo, los pasos a seguir están muy bien explicados aquí, ya sea en Linux, Windows o Mac OS X, no son complicados, aunque puede tomar algo de tiempo el proceso.

¿Que podemos hacer con Qt/3D y QML?

Con Qt/3D podemos crear viewports, asignar luces y cámaras, crear o importar nuestros propios modelos 3D, ya sea usando las figuras básicas incluidas, creando nuestros propios meshes, o usando algún modelo ya existente en formato 3ds o bzs, también podemos crear animaciones y aplicárselas a los modelos, las cámaras y las luces.

Si han trabajado anteriormente con aplicaciones 3D todos estos términos y conceptos les sonaran familiares, lo que les permitirá reutilizar su conocimiento a la vez de que podrán rápidamente ponerse manos a la obra.

Hello World 3D

El siguiente ejemplo muestra de forma simple, algunos de los conceptos y controles que se usan en la mayoría de la aplicaciones 3D, lo primero es crear los imports correspondientes de Qt/3D, luego sigue el Viewport que define la escena 3D, así como su tamaño, las luces y las cámaras a utilizar y sus posiciones.

Luego tenemos un objeto Sphere que tiene un levelOfDetail de 10 el máximo de su tipo y que mide la cantidad de triángulos necesarios para crear el objeto, en este caso 32768, luego alineamos el objeto al eje Y, para terminar aplicándole una textura usando el elemento Effect.

Para finalizar vamos a animar el objeto 3D, para ello usaremos una Rotation3D, a la cual seteamos el eje que queremos animar y luego en una NumberAnimation establecemos la propiedad a animar, en este caso, angle.

import Qt 4.7
import Qt3D 1.0
import Qt3D.Shapes 1.0

Viewport {
    width: 640
    height: 360
    camera: Camera {
        eye: Qt.vector3d(0,0,8)
    }
    Sphere {
        levelOfDetail: 10
        axis: Qt.YAxis
        effect: Effect {
            texture: "images/land_ocean_ice_2048.jpg"
            decal: true
        }
        transform:[
            Rotation3D {
                axis: Qt.vector3d(0,1,0)
                NumberAnimation on angle {
                    running: true
                    loops: Animation.Infinite
                    from: 360
                    to: 0
                    duration: 6000
                }
            }
        ]
    }
}

Con este simple ejemplo pueden darse una idea del poder que nos brinda la combinación Qt/3D y QML, si están interesados en el tema, pueden profundizar mas en el dando un vistazo a la documentación oficial, o ver un repaso rápido de las principales características en la presentación dada por Sarah Smith en los Qt Developers Days 2010.