jump to navigation

Easier ways to scalable user interfaces October 16, 2006

Posted by Florian in GPE, Maemo, Source.

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.



1. Philip Van Hoof - October 16, 2006

We need more florians too

2. Mark Howard - October 16, 2006

This is just what needs to be considered in the designs for the next major release of gtk/gnome.
One interesting point in your first two screenshots is that the contacts list and details pane are either vertical or horizontal depending on the relative screen dimensions. This is present in swt/eclipse and is a really useful feature – when you resize a docked pane, the sub-panes will automatically swap locations to give the best result. Difficult to describe, but an excellent feature. It would be really nice if this type of behaviour could be automatic rather than platform-dependent as (I think) you’re suggesting hildon is.
I hope you don’t mind me adding a link to this blog entry on gnome live wiki. This should definitely be considered for topaz (and is much more useful and workable than many of the other ‘ideas’ on that section of the gnome site).

3. Rui - October 16, 2006

“We can not create a framework to create applications for arbitary devices”

Well, no one had done the coding, but there are ideas about it:


4. Kalle Vahlman - October 17, 2006

This would rock for free software where “work everywhere” is a value.

This would suck for commercial stuff where “looking anything like the other guy” is unthinkable.

Or at least that’s the impression I’ve gotten from working in the industry…

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: