In the last two blog posts (1, 2) about qooxdoo touch support, we showed how regular qooxdoo Rich Internet Applications could continue to run on iOS and Android devices.
However, typical qooxdoo applications built with the desktop-oriented GUI toolkit are not a perfect match. Usually they are too heavyweight for slower devices like mobile phones (well, even that such devices can also be considerably fast, see the newest iOS and newest Android devices). Another important downside is that those traditional RIAs just do not feel like mobile applications. For instance, mobile applications present their data on pages, have rather minimalistic designs and layouts (e.g. header, list/content, footer), have a restricted workflow, use animated transitions between pages, and so on.
So for quite a while now we have been asking ourselves some questions: Why shouldn’t it be possible to develop mobile applications with qooxdoo? The framework itself is quite universal, already covering browser-based applications from web (both RIAs and low-level) to desktop. Which specific functionality is missing in the framework to also create genuine apps for mobile devices, so that they behave just like native applications?
As the result of an evaluation, we created a prototype that runs on iOS and Android devices, with the look and feel of a native iOS application. This proof-of-concept is a simple feed reader application which shows the qooxdoo news in a scrollable list and displays the full article when you click on a list entry. But a picture of the prototype running on iOS and Android might be worth a thousand words:
Right now the prototype already has the following features:
- Basic page flow navigation, incl. animation support for page transitions
- Bookmarking support: Navigation stored in the URL
- Special link handling
- Automatic size and orientation handling
- Scrolling support via iScroll
- CSS for application styling
As you see here on the next two screens, you can’t really tell the difference to a native iOS application:
The great thing is: We were amazed how much business logic we could reuse from our existing feed reader application. Based on qooxdoo’s data binding feature, all feed entries were retrieved by YQL, using the qx.data.store.Yql data store. It took about 15 min to extract this code from the existing feedreader RIA and reuse it in the mobile app.
And isn’t this exactly what you want to do, when you develop a mobile application: Take your qooxdoo RIA application and reuse as much code as possible for your mobile application.
We are going to continue with polishing the prototype in the next few weeks, also be working on the mobile enhancements of qooxdoo. We currently don’t expect qooxdoo mobile to necessarily become a standalone framework, instead it will rather be an extension of the existing universal qooxdoo framework itself. By doing so, you might be able to use the full power of the qooxdoo tool chain, OO, Properties, BOM abstraction, IO, data binding and other convenient features provided by the framework.
So what is the plan?
- Support for mobile WebKit browsers (iOS, Android, …)
- HTML 5 Support (e.g. offline capability)
- CSS3 animations for smooth page transitions
- Support of CSS3 Flexible Box Layout
- Page-oriented applications that allow a certain workflow much like native applications
- Lightweight widgets for mobile development
- qooxdoo programming patterns for application development
- Integration / abstraction of your favorite scrolling area (iScroll / TouchScroll / others), to solve the missing “position:fixed” attribute (likely to be fixed in future mobile browsers).
- PhoneGap support. PhoneGap allows you to pack your qooxdoo application into an installable package for a corresponding device, i.e. into a native app. This allows you to publish your application in one of the various app stores.
If you want to test the prototype on your iOS / Android phone, just follow the link to the prototype. Right now this is a build version for public testing, so no preliminary source code available, yet.
Give it a try and let us know if you would be interested in creating your own mobile apps, just by using qooxdoo as your favorite application framework.



Fantastic! I would hope the qooxdoo brain trust would do something like this. PhoneGap support will make things even more powerful.
Thanks, guys, for all the hard work! Qooxdoo keeps getting better and better.
Aren’t you doing the same thing that Unity framework has done? Maybe we could borrow some code from there, including its property system optimizations
Pingback: qooxdoo » News » The week in qooxdoo (2010-09-24)
Very cute! I added the URL to my bookmarks on the iPhone.
Cheers,
Fritz
Pingback: qooxdoo goes mobile « Matthias Braun
This demo is great. I am an iOS developer, and I am learning qooxdoo framework right now. I had read the mobile twitter tutorial, I think that’s a good tutorial for getting started. However, when I want to dig into some details of qooxdoo, I think there is just not enough reference. For example, I want more tutorial about how to custom the UI of mobile widgets, or the layout of mobile page. So I would appreciate that more open source apps with qooxdoo framework are published, for instance, the project of this protype.
Thank you! I am qooxdoo’s big fan.
Hi Phineas, great to hear that you – as an iOS developer – enjoy qooxdoo for creating mobile apps.
The early app prototype of this blog post has been superseded by other demo apps. See the mobile apps (live and code) at http://qooxdoo.org/demos#mobile : The mobile feedreader rather is a prototype follow-up, while the mobile showcase aggregates many, also the very latest features of the mobile framework.
Other than that, make sure to read the mobile section in the manual, check out the API viewer or even dig into the mobile framework code whenever appropriate. Given the ongoing progress in the mobile framework, also try the “devel” versions for the upcoming releases. Last but not least, don’t hesitate to get in touch with the community via the mailing list. C U.