QT for mobile

7/30/2019 QT for mobile

1/204

1

Qt for Mobile

Tuukka Ahoniemi

Technical Trainer

Digia Plc


2/204

2Qt for Mobile

?

Thats where me and ~1499 other computerish professionals work

G lobal, based in F inland

~50 % work with mobile technologies A large, traditional S ymbian house

S ince day 1, heavily involved with Q t on mobile devices

Qt Training Partner

http://www.digia.com


3/204

3Qt for Mobile

Objectives 1/2

To get a really good overview on

What is Qt development especially on mobile platforms

Q tMobility APIs

Howdo you work with the new Nokia N8

To go technical enough

To actually be able to start doing something meaningful after the course!

Qt is C ++, so prior C ++ knowledge is required

If you have any questions at any point, please do not hesitate to ask!

For more information:

http://www.forum.nokia.com

http://developer.qt.nokia.com


4/204

4Qt for Mobile

Objectives 2/2

QWidgets NATIVE LAF

QGraphicsView CUSTOM LAFQtWebkitQt Quick

In addition to Qt basics , we will take a look at the various ways a UI can

be created in Qt

To understand the variety of Qt offering for a developer!


5/204

5Qt for Mobile

Schedule Estimate, Day 1

Practicalities

Qt Mobile O verview & S tatus

Qt E ssentials

F irst Qt Application

Lunch

Working with the Nokia Q t S DK

Tutorial

More Qt E ssentials, S ignals and S lots!

Hands-on

Qt Mobility APIs intro

Hands-on


6/204

6Qt for Mobile

Schedule Estimate, Day 2

Qt Mobility APIs walkthrough

Hands-on

Porting Issues & R e-Using Platform C ode

Lunch

Mobile Qt UI Offering QWidgets

Animation FW + H ands-on

G raphics Viev, Q tWebKit

Qt Quick intro!


7/204

7Qt for Mobile

Required Tools

Laptop:

Qt S DK for Desktop (Windows/Linux/Mac)

Nokia Qt S DK for mobile development Includes Qt Mobility APIs

Includes Qt for S ymbian and Maemo

Includes Qt C reator IDE

S ymbian device (if you have one):

Qt libraries

Qt Mobility libraries

TR K application


8/204

8Qt for Mobile

Course Material

Please copy the material from the US B stick

C ontains: C ourse slides

E xercise solutions

A fewadditional sample applications

A few N8 devices available for you to try out during the hands-on

exercises!


9/204

9

Qt Overview

Qt Status for Mobile Devices


10/204

10Qt for Mobile

What is Qt?


11/204

11Qt for Mobile

Cross-Platform APIs

C ross-platform Qt APIs are wrappers around native services

HW

Windows Kernel Mac

Win32 GDI Carbon / Cocoa

Qt/Windows Qt/Mac

Symbian

S60 / OpenC

Qt/Symbian

Qt

Qt APIs

Application 1 Application 2 Application 3


12/204

12Qt for Mobile

Different Qt Platforms

Qt is currently ported to

Desktops: Windows, Linux (X11), Mac

Mobile platforms: E mbedded Linux, Windows C E ,

Maemo/MeeG o, and S ymbian

Qt/X11 Qt/Win Qt/MacQt/Embedded

LinuxQt/WinCE Qt/SymbianQt/MeeGo

One and unified Cross-Platform API


13/204

13Qt for Mobile

What is Qt on Mobile?


14/204

14Qt for Mobile

What is Symbian^3?

Actually, just S ymbian (or the New S ymbian)

The latest S ymbian platform release

Multiple home screens Multi-point touch

HD multimedia capabilities

Improved multitasking

Improved graphics architecture Q t libraries pre-installed!

Nokia N8 is the first S ymbian 3 device

More devices coming out shortly!

E .g. Nokia E 7


15/204

15Qt for Mobile

Qt and the Nokia N8

The first Symbian^3 device

Qt 4.6.3 (4.6.4) pre-installed Second wave of devices will have Qt 4.7

Capasitive touch screen Multi-touch and gestures work

A separate GPU! HW accelerated graphics QtOpenVG rasterization mode


16/204

16Qt for Mobile

Qt & Older Symbian Releases

Qt-based applications can potentially be run on any S ymbian platform

starting from S 60 3rd E dition, F eature Pack 1

Millions of target devices out there already!

However, note the lesser computing power of such devices

These older devices do not have Qt libraries pre-installed

S ymbian smart installer to the rescue! http://wiki.forum.nokia.com/index.php/Nokia_ S mart_ Installer_ for_ S ymbian


17/204

17Qt for Mobile

Smart Installer

Market of Zillions of Symbianphones, BUT yet without

Qt libraries

Your Qt app

Nokia N8 (Qt-ready!)

? ? ?


18/204

18Qt for Mobile

Smart Installer

Market of Zillions of Symbianphones, BUT yet without

Qt libraries

Your Qt app

Nokia N8 (Qt-ready!)

Smart Installer


19/204

19Qt for Mobile

Smart Installer server

Distribution.sis package

Smart Installer

Your Qt app

Check requirementsSmart Installer

Download and installmissing requirements


20/204

20Qt for Mobile

What is MeeGo?

Maemo

IntelsMoblin


21/204

21Qt for Mobile

MeeGo Architecture

Settings Database

GConf

Platform Info

libudev

Message Bus

D-Bus

System Libraries

glibc, glib

MeeGo Kernel

MeeGo API

CommsServices

Connection Mgmt

ConnMan

Netbook UX Netbook UI + Apps

Netbook UI Framework

Telephony

oFono

VOIP, IM, Pres

Telepathy

Bluetooth

BlueZ

InternetServices

Layout Engine

WebKit

Web Run-Time

WebKit

Web Services

Lib SocialWeb

Location

GeoClue

VisualServices

3D Graphics

OpenGL / ES

2D Graphics

Cairo, QPainter

I18n Rendering

Pango, QText

GTK /Clutter

MediaServices

Media FW

GStreamer

Camera

GStreamer plug-in

Codecs

GStreamer plug-in

Audio

PulseAudio

Data Mgmt

Content Framework

Tracker

Context Framework

ContextKit

Package Manager

PackageKit

DeviceServices

Device Health

Sensor Framework

Resource Manager

Backup & Restore

PersonalServices

PIM Services

Device Sync

Accts & SSO

Handset UX Handset UI + Apps

Handset UI Framework

X UPnP

GUPnP


22/204

22Qt for Mobile

MeeGo Architecture

Settings Database

GConf

Platform Info

libudev

Message Bus

D-Bus

System Libraries

glibc, glib

MeeGo Kernel

MeeGo API

CommsServices

Connection Mgmt

ConnMan

Netbook UX Netbook UI + Apps

Netbook UI Framework

Telephony

oFono

VOIP, IM, Pres

Telepathy

Bluetooth

BlueZ

InternetServices

Layout Engine

WebKit

Web Run-Time

WebKit

Web Services

Lib SocialWeb

Location

GeoClue

VisualServices

3D Graphics

OpenGL / ES

2D Graphics

Cairo, QPainter

I18n Rendering

Pango, QText

GTK /Clutter

MediaServices

Media FW

GStreamer

Camera

GStreamer plug-in

Codecs

GStreamer plug-in

Audio

PulseAudio

Data Mgmt

Content Framework

Tracker

Context Framework

ContextKit

Package Manager

PackageKit

DeviceServices

Device Health

Sensor Framework

Resource Manager

Backup & Restore

PersonalServices

PIM Services

Device Sync

Accts & SSO

Handset UX Handset UI + Apps

Handset UI Framework

X UPnP

GUPnP

Qt Quick

QtCore, QtGui, QtNetwork, Qt Mobility APis, etc Qt


23/204

23Qt for Mobile

Qt and All These?

== E V E R Y W H E R E !


24/204

24Qt for Mobile

DesktopOSs

Symbian MeeGo

Symbian Linux

Qt Mobility APIs

Linux C /C ++libraries

Qt Developer Offering

O pen C / PO S IX

Qt

S ymbian C ++

UI

Engine

MobileMobileMobileMobile

FeaturesFeaturesFeaturesFeatures

Low level

Native access

QtNetworkQtXml

QtGUI

QtCoreQtScript QtSql

QtSvg

QtXmlPatterns

QtWebkit

QtMultimedia

QtOpenGL

NativeAPIs

85% ofuse cases

**

15% of

use cases**

QtDeclarative

Qt Quick, Qt Quick C omponents


25/204

25Qt for Mobile

Working with Qt on Mobile Devices

Nokia Qt S DK is the easiest approach

Full IDE , Qt C reator

All Nokia S DKs included (S ymbian, Maemo)

Qt S imulator

On-device debugging (ODD)

Y ou will get plenty of hands-on exercise with this!


26/204

26Qt for Mobile

Install Qt, Get What?

~15 modules

~ 700 API classes

Build Tools

C onfigure, qmake, moc, uic and rcc

Development Tools

Qt C reator, Qt Designer, Qt Assistant, Q t Linguist

QtCore

QtGui QtNetworkQtSql QtXml

QtOpenGl QtSvg Qt3Support

Phonon

QtWebKit

QtScript

QtXmlPatternsQtOpenVG

QtMultimedia

QtMobility APIs


27/204

27Qt for Mobile

Camera

Landmarks, Maps,Navigation

Mobility API Roadmap

Service Framework

Publish&Subscribe

Messaging

Contacts

Bearer Management

(to QtNetwork in 4.7)

Versit

Sensors

Multimedia

System InformationLocation

Organizer

Document Gallery

Feedback

Telephony Events

1.0.2 1.1

Local Connectivity

(BT, NFC)

Later?

Face Recognition

Augmented Reality

removed!


28/204

28

Qt Essentials


29/204

29Qt for Mobile

What is Qt Programming?

Heavily object based C ++

Hundreds of ready-made classes, names start with Q

High abstraction level

UIs built from widgets

= UI Building Block, derived from QWidget

S ignalsnS lots, used for Object-to-object communication

Meta-Objects

And Q O bject as a common base class

Parent and C hild Objects

Memory management, window sharing

Has similarities to J ava

BUT is still C ++!


30/204

30Qt for Mobile

Very First Application

#include

#include

int main( int argc, char** argv )

{

QApplication app( argc, argv );

QLabel label( "Hetken kest elm..." );label.show(); // or showMaximized()

return app.exec();

}


31/204

31Qt for Mobile

Building Qt Applications in General

1. qmake project

C reates a Qt project file (.pro). This can also be created

manually.

2. qmake Uses the .pro file as input and produces platform-specific

Makefile(s)

3. make

C ompiles the program for the current platform

E xecutes also additional tools, such as moc, uic and rcc

Project

file (.pro)

Platformspecific

Makefiles

ApplicationBinary

makeqmake

-projectqmake


32/204

32Qt for Mobile

Creating Your Own Qt Application

Widgets

UI building blocks, base class QWidget

Label (QLabel)

One line text editor (QLineEdit)

Main window(QMainWindow)

Button (QPushButton)

etc.

Often your application UI is a composite widget which consists of multiple

contained widgets

We will see plenty of examples during the course


33/204


34/204

34Qt for Mobile

Input & Selection Widgets

Push buttons (QPushButton)

S election buttons (QR adioButton,QC heckBox)

Text input Line input (QLineE dit)

Plain text input (QPlainTextE dit)

Plain & rich text input (QTextE dit)

S pin boxes (QS pinBox)

Dial (QDial)

S croll bars (QS crollBar)

S liders (QS lider)


35/204

35Qt for Mobile

Qt Assistant

Y ou can use Q t Assistant to see how to use all the widgets

Provides not only profound class documentation but also good

articles on Qt conventions


36/204


37/204


38/204

38Qt for Mobile

More Widgets?


{


QLabel label( "Hetken kest elm..." );

label.show();

QLabel label2( "...ja sekin synkk ja ikv." );

label2.show();

return app.exec();

}

Not exactly what was intented E ach widget withouta parent becomes a windowof its own!

Why does S ymbian show only the latter one?


39/204

39Qt for Mobile

QObject Class Role

Heart of Qt's object model

Base class for all object classes

All QWidgets are QObjects also!

Provides object trees and object ownership

QObject's responsibility is to provide a central location for the

most important concepts in Qt

Has three major responsibilities

Memory Management

Introspection

E vent handling


40/204


41/204


42/204

42Qt for Mobile

Another Try


{


QLabel label( "Hetken kest elm..." );QLabel* label2 = new QLabel( "...ja sekin synkk ja ikv.",

&label );

label.show();

return app.exec();}

Nearly, but not quite enough

We need to use layouts!


43/204

Back to Our Example:


44/204

44Qt for Mobile

Back to Our Example:Final Try, Now With a Layout


{


QWidget window; // Needed, cos layout can not become a window

QVBoxLayout* layout = new QVBoxLayout(&window);

layout->addWidget( new QLabel( "Hetken kest elm...") );

layout->addWidget( new QLabel( "...ja sekin synkk ja ikv."));

window.show();

return app.exec();

}


45/204


46/204

46

Nokia Qt SDK

N ki Qt SDK


47/204

47Qt for Mobile

Nokia Qt SDK

S ince 4/2010 the Nokia Qt S DK has been available for all Qt-related

development

Available for Windows, Linux & Mac

Includes

Qt 4.6.3 for S ymbian and Maemo

QtMobility APIs 1.0.2

Qt C reator IDE 2.0

Qt S imulator

ODD for all devices

E xperimental remote compilation service Mainly aimed at Linux and Mac users wishing to compile for S ymbian

However, can be used to compile for any supported target device from any Nokia

Q t S DK desktop environment!


48/204


49/204


50/204

Work Flow


51/204

51Qt for Mobile

Work Flow

1. Design UI

2. Code Logic

5. Press Play and be amazed ofyour Awesomeness!

3. Try in Qt Simulator

4. Plug in device(s)and select target


52/204


53/204

First a Small GUI Example Slider


54/204

54Qt for Mobile

First, a Small GUI Example Slider

int main( int argc, char** argv ) {


QWidget window;

QLCDNumber* lcd = new QLCDNumber( &window );

QSlider* slider = new QSlider( Qt::Horizontal, &window );

window.showMaximized(); // or show()

return app.exec();

}

window

lcd slider

Signals and Slots


55/204

55Qt for Mobile

Signals and Slots

Observer pattern

Type-safe callbacks

More secure than callbacks, more flexible than virtual methods

Many-to-many relationship

Implemented in QO bject

R equires meta-object (macro Q_ OBJ E C T)

Signals


56/204

56Qt for Mobile

Signals

A signalis a way to inform a possible observer that something of interest hashappened inside the observed class

A QPushButton is clicked

QPushButton::clicked()

An asynchronous service handler is finished QNetworkAccessManager::finished( QNetworkReply* reply )

Value of QS lider is changed (and the new value is informed as a parameter)

QSlider::valueChanged( int )

S ignals are member functions that are automatically implemented in the meta-object

Only the function declaration is provided by the developer

S ignal is sent, or emitted, using the keyword emit emit clicked();

emit someSignal(7, Hello);


57/204

Signal and Slot Implementation


58/204

58Qt for Mobile

Signal and Slot Implementation

class NewClass :public QObject

{

Q_OBJECT // Meta-object file needed

// Code convention recommends Q_OBJECT use always,// otherwise qobject_cast fails

signals:

// Implementation in the meta-object

voidnewSignal(int myInt, QString myString);

voidanotherSignal();

public slots:

// Slots are implemented as normal member functions

voidnewSlot(int i, QString s);

voidsomeSlot();

}

Connections


59/204

59Qt for Mobile

Connections

To receive a signal in a slot, signal and slot must be connected

bool success = QObject::connect(

senderObject, SIGNAL(valueChanged(int)),

observerObject, SLOT(display(int)));

E mitted signal results

In an immediate slot function call, if signal and slot implemented in objects

in the same thread

S ignal and slot signatures must match (signal may have moreparameters)

No compile time error checking is made!


60/204

Events vs. Signals


61/204

61Qt for Mobile

g

S o, if you C R E ATE your own widgets

Y ou create event handlers:

What does this widget do when someone clicks it?

What does it do when keyboard is pressed?

What does it do when it is requested to paint itself (i.e. how does it paintitself)?

Y ou also tell, when does it emit signals

MyWidgetEvent handler

Hey! Im

clicked()

Event handler

Event handler

Events vs. Signals


62/204

62Qt for Mobile

g

If you US E existing widgets

Y ou are interested in existing signals

What do I want to do (somewhere else) when the widget is clicked()?

Y ou connect slot functions to the signals

SomeWidget

Hey!

valueChanged()

Hey! Im

clicked()

Some Object

slot function

Some Object

slot function


63/204


64/204

Slider Example w/ Layout Manager


65/204

65Qt for Mobile

int main( int argc, char** argv ) {


QWidget window;

QVBoxLayout* layout = new QVBoxLayout( &window );

QLCDNumber* lcd = new QLCDNumber( &window );

QSlider* slider = new QSlider( Qt::Horizontal, &window );

layout->addWidget( lcd );

layout->addWidget( slider );

QObject::connect( slider, SIGNAL(valueChanged(int)),

lcd, SLOT(display(int)));

window.showMaximized();

return app.exec();

}

layout

lcd slider

window


66/204

Summary on Qt Basics


67/204

67Qt for Mobile

Tree of O bjects

One main widget acts as the parent

S ignals and slots are used for making objects interact with each other

Layout managers used instead of hard coded positions

Do we always need to code the whole G UI? Nope! Lets check Qt Designer!


68/204

Qt Designer


69/204

69Qt for Mobile

C omes with Desktop Qt as a separate application

Also integrated to C arbide.c++ and QtC reator, as Form Designer

Dragndrop UI designer

Outputs XML-based .ui files

.ui files are converted automatically to .h files by uic (ui compiler)

myproject.ui -> ui_ myproject.h


70/204


71/204

Lets Try It Out!


72/204

72Qt for Mobile

BMI C alculators layout!


73/204


74/204


75/204


76/204


77/204


78/204

Work Flow, Concretely!


79/204

79Qt for Mobile

1. Design UI

Work Flow, Concretely!


80/204

80Qt for Mobile

1. Design UI

2. Code Logic


81/204


82/204


83/204

Configuring the Devices


84/204

84Qt for Mobile

The first time, youll need

For symbian, install TR K (comes with S DK), for ODD

For maemo, configure MADDE connection

For any device, install Qt (+ QtMobility) libraries O r! Use smart-installer

F ind Getting Started with Nokia Qt SDKdocumentation forinstructions

OVI S uite (or older PC S uite) is also required for the data connection

between Nokia device and your device

Work Flow, Concretely


85/204

85Qt for Mobile

1. Design UI

2. Code Logic

5. Press Play and be amazed ofyour Awesomeness!

3. Try in Qt Simulator

4. Plug in device(s)and select target

Qt Simulator


86/204

86Qt for Mobile

Try out UI in phone LAF

S imulate mobile events

Only for quick-testing!


87/204

Hands-On, Try It Out!


88/204

88Qt for Mobile

C reate a simple mobile Q t application

C reate the infamous Polish C urrency C onverter!

O ruse Qt Designer to create a simple UI with whatever you wish (a button, a

slider, anything you like)

Write a little bit of logic so that your application reacts to UI events (button clicks

etc.)

Make it work!

Try out in the simulator first

R un on a real device as well!


89/204

89

Qt Mobility APIs

Introduction


90/204


91/204

Status at 1.0.2


92/204

92Qt for Mobile

Status at 1.1.0


93/204

93Qt for Mobile

*) Backend not enabled in pre-built packages


94/204

First Intro to Mobility APIs

Were using class QSystemInfo from


95/204

95Qt for Mobile

#include

#include

#include

QTM_USE_NAMESPACE;

int main( int argc, char *argv[] )

{


QSystemInfo s;QLabel *label = new QLabel( "Current language is "+ s.currentLanguage() +

" and you're using Qt " + s.version(QSystemInfo::QtCore) );

label->show();

return app.exec();

}

We re using class QSystemInfo fromthe System Information API

In Symbian, well need to use#include

elsewhere#include is ok

First Intro to Mobility APIs

E i i l t t


96/204

96Qt for Mobile

#include

#include

#include

QTM_USE_NAMESPACE;

int main( int argc, char *argv[] )

{


QSystemInfo s;QLabel *label = new QLabel( "Current language is "+ s.currentLanguage() +

" and you're using Qt " + s.version(QSystemInfo::QtCore) );

label->show();

return app.exec();

}

Equivivalent tousing namespace QtMobility;

All classes within Mobility APIs areplaced inside namespace QtMobility.

You can raise the whole namespace oreither use syntax

QtMobility::, likeQtMobility::QSystemInfo

Mobilizing the Project File

TEMPLATE = app


97/204

97Qt for Mobile

TEMPLATE = app

TARGET =

DEPENDPATH += .

INCLUDEPATH += .

CONFIG += mobility

MOBILITY += systeminfo# Input

SOURCES += main.cpp

Compiling

Nokia Q t S DK


98/204

98Qt for Mobile

Nokia Q t S DK

Windows (with mingw32-make)

qmake

mingw32-make release

S ymbianqmake

make release-gcce

To create/install the .siscreatepackage i hw_template.pkg release-gcce


99/204

What Capabilities Are There?


100/204

100Qt for Mobile

http://developer.symbian.org/wiki/index.php/C apabilities_ (S ymbian_ S igned)

How to Gain Capabilities?

Declare the needed capabilities in the .pro file:


101/204

101Qt for Mobile

Declare the needed capabilities in the .pro file:

Symbian {

TARGET.CAPABILITY += Location NetworkServices

}

Application needs to be signed

S elf-signing works for lightest capabilities (user grantable)

S ymbian signed online for a bit heavier capabilities

C heck the link on the previous slide for details


102/204

More System Information APIClasses

Device information (battery, power state, input method type, IME I, manufacturer,QS t D i I f


103/204

103Qt for Mobile

Memory and disk information (drive types, free space)QSystemStorageInfo

Access to screen saver (inhibiting it)QSystemScreenSaver

Network information (network name, signal strength, network mode, etc.)QSystemNetworkInfo

G eneral system information (like in the previous example)QSystemInfo

Display information (color depth, brightness)QSystemDisplayInfo

( y, p , p yp , , ,

profile status etc.)QSystemDeviceInfo

QSystemDeviceInfo Example


104/204

104Qt for Mobile

S mall application to show the current profile, battery level and power status

Profile status naturally not available on Windows

Demo


105/204

Using QSystemDeviceInfo Example (2/4)Constructor


106/204

106Qt for Mobile

MainWindow::MainWindow(QWidget *parent) :

QMainWindow(parent),

ui(new Ui::MainWindow), m_device( new QSystemDeviceInfo(this) )

{

ui->setupUi(this);

// batteryBar is a QProgressBar

ui->batteryBar->setValue(m_device->batteryLevel());

changePowerState(m_device->currentPowerState()); // Self-created slot function

changeProfileInfo(m_device->currentProfile()); // Self-created slot function

connect( m_device, SIGNAL(batteryLevelChanged(int)),

ui->batteryBar, SLOT(setValue(int)) );connect( m_device, SIGNAL(powerStateChanged(QSystemDeviceInfo::PowerState)),

this, SLOT(changePowerState(QSystemDeviceInfo::PowerState)));

connect( m_device, SIGNAL(currentProfileChanged(QSystemDeviceInfo::Profile)),

this, SLOT(changeProfileInfo(QSystemDeviceInfo::Profile)));

}


107/204

Using QSystemDeviceInfo (4/4) Examining the Profile Change

void MainWindow::changeProfileInfo( QSystemDeviceInfo::Profile profile ) {switch( profile ) {

QS t D i I f Sil tP fil


108/204

108 Qt for Mobile

case QSystemDeviceInfo::SilentProfile:

ui->profileLabel->setText( "Silent" );

break;

case QSystemDeviceInfo::NormalProfile:

ui->profileLabel->setText( "Normal" );

break;

case QSystemDeviceInfo::LoudProfile:

ui->profileLabel->setText( "Loud!" );

break;

case QSystemDeviceInfo::OfflineProfile:

ui->profileLabel->setText( "Offline" );

break;

case QSystemDeviceInfo::CustomProfile:

ui->profileLabel->setText( "Custom" );

break;

default:

// VibProfile or PowersaveProfile are not handled separately

ui->profileLabel->clear();

}}


109/204


110/204

110

Qt Training

Day 2

Day 2

Mobility APIs API Walkthrough


111/204

111 Qt for Mobile

QWidgets NATIVE LAF


Hands-on

Porting & R e-using platform code

Lunch!

UI Afternoon, Qt Mobile UI O ffering:


112/204

112

Qt Mobility APIs

API Overviews


113/204


114/204

Mobility API Checklist

Mobility API libraries in the device


115/204

115 Qt for Mobile

Mobilize .pro file

Include classes (with classname.h)

QTM_ US E _ NAME S PAC E ;

S ee yesterdays slides for examples!


116/204

Publish & Subscribe

The Publish and S ubscribe API enables applications to read item


117/204

117 Qt for Mobile

ppvalues, navigate through and subscribe to change notifications

Values are represented by a QValueSpace

Hierarchical tree of which each node or leaf can optionally contain aQVariant value

QVariant is a union data type

Nodes act as Paths which can

be subscribed to

Access with QValueSpaceSubscriber

R ead values, receive change notifications, navigate through QValueS pace

New values are added with QValueSpacePublisher

Serialized QValueSpace example:

/Device/Buttons = 3

/Device/Buttons/1/Name = Menu

/Device/Buttons/1/Usable = true

/Device/Buttons/2/Name = Select/Device/Buttons/2/Usable = false

/Device/Buttons/3/Name = Back

/Device/Buttons/3/Usable = true

Messaging API

Access to messaging services

S earch and sort


118/204

118 Qt for Mobile

S earch and sort

C reate and modify

S end and retrieve

Launch preferred message client

A unified interface for manipulation and storage of S MS , MMS , E mail and

XMPP messages is provided

Key Classes for Messaging

C omposition and manipulation of messages:

QMessage


119/204

119 Qt for Mobile

QMessage

QMessageAddress

Accessing message accounts QMessageAccount

QMessageFolder

S orting and filtering

QMessageStore

QMessageFilter

Accessing message services

QMessageService

Creating a Message

// The developer creates a QMessage object and then sets thenecessary message details. First set the message type, thedefault account for messages of the specified type will be used


120/204

120Qt for Mobile

default account for messages of the specified type will be usedfor sending :

QMessage message;

message.setType(QMessageAddress::Email);// Now a recipient is set :

QString recipient([email protected]);

message.setTo(QMessageAddress(QMessageAddress::Email, recipient));

// For email a subject and a body are set, and any relevant

attachments added :message.setSubject(Example subject);

message.setBody(Example body text);

QStringList attachmentPaths;

attachmentPaths


121/204

121Qt for Mobile

QMessageService *m_service = new QMessageService();

if (!m_service->send(message)) {

QMessageBox::warning(0, tr(Failed), tr(Unable to send

message));

}

// Will open the default composer for messages of this type and

with the existing message as the initial situation

QMessageService *m_service = new QMessageService();

m_service->compose(message)

Opening the Default Composer


122/204

Monitoring Position Data

Default position source may be available on some platforms

QGeoPositionInfoSource::createDefaultSource()


123/204

123Qt for Mobile

QG eoPositionInfoS ource is simple to use startUpdates() (andsetUpdateInterval())

positionUpdated( QGeoPositionInfo ) [signal] is emitted after each interval

stopUpdates()

Simple Client Receiving Location Data

class MyClass : public QObject {Q_OBJECT

public:


124/204

124Qt for Mobile

MyClass(QObject *parent = 0) : QObject(parent) {

QGeoPositionInfoSource *source =

QGeoPositionInfoSource::createDefaultSource(this);

if (source) {

connect(source, SIGNAL(positionUpdated(QGeoPositionInfo)),

this, SLOT(positionUpdated(QGeoPositionInfo)));

source->startUpdates();

}

}

private slots:

void positionUpdated(const QGeoPositionInfo &info) {

qDebug()


125/204

125

Qt for Mobile

Contacts API

The C ontacts API allows developers to manage contact data in a platformindependent way.


126/204

126

Qt for Mobile

A contact is the digital representation of a person, group or entity

A contact consists of a set of contact details with own semantics of usage and

storage with different context info (like separate phone number for work andhome)

QContactManager unifies one or more platform-specific contact

backends

Main Contact Classes

Addressbook contactQContact


127/204

127

Qt for Mobile

S ingle detail of a QContactQContactDetail

Interface for performing actions to

contacts (like S end email or Dial)

QContactAction

Used to select contacts throughQContactManager

QContactFilter

Access to contacts stored in particular

backend

QContactManager

Versit API

Functionality for reading and writing Versit documents such as vC ards

QVersitDocument


128/204

128

Qt for Mobile

QVersitReader

QVersitWriter

Utilities to import/export QC ontacts from/to Versit documents

QVersitContactImporter

QVersitContactExporter

Bearer Management API

Now part of Qt 4.7 QtNetwork!

Manages the connectivity state to the network


129/204

129

Qt for Mobile

Allows user to start or stop network interfaces

Is device online and how many available interfaces there are

Allows comparison and prioritization of the access and use of grouped

access points

When using Bearer Management the developer does not need to worry

about locating the best connection

User selects best

Transparent selection

Automatic roaming between cellular and WLAN networks


130/204

Small Example on Bearer Management


131/204

131

Qt for Mobile

Application lists available network configurations and shows information on theselected one

UI consists only of a QListView and a QTextBrowser

QListView uses QStringListModel (which has the names of the configurations)

For a more complex example, see Bearer Monitor example of the Mobility APIs

Demo

Multimedia APIs

Play audio & video of various formats

R ecord audio


132/204

132

Qt for Mobile

Playing and managing of an FM radio

With QtMultimedia, will eventually replace Phonon API

Access to multimedia services with minimal code and maximal flexibility

Overview on Multimedia API(Main Classes Only)


133/204

133

Qt for Mobile

Included in

1.1.0

Sensors API

The API supports sensors that poll for their data and sensorsthat push data to the app as it arrives


134/204

134

Qt for Mobile

p pp

QSensor (and its subclasses) provide application with access

to data input from a sensor

Direct subclass instantiation

QS ensorR eading subclasses represent single readings from asingle sensor

QSensorBackend can be used to make sensors availablethrough the same API, by creating plugins

Application Code QSensor QSensorBackend

QSensorReading Device Plugin

Existing QSensor Subclasses

Ambient light sensorQAmbientLightSensor

Linear acceleration along the X, Y and Z

axes

QAccelerometer


135/204

135

Qt for Mobile

R otationQRotationSensor

Tap sensor (registers tap and double tapevents in 6 directions)QTapSensor

Proximity (if something is close)QPromiximitySensor

OrientationQOrientationSensor

MagnetometerQMagnetometer

C ompassQCompass

Ambient light sensorQAmbientLightSensor

Demo: Using Sensors


136/204

136

Qt for Mobile

ProximitySensor Test

Horizonize with Orientation sensor


137/204

Mobility API Roadmap

Service FrameworkBearer Management

(to QtNetwork in 4.7)Organizer

1.0.2 1.1 Later?

Augmented Reality


138/204

138

Qt for Mobile

Camera

Landmarks, Maps,Navigation

Publish&Subscribe

Messaging

Contacts

Versit

Sensors

Multimedia

System InformationLocation

Document Gallery

Feedback

Telephony Events

Local Connectivity

(BT, NFC)

Face Recognition

removed!

Porting Mobile


139/204

139

Porting MobileApplications to Qt

Contents

Different Application Approaches in Nokia Devices

Porting from iPhone or Android to Qt no code re-use


140/204

140

Qt for Mobile

Porting from iPhone or Android to Qt, no code re-use

Mapping concepts

Porting from native S ymbian/Maemo to Qt, how to re-use platform code

Porting Alternatives:

Hybrid UI

E ngine Wrapping

Different Application Approaches inNokia Devices

Qt C++WEB

WEB


141/204

141

Qt for Mobile

A variety of technologies available for selecting the most suitable approach

Qt C++

Qt C++

WEB

1. Qt 2. QtWebkit 3. Symbian WebRuntime

Qt ApplicationsQt C++


142/204

142

Qt for Mobile

More native applications

Multiple UI approaches E xtensive engine support through Qt and Qt Mobility APIs

Qt C++,UI with QWidgets

C++,UI with

Graphics ViewC++

Qt Quick UI

Native LAF

Custom LAFCustom LAF with

easy-to-developscript-like syntax

QtWebkit

WEB


143/204

143

Qt for Mobile

Possibility to embed dynamic content to Q t C ++ programs

E .g. create the whole UI with web technologies and show it in a QWebView

widget

C ollaborate between J avaS cript and C ++

R e-use existing web documents

Qt C++

More Concretely, fromiPhone/Android to Qt?

iPhone (Objective-C ) and Android applications only work on their nativeplatforms which are not Qt-compatibile


144/204

144

Qt for Mobile

R eusing parts of applications is basically not possible when porting to Qt

Porting requires complete code level re-implementation with Qt

Lets look briefly into a few fundamental characteristics of both platforms

C omparison to Qt C onceptual mapping of native elements to Qt

iPhone Overview

Applications in iPhone are writtenusing the Objective-C programming

language


145/204

145

Qt for Mobile

Development of Objective-Capplications requires the use of Apple

environment

Tools in use

Objective-C : XC ode

Qt/S ymbian: Q t C reator, C arbide.c++

Objective-C Application Framework

Applications for iPhone are writtenusing Objective-C and using the

C ocoa framework

Obj ti C i t ll


146/204

146

Qt for Mobile

Objective-C is actually an

extension of ANS I C

The C ocoa framework consists of

libraries, APIs and runtimes that

form the development layer for all ofMac O S X

Applications automatically inherit

the same Mac OS X LooknFeel

O bjective-C application

architecture

iPhone Application Features

UIKit is iPhones runtime UI framework which provides a set of UIcomponents but also access to device services (like camera and

accelometer)

S et of UI components is rather similar to Qt


147/204

147

Qt for Mobile

S et of UI components is rather similar to Qt

Homogenous LAF

Only one foreground iPhone application can be executed at a time

(excluding iPhone 4)

When user selects application icon from menu, new process launches

Pressing home screen button closes the application process

Applications try to imitate background execution by state saving

iPhone supports multitouch events by nature

UIEvent consists ofUITouch objects (one for each finger) Qt 4.6 introduced a new G esture Framework to provide fluent touch UI support

Android Platform Overview

Android is an open and free platform for mobile phones (and mobilephones only)

Based on Linux-kernel, but G oogle says it is not a Linux O S


148/204

148

Qt for Mobile

Own windowing system

Not supporting full set of standard Linux libraries, like G NU C Library

R euse of existing Linux apps or libraries difficult

Android Applications Overview

Applications developed with J ava using a proprietary Dalvik VM Device services, like touch screen and storage accessed through G oogle

services API


149/204

149

Qt for Mobile

Android does not use standard J ava APIs, such as J 2S E or J 2ME

Not compatible with J ava apps written for other platforms

Android apps do not provide one entry point (like main function) but a setof essential components

Activities, services, broadcast receivers and content providers

Application process is started when any part of it is needed and J ava objects

for that part are instantiated

Comparing Android and Qt UIConcepts

Activity QWidget that is a window (main widget) Android Views Qt Widgets

Different set of widgetsActivity

Main widget(QWidget)


150/204

150

Qt for Mobile

View structure Qt Parent/child relationship

Dialog QDialog

S imilar Layout managers

E vent handling:

dispatch () QObject::event()

on E vent() QObject:: E vent() -

Looper::loop() QApplication::exec()

Views

contains

Child widgets(QWidget)

contains

Porting Different Types of MobileApps to Qt

Applications based on web technologies or applications with embeddedweb content

QtWebkit

R e-use of graphics, extend engine with C ++ Qt C++

WEB WEB


151/204

151

Qt for Mobile

g p , g

(S ymbian Web R untime)

Applications with standard device UI

Qt C ++ with standard QWidgets

G ames without heavy graphics-rendering requirements

Qt Quick

G ames with heavy, real-time graphics and/or 3D Qt with G raphics V iew

Q

C++,UI with

Graphics View

C++

Qt Quick UI

Qt C++,UI with

QWidgets

Porting Mobile


152/204

152

gApplications to Qt

Re-using Platform Code

What is Qt for Symbian? (1/2)

Applications are implementedusing cross-platform Q t APIs

Qt APIs are implemented using

native APIs

Application 1 Application 2 Application 3


153/204

153

Qt for Mobile

native APIs

HW

Windows Kernel Mac

Win32 GDI Carbon / Cocoa

Qt/Windows Qt/Mac

Symbian

Eikon / OpenC

Qt/Symbian

Qt

Qt APIs

What is Qt for Symbian? (2/2)

When you install Q t/S ymbian the Qt libraries are compiled as S ymbianDLLs

QtC ore.dll, Q tG ui.dll, etc.


154/204

154Qt for Mobile

Y our own applications are compiled using a native compiler

From S ymbian OS s point of view your applications are just normal

S ymbian processes But! Program code is no longer S ymbian, but cross-platform Qt code

No S ymbian coding conventions!

C an be directly re-compiled for other Qt platforms

Y ou can mix native platform code with Qt!

GUI

GUI

Application Partitioning in Symbian

App UI& Views(EXE)

App UI& Views(EXE)

(Avkon in S60)

YourSymbian


155/204

155Qt for Mobile

BaseBase

EngineSupport

Engine

Support

GraphicsGraphics

ApplicationEngine

(DLL)

ApplicationEngine(DLL)

(EXE)( ) y

application

Porting Alternative 1/3 Hybrid UI

App UI& Views

App UI& Views(EXE)

New UI with Qt widgets Engine left untouched

Di t t S bi

Qt UI(EXE)

Qt UI(EXE)


156/204

156Qt for Mobile

ApplicationEngine

(DLL)

ApplicationEngine

(DLL)

(EXE)(EXE) Direct access to Symbianengine inside Qt UI code

=> Hybrid code (Qt+Symbian

mixed), not cross-platform

(EXE)( )

(Bad!) Example on Hybrid UI

#include

#include

void MyUiClass::doSomething() {

TRAPD( err, CSymbianEngine* engine = CSymbianEngine::NewL() );

if( err != KErrNone )

{


157/204

157Qt for Mobile

{

CleanupStack::PushL( engine );

engine->SetSomethingL( EFalse );

QLabel* l = new QLabel( engine->GetText(), this );

CleanupStack::PopAndDestroy();

}

}Works!

but only in Symbian, so not cross-platform!Problems in readability, error handling etc.

Porting Alternatives 2/3 Engine Wrapper

App UI& Views(EXE)

App UI& Views(EXE)

New UI with Qt widgets Engine left untouched Engine wrapped with a

Qt UI(EXE)

Qt UI(EXE)


158/204

158Qt for Mobile

(EXE)(EXE) Engine wrapped with aseparate Qt class Engine wrapperimplementation hybrid code, UI

plain Qt

=> Clean UI code, possibility toport engine later

Qt EngineWrapper

( )

Application

Engine(DLL)

Application

Engine(DLL)

Hiding Platform Dependency 1 Simple Wrapper

By simplest we can just wrap our existing S ymbian engine class with a

UI Code (Qt) EngineWrapper (Hybrid) CEngineClass (Symbian)


159/204

159Qt for Mobile

By simplest we can just wrap our existing S ymbian engine class with a

hybrid class

Qt class with Qt interface and mechanisms (like S ignals&S lots)

Y et, dependencies on S ymbian in class interface

UI code stays clean and plain Qt but is actually dependent on S ymbian

through E ngineWrappers interface

+ Quickneasy

- Not very flexible, possible problems with S C /BC if going cross-platform

Example Interface

#include // Symbian dependency

class EngineWrapper : public QObject {

Q_OBJECT


160/204

160Qt for Mobile

public:// Qt-style interface for engine services

signals:

private:

CSymbianEngineClass* m_engine; // Symbian dependency

};

Hiding Platform Dependency 2 Private Implementation

More flexibility can be achieved by keeping even the E ngineWrappers

Ui Code (Qt) EngineWrapper (Qt) EngineWrapperPrivate (Symbian) CEngineClass (Symbian)


161/204

161Qt for Mobile

More flexibility can be achieved by keeping even the E ngineWrapper s

interface as pure platform independent Q t

All platform dependent functionality and data are placed inside a private

class A simple design pattern calledprivate implementation

Qt itself has been implemented for different platforms using the same

mechanism!

Private Implementation in ItsSimplest

// a.h

class A {

...

private:

// a.h

class AP;

class A {

// a.cpp

class AP {

private:


162/204

162Qt for Mobile

private:

int x;

int y;

};

class A {

...

private:

AP* d_ptr;

};

private:

int x;

int y;

};

...

Header file stays the same regardless of the contents of class AP

Binary C ompatibility for A remains despite AP being changed

More on Private Implementation

If engine is ported for different platforms, only the private class needs to bereplaced.

UI Code (Qt) EngineWrapper (Qt) EngineWrapperPrivate (Symbian) CEngineClass (Symbian)


163/204

163Qt for Mobile

As mentioned, this mechanism is also used for building cross-platform

APIs (like Qt itself!)

One unified API

Platform-specific private implementation classes

EngineWrapperPrivate (maemo) MaemoEngineClass (maemo)

More on Private Implementation

In S ymbian, using a native service quite often requires the use of ActiveObjects

Asynchronous communication

The private implementation class can act as an Active Object and


164/204

164Qt for Mobile

UI Code (Qt) EngineWrapper (Qt) EngineWrapperPrivate (Symbian)

CActive

Some Symbian Native Server

transform S ymbian AO mechanism to Qt S ignals&S lots

Porting Alternatives 3/3 Re-Implementation

Qt provides strong and easy-to-use engine support so re-implementing the whole engine

Qt UI(EXE)

Qt UI(EXE)

Qt UI

Qt UI


165/204

165Qt for Mobile

p g gis something to also consider

Mobility APIs extend Qt enginesupport to mobile devices

Qt Engine(DLL)

Qt Engine(DLL)

+Engine(EXE)

+Engine(EXE)

OR

Pros/Cons of Full Qt Reimplementation

+ Platform independency All Qt platforms achievable

+ Better maintainability


166/204

166Qt for Mobile

Less code, clearer, only one code technology in use

- More work- Obviously

- E fficiency in some cases

- One more code layer

Porting Summary

iPhone & Android No code re-use

Web content/graphics can be re-used

Different alternatives for re-implementation for different purposes (Qt, Qt w/


167/204

167Qt for Mobile

G raphics View, Qt Quick, QtWebkit, WR T)

S ymbian & Maemo

C ode re-use possible

UI should be ported and E ngine should be wrapped

Introduction to


168/204

168

Mobile Qt UI

Mobile Qt UI Offering


169/204

169Qt for Mobile

QWidgets NATIVE LAF

Native Look-and-Feel w/ QWidgets

C ode once, look native everywhere

Pretty straightforward


170/204

170Qt for Mobile

C an customize, a bit S tyle sheets

Widget properties

Own custom widgets

C omplete customization not easy/possible

G ames, completely different kind of UIs

Quite desktop-oriented

Missing mobile concepts, like views Not really there yet, at least in S 3

Animations &

Eff


171/204

171

Effects

Spicing Up QWidget UIs

Introduction 1(2)

In Qt 4.6 a new Animation Framework was introduced

The idea is to provide an easy and scalable way of creating

i t d d th G UI


172/204

172Qt for Mobile

animated and smooth G UIs Hides the complexity of handling timers

Provides a set of pre-defined easing curves, custom curves can

be provided by the developer as needed

Works by modifying the properties of the QObjects being

animated

Main Classes


173/204

173Qt for Mobile

Example Animating a Button

What do you think the example below does?

QPushButton button("Animated Button");

button.show();


174/204

174Qt for Mobile

QPropertyAnimation animation(&button, "geometry");

animation.setDuration(10000);

animation.setStartValue(QRect(0, 0, 100, 30));

animation.setKeyValueAt(0.5, QRect(250, 250, 100, 30));animation.setEndValue(QRect(0, 0, 100, 30));

animation.start();

Demo

Animation Groups 1(2)

C lasses QSequentialAnimationGroup andQParalleAnimationGroup can be used to run multiple

animations in sequence or in parallel

An animation group can be used wherever a normal animation

could e g a group within a group


175/204

175Qt for Mobile

could e.g. a group within a group E nables building very complex animation sequences

Animation Groups 2(2)

QPropertyAnimation* animation1 = new QPropertyAnimation(...);




QParallelAnimationGroup *parallel = new QParallelAnimationGroup();


176/204

176Qt for Mobile

QParallelAnimationGroup parallel new QParallelAnimationGroup();

parallel->addAnimation(animation2);

parallel->addAnimation(animation3);

QSequentialAnimationGroup* seq = new QSequentialAnimationGroup();

seq->addAnimation(animation1);

seq->addAnimation(parallel);

seq->addAnimation(animation4);

seq->start();

Easing Curves

The Animation FW provides multiple pre-made easing curves

for your convenience

R epresented by the class QEasingCurve


177/204

177Qt for Mobile

Typically used to control e.g. how the animation starts and/or

finishes

QEasingCurve::OutBounce

QEasingCurve::InOutQuad

Take a look at the E asing C urves example in the Q t Demo tool

QPropertyAnimation animation(&button, "geometry");

animation.setEasingCurve(QEasingCurve::OutBounce);

Demo

Graphics Effects

G raphics effects provide an easy-to-use mechanism for addingeffects on QGraphicsItems and QWidgets

QGraphicsItem::setGraphicsEffect(QGraphicsEffect*)

QWidget::setGraphicsEffect(QGraphicsEffect*)


178/204

178Qt for Mobile

A group of standard effects are provided

S ee next slide for examples

C ustom effects can be created by the developer

S imply a matter of imlementing a virtual draw() function

S ee documentation in the base class QGraphicsEffect for details

and guidelines

Standard Effects

Source Image

QGraphicsBlurEffect QGraphicsOpacityEffect


179/204

179Qt for Mobile

g

QGraphicsColorizeEffect QGraphicsDropShadowEffect

Applying and Animating an Effect

// Set up an effect

QGraphicsOpacityEffect* effect = new QGraphicsOpacityEffect(this);

effect->setOpacity(1.0); // 0.0 means fully transparent, 1.0 fully opaque

// Apply to a graphics item

QGraphicsPixmapItem *item = new QGraphicsPixmapItem(...);


180/204

180Qt for Mobile

QGraphicsPixmapItem item new QGraphicsPixmapItem(...);

item->setGraphicsEffect(effect);

// Animate the effect

QPropertyAnimation* animation = new QPropertyAnimation(effect, opacity);

animation->setDuration(1000);

animation->setStartValue(1.0);

animation->setEndValue(0.0);

animation->start();

Demo

Hands-On Animations!

Play around with Animation FW

G raphics E ffects

Make the two buttons change


181/204

181Qt for Mobile

Make the two buttons changechange place

Make a slider follow the other, with

a delay

Mobile Qt UI


182/204

182

Mobile Qt UI

Graphics View



183/204

183Qt for Mobile

QWidgets NATIVE LAF

QGraphicsView CUSTOM LAF

Custom UI w/ QGraphicsView

QG raphicsView is a Q Widget, designed for showing custom 2D graphics :

Custom

graphs

gothe

re


184/204

184Qt for Mobile

If the only widget (the window itself) is a Q G raphicsView, the whole UI is

then custom:

Graphics View Architecture

Actually, inside a Q G raphicsView, lies an architecture of its own S uper-duper optimized for doing everything fast and being flexible

QGraphicsView


185/204

185Qt for Mobile

QGraphicsItem

QGraphicsScene

Shows contents of one

is a 2D container for

Working with GraphicsView

Y ou code your mice yourself!

C reate a custom graphics item:

Derive from QG raphicsItem (or some other QG raphics* base class)

Write code for painting operations with QPainter


186/204

186Qt for Mobile

Write code for event handling

Write code for animations

etc.

Mobile Qt UI


187/204

187

Mobile Qt UI

QtWebKit



188/204

188Qt for Mobile

QWidgets NATIVE LAF

QGraphicsView CUSTOM LAFQtWebkit

Hybrid Apps with QtWebkit

Write UI (+logic) with standard web technologies

E mbed in a Qt/C ++ Application

Key C ++ classes:

QWebView MyUi.html


189/204

189Qt for Mobile

QWebPage

QWebFrame

Qt/C++ Application

QWebView

*.js

*.css

Shows contents of

Hybrid Apps w/ QtWebkit

Web technology experts can contribute easily to Q t applications

Qt C ++ engine and Web UI can interact!

Logic can be written with J avaS cript as well

Port easily from an existing Web app (like an iPhone app)


190/204

190Qt for Mobile

UI loaded dynamically (HTML/J avaS cript)

C an actually be a dynamic UI with online content!

http://wiki.forum.nokia.com/index.php/Q t_ hybrid_ applications

http://wiki.forum.nokia.com/index.php/Hybrid_ Application_ G enerator

Demo: Worlds Simplest WebBrowser


191/204

191Qt for Mobile

Mobile Qt UI


192/204

192

Mobile Qt UI

Qt Quick



193/204

193Qt for Mobile

QWidgets NATIVE LAF


What is Qt Quick?

Qt User Interface C reation Kit

UIs written in a J avaS cript-like language called QML

A high-level UI technology for easily creating attractive UIs

No C ++ skills needed, knowledge of J avaS cript helps quite a bit

Aimed at both UI designers and developers alike


194/204

194Qt for Mobile

Aimed at both UI designers and developers alike

E nables designers and developers to speak the same language!

Both parties can be involved in iterative development simultaneously

No need for separate F lash or PowerPoint UI prototypes

This is the future of UI development in Qt! Qt Quick was officially launched in Q t 4.7

R eleased 9/2010

Demonstrations

Lets study this a bit by looking at a few examples


195/204

195Qt for Mobile

GPU Accelerated Qt Quick in N8:Flowd Example flowd.com


196/204

196Qt for Mobile

Inside Flowd

QtMobility APIs QtDeclarative

QML UI


197/204

197Qt for Mobile

Qt/C++ Engine

Experiences with Serious Qt QuickDevelopment

R eally Quick to develop

Fast prototyping

Also, great fun

BUT, Lots of things missing:


198/204

198Qt for Mobile

g g

No UI FW

View switching

manual loading/unloading of resources

portrait/landscape

No components (yet) no styling

Qt Mobility Bindings

Qt Mobility 1.1 (now in beta) includes QML Bindings for some parts

Y ou can access mobility APIs functionality directly from Q ML

At the moment the following are available to Qt Quick:

G allery


199/204

199Qt for Mobile

G allery

Location

Multimedia

S ervice F ramework

Messaging

Summary


200/204

200

Summary

New Features in Qt 4.7

Qt Quick, the Qt Ui C reation Kit

QML , a declarative, J S -like, language for designers and developers for

creating animated and fluid User E xperience

QtDeclarative, a C ++ library to integrate QML declarations into the Q t

G raphics View

QtC reator 2.0 supports QML editing


201/204

201Qt for Mobile

New networking possibilities

Bearer Management API from QtMobility integrated to the QtNetwork module

Overall performance improvements

E specially in QtWebKit for faster web page rendering

Things Expected Later

QtOpenG L in Qt/S ymbian

Developer version of Q t 4.7.0 containing QtOpenG L already available however,

cannot be used for creating applications to be published in Ovi S tore!

New multimedia functionality

Phonon will be replaced by Multimedia of QtMobility

Nearly made it to Qt 4.7 already


202/204

202Qt for Mobile

y Q y

Quite a bunch of new QtMobility APIs

Qt Quick Designer (Dragndrop editor for QML) finalized

Qt Quick C omponents

QtWebkit constantly improved (HTML5 etc)

Qt Developer Offering

Qt

UI

Engine QtNetworkQtXml

QtGUI

QtCoreQtScript QtSql

QtSvg

QtXmlPatterns

QtWebkit

QtMultimedia

QtOpenGL

85% of

use cases

**

QtDeclarative

Qt Quick, Qt Quick C omponents


203/204

203Qt for Mobile

DesktopOSs

Symbian MeeGo

Symbian Linux

Qt Mobility APIs

Linux C /C ++libraries

O pen C / PO S IX

S ymbian C ++

MobileMobileMobileMobile

FeaturesFeaturesFeaturesFeatures

Low level

Native access

NativeAPIs

15% of

use cases

**

Thank You!


204/204

204Qt for Mobile

[email protected]

www.digia.com

Documents

QT for mobile