Hace exactamente dos años en Singapur, Marko Ahtisaari presentaba al mundo el Nokia N9, quizás el mejor teléfono desarrollado por Nokia, todo, desde el diseño de su hardware, como el software eran innovadores, el N9 es uno de esos pocos dispositivos que logran que el hardware y el software se complementen tan bien, que es imposible pensar que pueda existir el uno sin el otro, lamentablemente el que tendría que haber sido el dispositivo que marcaría el futuro de Nokia, nació muerto y sus restos terminaron siendo canibalizados por la misma Nokia y por muchos de sus competidores, ciertos aspectos del hardware fueron usados para la serie Lumia y muchas de las ideas y conceptos del diseño de la UI/UX acabaron en los Asha, BB10 y SalifishOS, un destino un poco triste para un teléfono que tenia todo para encaminar nuevamente a Nokia en el sendero del crecimiento, afortunadamente la herencia del N9 sigue vigente hoy, y el tiempo esta comenzado a demostrarle a Stephen Elop (al que ya le queda poco tiempo en Nokia) lo falto de visión y cobarde que fue.

ZXing es una biblioteca open source para el procesamiento de códigos de barras, la biblioteca ha sido ampliamente portada a varias plataformas, en Qt podemos usar QZXing, la cual se integra fácilmente en Symbian y Harmattan.

En este ejemplo vamos a crear un pequeño lector de codigos QR, pero QZXing es capaz de procesar muchos otros formatos de codigos de barras, como por ejemplo Data Matrix (V1.1), Aztec Code (V1.2), UPC_E, UPC_A, EAN_8, EAN_13, CODE_128, CODE_39 e ITF entre otros.

Para comenzar, hay que bajar y agregar QZXing en nuestro proyecto, para ello solo debemos crear una carpeta QZXing en la raiz del proyecto y copiar dentro de ella todos los archivos que conforman QZXing.

Luego la incluiremos en nuestro proyecto agregando la siguiente linea en el archivo .pro.

include(QZXing/QZXing.pri)

A continuación declararemos la headers de QZXing en el archivo main.cpp.

#include 
#include "qmlapplicationviewer.h"

#include 

Q_DECL_EXPORT int main(int argc, char *argv[])
{
    QZXing::registerQMLTypes();

    QScopedPointer app(createApplication(argc, argv));

    QmlApplicationViewer viewer;
    viewer.setOrientation(QmlApplicationViewer::ScreenOrientationAuto);
    viewer.setMainQmlFile(QLatin1String("qml/qrcodereader/main.qml"));
    viewer.showExpanded();

    return app->exec();
}

Lo bueno de QZXing es que se integra fácilmente con QML, el primer paso es crear los imports a QtMultimediaKit y QZXing, luego crearemos un objeto QZXing que sera el encargado de leer la imagen (imageToDecode) que el elemento Camera tomara cuando presionemos el botón Scan.

Como verán usar e integrar QZXing en un proyecto Harmattan es muy simple, yo no lo he probado en Symbian, pero su integración y uso es similar, lo único que no me ha gustado es como ha quedado el posicionamiento del elemento Camera, primero tuve que usar posicionamiento absoluto en vez de relativo, ya que el elemento Camera no se lleva bien con los anchors, segundo, tuve que aplicar una rotación de 90° ya que el elemento Camera se inicializa en modo landscape y como no encontré ninguna forma de ponerlo en modo retrato decidí usar la rotación.

import QtQuick 1.1
import com.nokia.meego 1.0
import QtMultimediaKit 1.1
import QZXing 1.2

Page {
    id: mainPage
    orientationLock: PageOrientation.LockPortrait
    tools: commonTools

    Rectangle {
        id:header
        width:parent.width
        height: 72
        z:10
        color:"#002c78"
        Text {
            id:title
            text: "QZXing"
            anchors.left: parent.left
            anchors.leftMargin: 8
            anchors.verticalCenter: parent.verticalCenter
            color:"#fff"
            font.pixelSize: 32
            font.weight: Font.Normal
            font.family: "Nokia Pure Text"
            lineHeightMode: Text.FixedHeight
            lineHeight: font.pixelSize * 1.1
        }
    }

    QZXing {
        id: decoder
        onDecodingStarted: console.log("decoding ...")
        onTagFound: capturedText.text = tag
        onDecodingFinished: console.log("decoding finished " + (succeeded===true ? "successfully" : "unsuccessfully") )
    }

    Camera {
        id: camera
        x: -80
        y: -32
        rotation: 90
        width:640
        height: 640
        focus: visible
        captureResolution : "1024x768"
        onImageCaptured : {
            imageToDecode.source = preview
            decoder.decodeImageQML(imageToDecode);
        }
    }

    Image{
        id: imageToDecode
        height: 360
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.top: header.bottom
        anchors.topMargin: 0
        visible: false
    }

    Label {
        id:capturedText
        anchors.bottom: scanButton.top
        anchors.bottomMargin: 8
        anchors.horizontalCenter: parent.horizontalCenter
        font.pixelSize: 24
        font.weight: Font.Normal
        font.family: "Nokia Pure Text"
        color:"#333"
    }

    Button {
        id:scanButton
        text: "Scan"
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 16
        anchors.horizontalCenter: parent.horizontalCenter
        onClicked: {
            camera.captureImage();
        }
    }
}

Para finalizar una imagen del ejemplo funcionando.

Días atrás, en el marco de la Copenhagen Design Week, Marko Ahtisaari (@moia) presento una versión mas evolucionada de la charla que tuvo con Loïc Le Meur en LeWeb 2011, recuerdo que mientras veía esa presentación trataba de imaginar cuales eran esos patterns de los que hablaba y como iban a aplicarlos, con los pequeños indicios y metáforas que usaba para explicarlos.

Pasaron los meses, se presento el N9 y se puedo ver como todo este trabajo conceptual, se hacia realidad, y eso es lo bueno de esta presentación, ya que ahora Marko no tiene la limitación de la confidencialidad que debía guardar en LeWeb 2011, aquí habla con soltura, exponiendo los problemas que querían de resolver, las soluciones a las que llegaron y el porque de estas decisiones de diseño.

Marko Ahtisaari’s speech about ‘Patterns of Human Interaction’ at Copenhagen Design Week from Nokia Danmark on Vimeo.