Qt App Development for Symbian & MeeGo

From Your Idea to the Store Distribute: Nokia Store … and get famous and rich! Design, develop & test Choose development technology Qt, Web, Java, Silverlight, XNA Select target platform(s) Symbian, MeeGo, Series 40, Windows Phone Choose target market(s) for your app Europe, America, Africa, Asia, etc.2 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Multi Platform App Development Native apps Use operating system and its functions directly (different code for networking, GPS, etc.) Operating System Symbian, MeeGo, Windows, Mac OS, Linux6 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Multi Platform App Development (if needed, direct access is still possible) Your App Native apps Qt framework Use operating system and itson all platforms, Same code works functions directly (different codemany usecases (GPS, etc.) covers for networking, GPS, Operating System Symbian, MeeGo, Windows, Mac OS, Linux7 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

What is Qt? Using Qt SDK for – Dev. environment – Testing – Translation Publish to – Help – Nokia Store (Symbian, MeeGo) Developer App Source Code – Windows – Linux Using Qt framework for – Mac – User Interface – Embedded – Networking – Location (GPS) – Web integration – …8 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt – What’s Inside?• Cross-Platform • Mobile focus – Same source code for multiple platforms – Location, Maps – Maximum performance – native apps! – Sensors• Generic – Messaging (SMS, email) – User Interface – Contacts, Calendar – Declarative UI, animation, gestures, – Camera multi-touch, 3D (OpenGL) – System information – WebKit & JavaScript engine included – Haptics (vibration) – Multimedia (audio, video) • Extend – Networking, XML – Include any 3rd party C++ library / code – SQL, files, app settings – Container classes, object communication, threading, unit testing 23 modules, ~ 800 classes, ~ 9000 functions 10 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt: On Your PC already! … and many, many more!11 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl All trademarks and logos are property of their respective owners. More information: http://qt.nokia.com/qt-in-use http://conversations.nokia.com/2011/03/15/10-qt-use-cases-you-didnt-know/

Qt App Publishing: The Price. Developer resources & community Nokia Store publishing Discussion boards, e-learning videos, Nokia Publish registration 9 million DL / day 190+ countries examples One-time fee of €1 121x operator billing Submit an unlimited number of appsComplete Qt development environment SDK, toolchain, remote device testing, etc. Total: 12 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt: Free vs. Commercial Open Source qt.gitorious.org Free (LGPL license) Commercial License Qt can be used in commercial, closed-source apps Changes to Qt source must be shared Tech support available Included support13 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Technologies & Platforms Windows C++ Mac OS OpenGL Linux / X11 QML Embedded Linux HTML5 Windows CE CSS3 MeeGo / Maemo JavaScript Symbian15 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Symbian & Qt Nokia E71 (S60 3.1, 2008) Nokia 700 (Symbian Belle, 2011) – Works on S60 3.1+ (E71, E72, 5800, N97, N8, X7, 700, etc.) * – Look up platform versions: http://www.developer.nokia.com/Devices/ Qt Compatibility Qt Pre-Installed Series 60 Series 60 S60 S60 S60 S60 5.0 Symbian^2 Symbian^3 1.0 2.0 3.0 3.1 3.2 = Symbian Anna (+ 3 FPs) Symbian^1 Symbian Belle …* Qt can be installed on all compatible devices. Not all devices are enabled for Qt content in the Ovi Store. Current list of Ovi Store device deployment support for Qt apps:http://www.developer.nokia.com/Distribute/Packaging_and_signing.xhtml 16 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

• Open Source Linux for Mobile Computers – Based on Maemo and MobLin – Developed by Nokia and Intel – Hosted by the Linux Foundation – www.meego.com• Nokia N9 – MeeGo 1.2 Harmattan17 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Desktop Developer → Qt Mobile?• Qt is the same on all platforms, but: – New UI concepts for mobile devices – Touch screen, limited screen space – Be careful – Network speed, roaming, battery – More possibilities – GPS, accelerometer, compass, haptics, multitouch• Platform-specific knowledge – Mainly hidden – A few concepts shine through – Security system (Symbian: capabilities, signing) – Need to use native operating system APIs when Qt doesn’t provide the functionality 18 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Symbian Developer → Qt?• You’ll love Qt! – Easier setup – 1-click installation (Qt SDK) – Hides complexity – No descriptors, cleanup stack, two-phase construction, active objects – Less code, more efficiency Nokia 7650 (2001) Nokia’s first Symbian phone – Expand the reach – Deploy your app not only to Symbian, but also to MeeGo and other platforms19 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Android / iPhone Developer → Qt?• Expand your reach – Reach different market segment – Nokia: 30.8% global market share (Q4 2010, IDC)• Porting – Web: supported by all manufacturers – Native apps: different programming languages• Porting Guidelines – http://wiki.forum.nokia.com/index.php/Porting_Mobile_Applications_to_Qt20 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Generic Porting• Keep your assets – Reuse images, sound & music• Screen resolution iPhone <= 3 480 x 320 3:2 iPhone 4 960 x 640 3:2 Nexus S 800 x 480 5:3 Samsung Galaxy S 800 x 480 5:3 Windows Phone 7 800 x 480 5:3 Symbian^1 & 3 640 x 360 Nokia N900 800 x 480 5:3 16:9 aspect ratio Nokia N9 / N950 854 x 48021 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Web Apps Qt 4.7 App with embedded WebKit browser Engine: WebKit (latest version, great HTML 5 support) Both support: Dev. environment: Qt SDK – Storage of content on the device (HTML, CSS, JavaScript, Images) Nokia Web Runtime (WRT) – Menu icon Engine: WebKit (earlier version, – Access to device same as phone browser) features Dev. environment: Aptana Studio / Nokia Web Tools22 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Native Apps Rewriting your source code Android is always required Java (parts in C++ possible) Eclipse Native OpenGL ES 2.0 is supported on all platforms, but steep learning curve and more effort! Nokia (Symbian & MeeGo) C++ iOS Qt SDK Objective C Xcode23 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Developer Environment Setup• Qt SDK 1.1.2 Maemo – One-click installation – IDE, toolchains, Desktop Simulator documentation, examples Qt SDK – http://developer.nokia.com/Qt works on Windows, Linux, Mac Symbian MeeGo25 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Symbian – Mac / Linux• Symbian binaries cannot be compiled on Mac or Linux * – Legacy Symbian tool chain restriction• Use Remote Compiler instead – Compilation done on Nokia servers in the cloud – Compiler log messages displayed in real-time in Qt Creator – Binaries delivered back to you• Enable Remote Compiler during SDK installation or later using the SDK maintenance tool – Found under the “Experimental” section 26 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * Experimental Linux support for building Symbian apps: http://projects.forum.nokia.com/symbian_linux_qtsdk

Qt SDK: Simulator• Efficient Testing – Quick launch – Scripting possibilities – Using JavaScript – Simulate mobile environments – Location, contacts, etc. – Simulate phone events – Battery, messages, etc. – Skins for different platforms / form-factors – Resolutions, orientation, etc.27 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Start: Application UI C++ QML / JavaScript QWidgets Graphics View Qt Quick All these can be mixed in the same app if needed HTML / JavaScript / CSS Other Platform QtWebKit QtOpenGL OpenGL28 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Widgets• UI Elements (QLabel, QPushButton, etc.) – Use platform UI design – Support style sheets – Drag & drop UI designer Great for desktop. Static layouts make effects difficult. Small UI, different interaction paradigms.29 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Graphics View• Manage 2D scenes with a scene graph – Can manage thousands of items with hierarchies – Collision detection, affine transformations, drag and drop support – Hardware acceleration and integration with QWidget possible High level Conceptually nice and flexible No ready-made common UI components available Qt 5 development focus on Qt Quick30 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Quick• Qt Quick – QML language and JavaScript – Declarative syntax, animations and states – Drag & drop UI designer Very easy to make slick, fluid UIs. Most important for mobile devices! UI components for desktop still experimental31 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * Project page: http://bugreports.qt.nokia.com/browse/QTCOMPONENTS

OpenGL• Very low level – Basic setup provided by Qt Angry Birds and Bounce by Rovio Complete control over GL Good if you have existing codebase & assets, cross-platform OpenGL is hard work (but there’s more Qt coming for that *)32 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * Project page: http://doc.qt.nokia.com/qt-quick3d-snapshot/index.html

QtWebKit• Open source browser engine – Display HTML(5) and JavaScript – Combine Qt QML / C++ and web code if needed to get best of both worlds Use your existing web skills to create the UI Reuse web components (online help, etc.) Complex UIs and interaction probably more difficult Less performance than native code (but improving)33 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Platforms and UIs Qt Quick Qt Quick Widgets Direct graphics HTML (5) Components (OpenGL, GraphicsView)Symbian^3 / AnnaSymbian^1 / S60 5.0S60 3.1 / 3.2 (non-touch)MeeGo HarmattanMaemo 5Desktop 35 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Hello World Qt QuickNative QtSymbian C++~ 300 lines of code, #include <QApplication> import QtQuick 1.0~ 15 files #include <QPushLabel> Rectangle { int main(int argc, char *argv[]) width: 360 { height: 360 QApplication app(argc, argv); QLabel helloLabel(“Hello World”); Text { helloLabel.setAlignment(Qt::AlignCenter); anchors.centerIn: parent helloLabel.showMaximized(); text: “Hello World” } return app.exec(); } } QML language 36 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

User Interfaces with Qt Quick• Most cross-platform – Design and create any custom user interface – Same resolution: pixel precise on desktop, Symbian and MeeGo Maemo / MeeGo Windows 7 Symbian^3 Simulator37 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

QML import QtQuick 1.0 Rectangle { width: 200• Describe UI by tree structure height: 200 Image { of property bindings source: “QtLogo.png” – Properties dynamically anchors.centerIn: parent evaluated } } – Communication through signals & slots – Bindings to C++ code possible – Animate properties using states and transitions38 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

QML import QtQuick 1.0 Rectangle { width: 200 height: 200• Interactivity Image { source: “QtLogo.png” – Interact with anchors.centerIn: parent mouse / touch } MouseArea { – Execute JavaScript in anchors.fill: parent onClicked: parent.color = “green” signal handlers } }39 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

QML import QtQuick 1.0 Rectangle { width: 200 height: 200• Dynamic property update Image { source: “QtLogo.png” – Move image with mouse x: myMouse.mouseX y: myMouse.mouseY } MouseArea { id: myMouse hoverEnabled: true anchors.fill: parent onClicked: parent.color = “green” } }40 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Quick & Qt C++ Quick Prototype Deployable App Viewer on PC & mobile: Qt C++ app to load and show QML Testing 100% pure QML directly Can include C++ for app logic E.g., created by Flowella, Photoshop export41 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Quick Components• Simplify building rich UIs with Qt Quick – Provides widgets for Qt Quick – title bar, actions, list items, buttons, etc. – Styles to integrate with native look & feel• More Info – Symbian^3 & MeeGo Harmattan http://labs.qt.nokia.com/2011/07/06/ready-made-ui- building-blocks-at-your-service-qt-quick-components-for- symbian-and-meego-1-2-harmattan/ – Desktop research project http://labs.qt.nokia.com/2011/03/10/qml-components-for- desktop/ 42 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * http://bugreports.qt.nokia.com/browse/QTCOMPONENTS

Qt Quick Components import QtQuick 1.0 import com.nokia.symbian 1.0 Window { id: window StatusBar { anchors.top: window.top } Button { text: “Click me” anchors.centerIn: parent } ToolBar { anchors.bottom: window.bottom tools: ToolBarLayout { ToolButton { flat: true iconSource: “toolbar-back” onClicked: Qt.quit() } } } }43 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Common API• Components match native look & feel – Separate implementation for Symbian and MeeGo: – import com.nokia.symbian 1.0 – import com.meego 1.0 – Platform-specific extensions: extend common API – e.g., Button:platformPressAndHold on Symbian – Platform-specific components: only for single platform – e.g., TabBar for Symbian-themend container of tab buttons• Compatibility – Common API definition for both platforms * – But: still experimental state! – import Qt.labs.components.native 1.0 44 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * http://bugreports.qt.nokia.com/browse/QTCOMPONENTS-200

SDK Examples Components Gallery flickr Music Player45 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl http://doc.qt.nokia.com/qt-components-symbian-1.0/qt-components-examples.html

Qt Mobility Mobility 1.1 Mobility 1.0 Camera Bearer Management API Document Gallery Contacts Feedback Location Landmarks Messaging Maps/Navigation Multimedia Organizer Publish and Subscribe Service Framework – Out of process Service Framework Mobility 1.2 – final for MeeGo, Sensors upcoming for Symbian System Information Versit Connectivity (Bluetooth, NFC)46 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Versions for SymbianQt 4.7 Qt SDK 1.1 *(Qt Quick) Symbian AnnaQt 4.6 Nokia Qt SDK 1.0 Symbian^3 No Qt Symbian^1 S60 3.1 S60 3.2 S60 5.0 48 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * Qt SDK 1.1 also includes a Qt 4.6.3 target for Symbian^1 and Symbian^3

Qt Support in the Nokia Store * Symbian^3 / Anna S60 5th Edition S60 3rd Edition (Qt 4.6) MeeGo / Maemo E7-00 X6-00 E72 N900 (>= PR1.3) N8-00 C6-00 E71 N9 C7-00 / Astound / Oro C5-03 E66 C6-01 N97 (mini) E63 E6-00 5800 XpressMusic E52 X7-00 5530 XpressMusic 5250 5235 5233 5230 522849 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl * Status: 24. August 2011. Source: http://www.developer.nokia.com/Distribute/Packaging_and_signing.xhtml#article1_a

Symbian: Smart Installer Qt Install App (& SI) Required Qt version not already installed? Download and install Qt & dependencies http://wiki.forum.nokia.com/index.php/Nokia_Smart_Installer_for_Symbian50 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Nokia Store Access reports. You get 70%, Nokia 30%. (Operator billing: 60/40) Quality Assurance. Create content items. Add meta data. Register at publish.ovi.com (one-time fee of €1)53 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Nokia Store Statistics190+ countries, 32 languages9 million downloads / day135+ device models supportedOperator billing with 121 operatorsin 42 countries (credit card: 170 countries)http://www.developer.nokia.com/Distribute/Ovi_Store_statistics.xhtml54 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Where to find help?• Qt SDK – Help, examples• Discussion boards, wikis – Nokia Developer: http://developer.nokia.com/ – Qt Developer Network: http://developer.qt.nokia.com/• e-Learning materials – http://qt.nokia.com/developer/learning/online/training/ – http://qt.nokia.com/services-partners/qt-in-education/qt-in-education-course- material• Community – http://www.qtcentre.org/ 55 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Qt Books (some recommendations) Beginning Nokia Apps Development Ray Rischpater, Daniel Zucker. Apress. Complete end-to-end story of developing for Symbian and MeeGo with Qt (Quick) and HTML 5. Status: Qt 4.7, December 2010 Foundations of Qt Development Johan Thelin. Apress. More in-depth and technically oriented explanation of Qt – different approach to many other books. Generic Qt, no mobile. Status: 2007 C++ GUI Programming with Qt 4 (2nd edition) Jasmin Blanchette, Mark Summerfield. Prentice Hall. Official book for generic Qt development (no mobile). Good for looking things up or for enhancing your knowledge, average for learning from scratch. Status: Qt 4.3, 200856 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Nokia Certified Qt Developer• Official accreditation for individual developers – Confirms your development skills in Qt – Become more attractive in the job market! – Qt Essentials exam: 50 multiple choice questions, 60 minutes – Qt Advanced exams: widgets and C++57 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Nokia Developer Champion & Qt Ambassador• Active community member? – Be even more involved, improve your network and get rewarded! – Nokia Developer Champion http://www.developer.nokia.com/Community/Champions/ – Qt Ambassador http://qt.nokia.com/qt-in-use/ambassadors/qtambassador/58 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Universities• Qt is a good way to teach software development – Instant results to motivate attendees – Graphical tools make entry easier – Flexible system, extensible with own libraries – … and still standard C++!• University support – Free Qt course materials under Creative Commons (PPT and OpenOffice) http://qt.nokia.com/learning/education/course-materials – Nokia Developer University support http://www.developer.nokia.com/Developer_Programs/Nokia_Developer_for_uni versities/ 59 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Your Feedback Counts!• Not happy with the way something works? Found a bug? – Submit your Qt bug report or suggestion to: http://bugreports.qt.nokia.com/ – Unsure about what to include? The guide is here: http://developer.qt.nokia.com/wiki/ReportingBugsInQt – Found a bug somewhere outside of Qt? Report it here: http://www.developer.nokia.com/Support/ – Also go to the above URL to buy a commercial support ticket if needed! 60 © 2011 Nokia Qt App Development v. 3.4.1 August 24, 2011 Andreas Jakl

Source Slide Share