January 21, 2021
Hot Topics:

Introducing a Lightweight UI Toolkit: Bringing Desktop Development into Java ME

  • By Ibon Urrutia
  • Send Email »
  • More Articles »

Sun Microsystems announced LWUIT at the last JavaOne Conference. It is an advanced user interface library, a feature much desired by JavaME developers. With LWUIT [1], you can develop powerful interfaces avoiding lcdui Form's constrains and without reinventing the wheel. In this series of articles, you are going to develop a simple but complete application to show weather forecasts (reading a RSS from Yahoo! Weather [2]), showing different capabilities from this library. Although it is still too soon to consider it stable, the source code isn't published yet, and there aren't too many devices "officially" tested (although it is in fact very portable between devices), LWUIT is one of the most important innovations in the JavaME world.

First of all, I will suppose that you've had some experience with JavaME in the rest of these articles, and also a very little knowledge of Swing would be useful but it is not necessary. If you want a good introduction to JavaME, you have a series of articles [5], and to learn to develop JavaME applications, you can read this [7] great series of articles on developer.com.

What Is the Problem with JavaME?

This section is interesting only for programmers who never have developed a JavaME application, because every JavaME developer has encountered the same pitfalls when trying to make an appealing user interface. When Connected Limited Device Configuration was designed (the first JCP standards are from 2000), devices were really limited: a small number of colors, low resolutions, processing abilities. So, device limitations imposed the design and implementation of MIDP's lcdui package, which group all classes used for graphic user interfaces, in many ways:

  • No control over general appearance: A device's MIDP implementation has absolute control over it.
  • No Layouts, or speaking properly, only one: the vertical box layout.
  • No advanced custom Widgets: MIDP2.0 introduced CustomItem class, but it was so limited that majority of real developments preferred to use Canvas class directly.
  • No Animations
  • You have only Canvas (in full screen mode starting with MIDP 2.0) and your skills if you want advanced features: and this is not good if "creating a new GUI components library for JavaME" is not the objective of your project.

But, after many years, Sun surprised JavaME developers around the world, presenting at 2008 JavaOne an internal project: LWUIT. The aim of this project is to bring the Swing/AWT programming paradigm to JavaME, to avoid fragmentation and to provide advanced UI functionality.

Introducing the API

To solve some of the problems of lcdui, LWUIT adopts a model similar to AWT, which uses a Composite Pattern [8], adapting it to existing limitations in mobile phones. Everything is a Component, and a Container is a Component that can hold other Components. By using nested containers, you can create a complex user interface.

Figure 1: Simplified Component hierarchy

Another interesting feature introduced by LWUIT is that components own Style objects, where you can change font, color, padding, and margin (a box-model very similar to CSS), and transparency. It also allows you to create Themes, a Java properties file that defines Component styles in your application. By using themes and styles, that can be changed at runtime, it is very easy to change the complete appearance of your application.

As an user interface API, LWUIT abstracts only lcdui classes; you can't access Canvas (if you were thinking of doing it to combine a component UI and some low-level painted screens). It was created that way to avoid device implementation fragmentation and also to generalize the API to be usable in another environments (like CDC, available in some smart phones and PDA's).

I'm not going to start a exhaustive list of all Components (all of us are programmers and know what a javadoc is); I always think that an example of programming is better than thousands of lines of theory, so let me start with a simple application that uses LWUIT.

Introducing LWUIT: Weather Application

You are going to develop a very simple application that connects to Yahoo Weather Service [2], parses received RSS, and shows the weather forecast in a beautiful way. Along your way, you are going to start with a very poor (and boring) MIDlet and you will add additional features of LWUIT showing some of the most important capabilities of the library. In this article, you are going to work with only two screens: a first main menu with two buttons, and a result page for showing weather forecasts.

You have information about Yahoo's RSS weather on [3]. To parse that RSS, you will use KXML [6], the Swiss army knife for parsing XML on mobile phones thanks to its small size (10Kb) and memory footprint. At the end of the article, you can find a download link of a Netbeans project with all the source of this application; you will need Netbeans 6.1 with Mobility support installed.

Page 1 of 7

This article was originally published on July 17, 2008

Enterprise Development Update

Don't miss an article. Subscribe to our newsletter below.

Thanks for your registration, follow us on our social networks to keep up-to-date