Introduction to S60 UI
Components
S60
platform
Version 1.0
May 8, 2006
Introduction to S60 UI Components | 2
Legal notice
Copyright © 2006 Nokia Corporation. All rights reserved.
Nokia and Nokia Connecting People are registered trademarks of Nokia Corporation.
Java and all Java-based marks are trademarks or registered trademarks of Sun
Microsystems, Inc. Other product and company names mentioned herein may be
trademarks or trade names of their respective owners.
Disclaimer
The information in this document is provided “as is,” with no warranties whatsoever,
including any warranty of merchantability, fitness for any particular purpose, or any
warranty otherwise arising out of any proposal, specification, or sample. Furthermore,
information provided in this document is preliminary, and may be changed substantially
prior to final release. This document is provided for informational purposes only.
Nokia Corporation disclaims all liability, including liability for infringement of any
proprietary rights, relating to implementation of information presented in this document.
Nokia Corporation does not warrant or represent that such use will not infringe such
rights.
Nokia Corporation retains the right to make changes to this specification at any time,
without notice.
License
A license is hereby granted to download and print a copy of this specification for
personal use only. No other license to any other intellectual property rights is granted
herein.
Version 1.0 | May 8, 2006
Introduction to S60 UI Components | 3
Contents
1. Introduction ......................................................................................................... 5
2. Lists ...................................................................................................................... 7
3. Forms ................................................................................................................. 10
4. Setting lists ........................................................................................................ 11
5. Grids ................................................................................................................... 14
6. Notifications and queries ................................................................................. 16
7. Themes............................................................................................................... 21
8. Viewers and editors .......................................................................................... 23
9. Customizing standard UI components............................................................ 24
10. References ......................................................................................................... 25
10.1 Further reading..............................................................................................................25
11. Evaluate this resource ...................................................................................... 26
Version 1.0 | May 8, 2006
Introduction to S60 UI Components | 4
Change history
May 8, 2006 Version 1.0 Initial document release
Version 1.0 | May 8, 2006
Introduction to S60 UI Components | 5
1. Introduction
Designing a great user interface for an S60 application can be a challenge. Among the
variables that need to be addressed are how intuitive or learnable is the interface, is it
pleasing to the eye of the end user, and does it fit well into the device for which it has
been designed? Obviously the life of an application designer is considerably easier if the
UI design process goes smoothly and efficiently and the application reaches the market
as quickly as possible.
The S60 platform offers solutions for UI design challenges thanks to a variety of different
graphical UI components designed especially for S60 applications. These UI
components form the backbone of S60 application UI design, and they come in many
different shapes and sizes. This document introduces the most useful S60 UI
components and shows how flexibly they can be used in any application UI. Examples
used throughout are based on the S60 3rd Edition. Note that this document is mainly
targeted for designers. For C++ programmers there is a separate set of documents,
S60
Platform: Avkon UI Resources [4], that explains the actual implementation of the UI
components with code snippets.
Some of the most obvious benefits of using S60 components in an application include:
Saving resources, time, and money. Rather than reinventing the wheel,
designers can utilize existing UI components and focus their efforts on other
tasks.
Reliability. S60 UI components have undergone rigorous usability
evaluations and end-user tests. More usability resources have been devoted
to user testing S60 components than the average mobile application
development project. Developers who use ready-made S60 UI components
needn't worry about component-level usability issues.
Ease and familiarity. An application will fit in more naturally with its S60
environment if S60 UI components are used. Users will instantly recognize
components and know how to interact with them; it is far easier for users to
accept applications that have a familiar look and feel.
Adaptability. S60 UI components have been built
so that they are automatically scaled to fit the
display. In other words, S60 components will adapt
to the different resolutions and display sizes
supported by the S60 platform. These components
also adapt to both portrait and landscape UI styles.
Localization. Common components adhere to local device settings and
localization rules, such as input language selection, language-specific
alphabetical order, date, and time formats.
Personalization. S60 UI components reflect the UI
theme of the S60 device. This means that the
user’s choices for personalization will be continued
in all applications that use S60 UI components.
Using ready-made components helps an
application look and feel at home in the S60
device.
Future applicability. S60 components have been built to last and are updated
for each release so they can be relied upon to function properly with each
Version 1.0 | May 8, 2006
