Comments, Code and Qt. Some words about the wonderful world of software engineering

21Feb/106

Playing around with QML, Part 1

I have been intrigued by QML ever since I saw the first demos online at Qt Beta Labs. Creating beautiful UIs, fast and with great animations is not easy with the current programming tools at hand. This is arguably the problem Qt is trying to solve with QML. I think they are doing great and this is the way to do UIs in the future, but I found some interesting issues with QML while playing around with it last evening.

So far I have only seen a few demos online of QML and they are mostly from the Qt guys themselves, but last week I saw a demo that Digia presented at MWC in Barcelona done in QML (or Qt Quick as I think it should be now called). Looks nice! If you know of more QML demos that are available online, please let me know. But since there really aren't too much stuff yet done with QML, I decided I need to test it myself. I have already in the past read some documentation and gone through the QML demo applications in the Qt Kinetic source package so now it was time to play with it for myself.

Below is a video of a simple application I did in one evening. Yes - I know it is not much to look at, but hey, I am not a graphics or UI designer :) From the video below you can see that it is easy to play around with data and to create animations for your application. It would have been impossible to do this application in one evening with plain Qt and C++.

The source code is available at http://gitorious.org/qtquicktests/qtquicktests.

But looks can be deceiving. This quite simple application alone gave me some good experience in QML and made me better understand how it works. But I also found some interesting issues (bugs?) in QML and also some things I don't like about it. I should write an other blog post about my findings.

Technorati Tags: , , ,

  • http://chaos.troll.no/~hhartz Henrik Hartz

    Hi Johan,

    Nice post, and cool demo! If you do find bugs, please report them on http://bugreports.qt.nokia.com/ with component “Declarative”. That will help us stabilize it for release later this year :)

    Thanks, and keep the posts coming!

    • kypeli

      Cool, thanks for the comment! I try to have an other post done about the things I noticed so I can elaborate on them in detail.

      Thanks for the link to your bug tracking system. I will submit one thing related to variable usage that I think is an obvious bug.

  • Mattias

    Hi, nice demo! I’m playing around with Qt myself but there’s something that I can’t figure out – care to help?

    I’m instantiating my qml HMI from a widget and now I’d like to connect a signal from the qml HMI to the widget, any idea how to do this?

    Thanks and keep the great examples coming!

    • kypeli

      Nice that you liked it :) Quite simple, but shows what you can do with QML in one evening.

      I would need to play with QML a bit more too and integrate it to widgets, giving data models to QML from C++ and all that. Unfortunately I haven’t had the time yet so I am more novice in QML than you, I am afraid :)

    • http://chaos.troll.no/~hhartz Henrik Hartz

      you need to set the QWiget as a context property on your QML engine. This will make the object with all metaobject features available – so you should be able to create e.g. a Connection {} in QML.

  • Mateu Batle

    Hi Johan,

    nice demo, I’m also looking for qml demos and examples.
    I did this demo of a tetris like game in QML and Javascript in case you are interested

    http://mbatle.wordpress.com/2010/09/30/how-to-mingle-qml-tetrominos-and-ninjas/

    cheers
    Mat