Home · All Classes · Grouped Classes · Annotated · Functions

Theming

Introduction

Qtopia 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:

for detailed information.

In addition to simple vector content, themes can conditionally contain rich QWidget content. The Qtopia 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:

ComponentDescription
Title BarContains elements that require defined positions including:
  • Battery level
  • Signal level
  • Window caption
  • Time
  • Status indicators:
    • Roaming
    • Messages
    • Call active
Home/Call ScreenDisplays 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 DecorationsRefer 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
    make;make cleaninstall

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 .pro, .conf, .xml and image files that define the theme
  3. run make;make cleaninstall to install the theme.

Installing a new theme also requires the following files:

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


Copyright © 2008 Nokia Trademarks
Qtopia 4.3.3