Getting started with QtWRT

Recently announced Qt Web Runtime (QtWRT) is a perfect opportunity to energize masses of people out there in the wild with at least bare html/css/javascript awareness to become application developers for their Maemo and probably future MeeGo devices. However, since QtWRT is still pretty much in pre-alpha stage, it has been thrown at us with no proper documentation (not counting few external W3C references), so early adopters might scratch their head upon simple "Hello World" tutorial that would kick-start the general idea behind Web Runtime.

Actually, creating Maemo apps executed by QtWRT is dead simple, to the point where I was asking myself "is it really just that?".

Installing sample HelloWRT application

For sole purpose of this tutorial, I've crafted a simple WRT widget (application) which displays basic "Hello World"-style greeting and additionally reads N900's internal accelerometer. Here are the steps to install it:

1. Firstly, install qtwrt-experimental package from extras-devel and reboot the device.
2. Then download hellowrt.wgt file and put it to N900's memory - preferably somewhere accessible by File Manager (/MyDocs).
3. Using File Manager directly on N900, go to directory where hellowrt.wgt is stored and "open" this file - this should bring up Application Manager asking for permission to install HelloWRT application.
4. Once App Manager is finished, look out for new HelloWRT app in applications menu and launch it. You should see greeting and some accelerometer readings. Cool, huh?

Reverse engineering

This example widget seems very simple outside, yet it's even simpler inside! To see the full source, change hellowrt.wgt filename to hellowrt.zip and extract it (it's plain zip file), which should reveal three files. Being html/css/javascript literate, purpose of hellowrt.html and hellowrt.js files should be clear - it's just a bit of very simple html and javascript, with the latter making references to internal API (I'll come back to this in a minute). The only file that might be confusing is config.xml. This file is a widget definition, so WRT reads it to know which of html files should be launched first, what the widget is called (ergo: what you see in Application Manager as installed app) etc. Important thing is that config.xml file should always be in root of .zip/wrt file.

So having exploded HelloWRT sample app into pieces, it becomes quite clear that creating WRT-based apps is really just about crafting html files, linking them with some css/javascript if you feel like, creating widget spec in config.xml file and zipping it all up into .wgt file! At the end, you get Application Manager to install it same way as native application.

Direct widget development

WRT widgets are installed by Application Manager to /usr/share/wrt/data directory in N900's main memory. Knowing that and having SSH connection to N900 from desktop machine, makes further development of widget directly on device uber-easy.

Internal APIs

Of course, there's much more fun than just creating html/css/javascript webpages and make them pretend to be native Maemo apps. QtWRT includes javascript APIs to access various device capabilities - like sensors in example above, which returned accelerometer readings. Unfortunately, at the moment of writing this post, there is virtually no official documentation for those APIs - yet it is under construction, apparently - so either try to figure out something from W3C documents (hint: sysinfo API works as described by W3C), or read js API source code.

Conclusion

Generally speaking, however QtWRT is still quite far from being complete and production-ready, it does open an interesting alternative in application development for Maemo/MeeGo/Symbian (?) devices in future. Although using pure html/css/js encapsulated in WRT and WebKit will never totally replace native C++/Python development for "serious" tasks, QtWRT still gives a good opportunity to create interesting apps quickly with little learning curve. I am certainly looking forward to see how QtWRT evolves, so one day I could deploy my webapps just as any other native app.

Further reading

• http://download.qt.nokia.com/qtwrt/ - QtWRT sources, including js API and two example widgets.
• http://dkothari.blogspot.com/2010/08/qt-web-runtime-for-n900.html - Devesh Kothari's blog post explaining QtWRT and referencing some W3C specs.
• http://labs.trolltech.com/blogs/2010/07/19/the-qt-web-runtime-journey-begins/ - as above, but from Ashraf Alkarmi.
• http://www.w3.org/2009/dap/ - Device API by W3C, helps figure out which device capabilities are accessible via WRT (look particularly at Inputs section).
• http://dev.w3.org/2006/waf/widgets/ - widgets packaging and configuration, helps understand various config options used in config.xml file.
• http://developer.qt.nokia.com/forums/viewforum/20 - Qt dev forum section dedicated to QtWRT.