[edit] QML on N900

[edit] Introduction

QML is the latest experimental feature based on Qt 4.6. If you don't know QML yet, probably you would like to look at demo here.

It's a Javascript like language and allow you to build your own application rapidly. And yes, you don't need to really care about your development platform too much. All you need to do is using QmlViewer to examine your code. That's pretty much the same when you run on the device (though might be slightly different because of resolution and performance. And note that currently it's still highly experimental!)

A small example on QML use QML-EnhancedCalcExample

[edit] QtScript

Qt Script 4.6

Tutorial on Qt Scripting

[edit] Binary Package

Binary package is available on extras-devel now:

  • libqt4-maemo5-declarative: The QtDeclarative library
  • libqt4-maemo5-declarative-dev: The development package, contains the headers for QtDeclarative
  • libqt4-maemo5-declarative-dbg: The debugging symbols, for more meaningful backtraces
  • qt4-maemo5-declarative-qmlviewer: The “player” for QML based apps
  • qt4-maemo5-samegame: The SameGame demo

To install qt4-maemo5-samegame example, simple type the command within your console with root permission: apt-get install qt4-maemo5-samegame

[edit] Building Qt 4.6 with QML

To build Qt with QML support on N900, you need a 32-bit Linux box (better choice is Ubuntu, I am using Karmic, but you can use other versions as well).

I assumed you already have Maemo SDK running (also Nokia closed binary with SGX). Now it's time to download Qt-declarative UI branch.

Once you unpack it within your scratchbox, say ~/qt-kinetic, create a build directory anywhere you like, e.g.: ~/qt-build, then do the following within scratchbox:

  1. Execute export PKG_CONFIG_PATH=/usr/lib/pkgconfig; export PKG_CONFIG_SYSROOT=/
  2. Edit ~/qt-kinetic/mkspecs/common/g++.conf, and remove -fvisibility=hidden -fvisibility-inlines-hidden, otherwise qemu would crash during compiling.
  3. Configure Qt with ~/qt-kinetic/configure -platform linux-g++ -release -opengl es -webkit -force-pkg-config --prefix=/opt/qt
  4. make
  5. make install

It will take a whole day to compile this sexy devil. Make sure you have brewed the coffee. In case of running into linking problem (or you have trouble to pass EGL test), please try export SUBLIBS='-lX11 -lXau -lEGL -lGLESv2 ...', throwing whatever GCC complains what's missing (I left my laptop in the office, forgive me I am typing this in my plain memory).

Now, you should have the Qt 4.6 DUI binary sitting in your scratchbox. You can either copy those binaries under /opt/qt to your device or mount it as NFS.

[edit] Test Run on Device

On this stage, you should be able to write your first QML application.

#include <QtGui/QApplication>
#include <QmlView>
#include <QUrl>
#include <QGLWidget>

int main(int argc, char *argv[])
    QApplication a(argc, argv);

    QmlView *canvas = new QmlView;
    QGLFormat format = QGLFormat::defaultFormat();
    QGLWidget *glWidget = new QGLWidget(format); // make QmlView use OpenGL ES2 backend.
    canvas->setUrl(QUrl::fromLocalFile("/home/user/demos/declarative/flickr/flickr-desktop.qml")); // wherever your qml file is.

    return a.exec();

Then you will see the program running as same as this demo.

Some screenshots running on N900:

[edit] Conclusion

Finally, here are some few notices / limitation of current Qt4.6-QML:

  • Performance is not that great yet. You may suffer some tearing issues. Write your Qt app in full screen mode will give you some boost. Another alternative is turning off hildon-desktop (gives you 40-50 fps on the device):
$ dsmetool -k /usr/bin/hildon-desktop

To turn back on:

$ dsmetool -t /usr/bin/hildon-desktop
  • On PR1.1 and onwards all fullscreen applications are automatically non-composited, so no trickery like the above is needed on N900 once that drops to end users devices.
  • Document is bundle inside the source tree. Execute the following command will generate proper document for you:
$ make docs
  • -webkit may crash your qmlviewer under N900 if you wish to try. That's why I wrote the code with QmlView binding. If you want to play with qmlviewer, please remove -webkit from your configuration.
  • All credits go to Qt team. Thanks for their help on technical support. If you have any questions / comments, please don't hesitate to visit QML Team and give response.
  • Happy hacking!

[edit] External Link

Retrieved from "http://wiki.maemo.org/QML"