Skin Author's Guide to Adaptive User Interface Technology

Customizing the Java Wireless Client software default skin to match your own native look and feel is a multi-step process. You are ready to regenerate or build your customized skin once the following general steps are complete:

• Created the graphic images for the customized skin
• Put the customized image files into the correct directories for your platform implementation
• Modified the property settings and values in the skin.xml file for the adaptive user interface components you want to customize

Once the previous general steps are completed, your newly customized adaptive user interface can be updated in two ways:

• If your graphic images are not set to be ROMized in the skin.xml file, by running the make run_skinromizer command. For more information, see Updating the skin.bin File.
• If your graphic images are set to be ROMized in the skin.xml file, by rebuilding the full Java Wireless Client software. For more information, see Building the Full Java Wireless Client Software.

Once you have updated your customized skin by generating the skin.bin file or rebuilding the full Java Wireless Client software, the look and feel of the customized skin can be displayed by running any MIDlet in the emulator or on a device.

---

Setting Up Your Build Environment

This section assumes you are a skin designer and not a build engineer. If you regularly build and run the Java Wireless Client software, you can skip this section.

1. Set the JDK_DIR variable to point to the location of your j2sdk1.4.2 software.

For example:

$ export JDK_DIR=/home/j2sdk1.4.2_08

2. Set the QTDIR variable to point to the location of your Trolltech QT graphics toolkit.

For example:

$ export QTDIR=/usr/lib/qt3

3. Set the PATH variable to include the JDK_DIR and QTDIR environment variables. The JDK_DIR variable must be at the front of your PATH, as shown here.

$ export PATH=$JDK_DIR/bin:$PATH:$QTDIR/bin

4. Set the PCSL_OUTPUT_DIR variable to point to the location of your generated PCSL output, as shown here:

$ export PCSL_OUTPUT_DIR=InstallDir/output/pcsl

InstallDir is the location where you have installed the Java Wireless Client software and output/pcsl is the top-level directory you designate for the output of your PCSL software build.

5. Set the CLDC_OUTPUT_DIR variable to point to the location of your generated CLDC output, as shown here:

$ export CLDC_OUTPUT_DIR=InstallDir/output/cldc/dist

InstallDir is the location where you have installed the Java Wireless Client software and output/cldc/dist is the top-level directory you designate for the output of your CLDC software build.

Once your build platform is properly set up, to regenerate the skin.bin file using the make command, see Updating the skin.bin File.

1. Set the JDK_DIR variable to point to the location of your j2sdk1.4.2 software.

For example:

$ export JDK_DIR=/home/j2sdk1.4.2_08

2. Set the QTDIR variable to point to the location of your Trolltech QT graphics toolkit.

For example:

$ export QTDIR=/usr/lib/qt3

3. Set the PATH variable to include the JDK_DIR and QTDIR environment variables. The JDK_DIR variable must be at the front of your PATH, as shown here.

$ export PATH=$JDK_DIR/bin:$PATH:$QTDIR/bin

4. Set the GNU_TOOLS_DIR variable to point to the location of your MontaVista development tools.

For example:

$ export GNU_TOOLS_DIR=/opt/montavista/cee/devkit/arm/v4t_le/armv4tl-hardhat-linux

5. Set the PCSL_OUTPUT_DIR variable to point to the location of your generated PCSL output, as shown here:

$ export PCSL_OUTPUT_DIR=InstallDir/output/pcsl

InstallDir is the location where you install the Java Wireless Client software and output/pcsl is the top-level directory you designate for the output of your PCSL software build.

6. Set the CLDC_OUTPUT_DIR variable to point to the location of your generated CLDC output, as shown here:

$ export CLDC_OUTPUT_DIR=InstallDir/output/cldc/dist

InstallDir is the location where you install the Java Wireless Client software and output/cldc/dist is the top-level directory you designate for the output of your CLDC software build.

Once your build platform is properly set up, to regenerate the skin.bin file using the make command, see Updating the skin.bin File.

1. Use the Start -> Search -> For Files or Folders command to locate the file vcvars32.bat.

2. Launch vcvars32.bat to set environment variables for your Win32 on i386 build platform.

3. Set the JDK_DIR variable to point to the location of your j2sdk1.4.2 software.

For example:

$ set JDK_DIR=C:\j2sdk1.4.2_08

4. Add Cyg4me and JDK_DIR to your PATH.

For example:

$ set PATH=C:\cyg4me\bin;%JDK_DIR%\bin;%PATH%

5. Set the JAVACALL_OUTPUT_DIR environment variable.

For example:

$ set JAVACALL_OUTPUT_DIR=location-of-java-Wireless-Client/javacall/output

6. Set the PCSL_OUTPUT_DIR variable to point to the location of your generated PCSL output, as shown here:

$ set PCSL_OUTPUT_DIR=InstallDir/output/pcsl

InstallDir is the location where you have installed the Java Wireless Client software and output/pcsl is the top-level directory you designate for the output of your PCSL software build.

7. Set the CLDC_OUTPUT_DIR variable to point to the location of your generated CLDC output, as shown here:

$ set CLDC_OUTPUT_DIR=InstallDir/output/cldc/dist

InstallDir is the location where you install the Java Wireless Client software and output/cldc/dist is the top-level directory you designate for the output of your CLDC software build.

Once your build platform is properly set up, to regenerate the skin.bin file using the make command, see Updating the skin.bin File.

---

Updating the skin.bin File

This section assumes you have updated your graphic image content, added or replaced graphic image files, and modified the property settings in the skin.xml or skin_optional.xml file, to prepare for generating your customized skin. If not, do those things first.

1. Change directory to the location of the make file for your platform.

For example, if you are customizing the skin for the Linux platform with QT graphics (linux_qte), change to the following directory:

$ cd InstallDir/midp/build/linux_qte

2. Run the make command, using run_skinromizer as a target, as shown here:

$ make run_skinromizer

This generates the customized skin output file, skin.bin, and writes it to the following directory:

InstallDir/output/midp/lib

InstallDir is the location where you install the Java Wireless Client software and output is the top-level directory you designate for the output of your Java Wireless Client software build.

1. Change directory to the location of the make file for your platform.

For example, if you are customizing the skin for the Linux platform with QT graphics (linux_qte), change to the following directory:

$ cd InstallDir/midp/build/linux_qte

2. Run the make command, using run_skinromizer as a target, and including the three make variables needed for the optional second skin, as shown here:

$ make SUBSYSTEM_CONFIGURATION_SKIN_XML_FILE=InstallDir/midp/src/configuration/configuration_xml/platform/skin_optional.xml SUBSYSTEM_LCDLF_SKIN_RESOURCES_DIR=InstallDir/midp/src/highlevelui/lcdlf/lfjava/resource_optional/skin SUBSYSTEM_LCDLF_SKIN_RESOURCES_DIR=InstallDir/midp/src/highlevelui/lcdlf/lfjava/resource_optional/skin run_skinromizer

This generates the customized skin output file, skin.bin, and writes it to the following directory:

InstallDir/output/midp/lib

InstallDir is the location where you install the Java Wireless Client software and output is the top-level directory you designate for the output of your Java Wireless Client software build.

Using make Variables to Generate the Optional Second Skin

Generating the skin.bin file to display your newly customized optional second skin requires the use of the following three make variables, which are used with the make target, run_skinromizer.

• SUBSYSTEM_CONFIGURATION_SKIN_XML_FILE - Points to the location of your optional second skin_optional.xml file. For example:

SUBSYSTEM_CONFIGURATION_SKIN_XML_FILE=InstallDir/midp/src/
configuration/configuration_xml/platform/skin_optional.xml

• SUBSYSTEM_LCDLF_SKIN_RESOURCES_DIR- Points to the location of your optional second skin graphic images directory. For example:

SUBSYSTEM_LCDLF_SKIN_RESOURCES_DIR=InstallDir/midp/src/
highlevelui/lcdlf/lfjava/resource_optional/skin

• SUBSYSTEM_LCDLF_RESOURCES_DIR - Points to the location of the resource directory for the optional second skin. For example:

SUBSYSTEM_LCDLF_RESOURCES_DIR=InstallDir/midp/src/
highlevelui/lcdlf/lfjava/resource_optional

---

Displaying the Generated Customized Skin

The updated customized skin is not a MIDlet or a single application. It is a set of properties and graphics that define a specific look and feel, which gets applied to every MIDlet that is run in the Java Wireless Client software emulator or on the device.

1. If the Java Wireless Client software emulator is up and running on your system, close it.

2. Change directory to the location of the platform you are skinning for.

For example:

$ cd InstallDir/output/midp/bin/platform

output is the top-level directory you designate for the output of your Java Wireless Client software build and platform is the platform you are skinning for. For example, this could be linux_qte, arm, win32, or some other platform.

3. Depending upon your platform, click or type the following to relaunch the Java Wireless Client software emulator:

$ ./runPhoneME

4. Choose a MIDlet from the list of installed MIDlets displayed in your emulator or enter a URL to display one remotely.

The MIDlet is displayed with the properties and characteristics of your newly customized skin.

---

Building the Full Java Wireless Client Software

Building the full Java Wireless Client software is largely outside the scope of this document. For complete instructions on how to set up your build environment and build the Java Wireless Client software from source, see the Sun Java Wireless Client Build Guide.

Working With ROMized Images

During development of your customized skin, you worked with all image files set to Romized=false for easier graphic development. Once you finish customizing your new skin, you can reset these images to Romized=true if you wish.

Deciding whether to ROMize final graphic images for your customized skin is a decision you make based upon your Java Wireless Client software implementation and the trade-off between loading speed at runtime and memory footprint.

To properly optimize your finished customized skin for the trade-off between speed of image loading and memory footprint size, take one of the following steps before building the full Java Wireless Client software:

• To optimize your customized skin for the fastest loading time, set graphic property elements in the skin.xml file to Romized=true. This includes multi-part composite images as well as single image files.
• To optimize your customized skin for the smallest memory footprint on the device, set graphic property elements in the skin.xml file to Romized=false. This includes multi-part composite images as well as single image files.

For more information on the trade-off between faster image loading through optimized graphics and memory footprint size on your device, see Chapter 2.

Skin Author's Guide to Adaptive User Interface Technology

05-2007

Copyright © 2007, Sun Microsystems, Inc. All rights reserved. SUN PROPRIETARY/CONFIDENTIAL.