jump to navigation

Easier ways to scalable user interfaces October 16, 2006

Posted by Florian in GPE, Maemo, Source.
4 comments

When GPE was started one of the intentions was to develop ways to create flexible user interfaces that work on small screens, in portrait and landscape mode as well like on large PC screens. The situation now is even more complex - we have PDAs, web pads, UMPCs, cellphones and several less common devices all providing different displays with different constraints for user interfaces. We even have several software environments applications run in such as Gnome, GPE and Maemo. If we want to run some application on multiple devices with very different screen sizes or in multiple software environments we currently end up in bloated code which is hard to maintain or in forks / branches that are usually not maintained in the same way like the upstream software.

An example: GPE-Contacts on three different devices:

1. PC with Gnome environment


2. Handheld device running GPE


3. Nokia 770 with Maemo

 

In this application the Gnome/GTK or Hildon UI selection is a build time switch while multiple screen geometries are handled by the application itself at runtime.

So what can we do to make it easier to provide software for GPE, Maemo, Gnome and similar platforms with all their different constraints?

Even looking different and targeting different devices the user interfaces share some common elements. A selection from toolbars, menus and containers are used on all these environments but their look, order or configuration is different. The Hildon API on top of GTK contains some good ideas to set up the basic application window layout: You create a HildonWindow object and add toolbar(s) and menu to it. The implementation of HildonWindow decides where to place these and how they are configured.

The current Hildon API is quite simple and contains a few functions to add particular widgets:

void hildon_window_set_menu (HildonWindow *self, GtkMenu *menu);
void hildon_window_add_toolbar (HildonWindow *self, GtkToolbar *toolbar);
void hildon_window_add_with_scrollbar (HildonWindow *self, GtkWidget *child);

The Hildon implementation of this API is a simple object, but it could be done as an abstract interface with multiple platform specific implementations. These will take care about the correct packing and displaying of some user interface objects. This means that we use the same API to add menus, toolbars and maybe some other components to the user interface using different implementations of this API on different devices.

This makes the design of the basic window layout much easier for the application developers and ensures a consistent look. Of course there is usually much more to do to make applications work with various screen geometries, but for the layout of the remaining user interface components it is possible to write a set of tools to make it easier for the application developers to do the window layout. Some functions to determine geometry parameters such as screen size, display resolution or screen orientation can be used to create geometry-aware user interfaces. Some kind “intelligent” container that changes the packing of its contents depending on the display geometry would be an interesting challenge as well.

We can not create a framework to create applications for arbitary devices, but we can take a hand of the developers and give them tools to create easy to scale applications which are useful on multiple devices and easy to port to new platforms.