Theming

Introduction

Qt Extended has a powerful theming engine, allowing much of the user interface to be customized and personalized.

Components of the user interface such as Title Bar, Home Screen, Call Screen, Context Bar use Themed Views to facilitate customization.

These are defined by XML files describing a hierarchical group of visual and formatting elements. Themed Views contain theme elements which define the layout and structure of components. Each of these elements is assigned attributes to customize visual appearance and placement.

Refer to:

• Themed Views
• Themed View Elements
• Known Elements
• Graphic Designer's Reference

for detailed information.

In addition to simple vector content, themes can conditionally contain rich QWidget content. The Qt Extended home screen has been enabled in this way, and widgets can be added using the HomeScreenWidgets class.

It is also possible to provide color schemes and custom icons with a theme.

Theming code examples are available on the: Tutorials page.

Creating a Theme

The main components required to create a theme are:

• Title Bar
• Home/Call Screen
• Context Bar
• Window Decorations

Component	Description
Title Bar	Contains elements that require defined positions including: Battery level Signal level Window caption Time Status indicators: Roaming Messages Call active
Home/Call Screen	Displays commonly accessed information such as: Background - default or custom background Number of missed calls Number of new messages Time and date Operator name Profile Information box Dialer button for touchscreen mode PIN entry pad for touchscreen mode Status indicators: Alarm Lock Call divert Roaming Messages Call active
Context Bar	Rectangular area at the bottom of the screen Usually contains three buttons corresponding to context buttons on the keypad. Displays as either text or icons.
Window Decorations	Refer to: Window Decoration Tutorial

Widget style and icons can help to complete the effect, however since these are far more time consuming to produce it is common to use those provided by an existing theme.

Code examples are available at: Theming Tutorials.

Installing an Updated Theme

To install a modified theme run :

    cd $QPEDIR
    bin/qbuild image

Installing a New Theme

To install a new theme follow these steps :

1. modify $QPEDIR/src/custom.pri to have an additional THEME_PROJECT entry that states the theme directory.
2. create the qbuild.pro, .conf, .xml and image files that define the theme
3. run bin/qbuild image to install the theme.

Installing a new theme also requires the following files:

File	Location	Description
Theme Project File	$QPEDIR/etc/themes/	defines the files to be installed for the theme.
Theme Configuration File	$QPEDIR/etc/themes/	defines the theme.