qt app development - cross-platform development for android, ios, windows phone and more!
TRANSCRIPT
![Page 1: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/1.jpg)
Andreas Jakl [@andijakl]mopius.com
Qt App Development
1 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Digia, Qt and their respective logos are trademarks of Digia Corporation in Finland and/or other countries worldwide.
![Page 2: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/2.jpg)
Andreas Jakl
• Startup founder & app developer
– @andijakl, @mopius
– mopius.com
• History
– Nokia: Technology Wizard
– FH Hagenberg, Mobile Computing: Assistant Professor
– Siemens / BenQ Mobile: Augmented Reality-Apps
2 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 3: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/3.jpg)
3 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
From Your Idea to the Store
Choose target market(s) for your appEurope, America, Africa, Asia, etc.
Select target platform(s)Andorid, iOS, Windows Phone, BlackBerry, Firefox OS
Choose development technologyHTML5, C++, C#, Java, ObjectiveC, Swift
Design, develop & test
Distribute... and get famous and rich!
![Page 4: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/4.jpg)
4 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Agenda
What? Why? Where? How? When? Now!
![Page 5: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/5.jpg)
5
Qt – What?
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 6: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/6.jpg)
Multi Screen
• Computing world today
– Laptop, Phones, tablets
– TV
– Car IVI
– Wearables
– Virtual and augmented reality
– Specialized devices
– etc.
6 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 7: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/7.jpg)
7 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Multi Platform App Development
Windows | Mac | Linux
Android | iOS | WinRT | BlackBerry* | Sailfish*
Embedded Linux | Embedded Android | Windows Embedded
Integrity | QNX | VxWorks
Native apps
Use operating system and its functions directly
(different code for networking, GPS, etc.)
* Community support only
![Page 8: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/8.jpg)
8 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Multi Platform App Development
Native appsUse operating system and its functions directly
(different code for networking, GPS, etc.)
Your App
Qt framework
Same code works on all platforms,
covers many usecases (GPS, etc.)
(if needed, direct access is still possible)
* Community support only
Windows | Mac | Linux
Android | iOS | WinRT | BlackBerry* | Sailfish*
Embedded Linux | Embedded Android | Windows Embedded
Integrity | QNX | VxWorks
![Page 9: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/9.jpg)
9 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 10: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/10.jpg)
10 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
What is Qt?
Developer
Publish to
– Windows
– Linux
– Mac
– Embedded
– Android
– iOS
– etc.
App Source Code
Using Qt SDK for
– Dev. environment
– Testing
– Translation
– Help
Using Qt framework for
– User Interface
– Networking
– Location (GPS)
– Web integration
– ...
![Page 11: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/11.jpg)
11 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Qt 5 Demo
www.youtube.com/watch?v=vhWS_bN-T3k
![Page 12: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/12.jpg)
12 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Qt 5.4
youtube.com/watch?v=wMs1pSZMnG0
![Page 13: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/13.jpg)
13
Qt – Why?
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 14: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/14.jpg)
Qt – What’s Inside?• Cross-Platform
– Same source code for 15 platforms
– Maximum performance – native apps!
• Generic
– User Interface
– Declarative UI, animation, gestures, multi-touch, 3D (OpenGL)
– Web (Chromium-based) & JavaScript engine included
– Multimedia (audio, video), Sensors, Bluetooth, Positioning
– Networking, XML
– SQL, files, app settings
– Container classes, object communication, threading, unit testing
– doc.qt.io/qt-5/qtmodules.html
• Extend– Include any 3rd party C++ library / code
14 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 15: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/15.jpg)
15 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Qt: On Your PC already!
… and many, many more!
All trademarks and logos are property of their respective owners.More information: http://www.qt.io/qt-in-use/http://lumiaconversations.microsoft.com/2011/03/15/10-qt-use-cases-you-didnt-know/
![Page 16: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/16.jpg)
16 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 17: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/17.jpg)
17 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
The Qt Company
Trolltech Nokia Digia Qt Company
(owned by Digia)
![Page 18: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/18.jpg)
18 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Qt.ioOne product. One ecosystem.
Integrates: qt-project.org and qt.digia.com
![Page 19: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/19.jpg)
19
Qt: Free vs. CommercialOpen Source
qt.gitorious.org
Qt can be used in commercial,
closed-source apps
Changes to Qt source
must be shared
Additional UI controls (charts, etc.)
More modules (Qt Quick Compiler, etc.)
More tools (profiling)
Support options
Free (LGPL v2.1 / v3 license) Commercial Licenses
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
qt-project.org/legal.html
![Page 20: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/20.jpg)
Qt Packages• Community
– open source
– GPL / LGPL (v2.1 -> v3)
• Indie Mobile
– commercial subscription, mobile platforms only
– €20 / month
• Professional
– commercial subscription, mobile + desktop
– €109 / month
• Enterprise
– perpetual commercial license, embedded + mobile + desktop, device creation
20 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 21: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/21.jpg)
Embedded & Internet of Things
• Increasing use of touch screens
• Need for simple to configure &
flexible stack
• Machine to Machine (M2M)
communication
21 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 22: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/22.jpg)
22 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Cross-Platform Alternatives
C#
Commercial
HTML5
(e.g., Apache Cordova)JavaScript
Open Source
many
more …
![Page 23: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/23.jpg)
23 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Number of Target Platforms
![Page 24: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/24.jpg)
24 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Top 10 App Quality
![Page 25: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/25.jpg)
25 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Time Savings
![Page 26: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/26.jpg)
26 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Cost Performance Ratio
![Page 27: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/27.jpg)
27
Qt – Where?
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 28: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/28.jpg)
28 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Technologies & Platforms
C++
OpenGL
QML
HTML5
CSS3
JavaScript
Windows
Mac
Linux
Embedded Linux
Embedded Android
Windows Embedded
Integrity
QNX
VxWorks
WinRT
Android
iOS
BlackBerry
Sailfish
![Page 29: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/29.jpg)
Android
• Full integration
– Android 2.3.3+ (API level 10)
– Originally based on community port
– Optional: Ministro
– Avoid multiple Qt installations on device
– Issues with Android 5.0
• Qt 5.2+
29 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 30: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/30.jpg)
iOS
• Full iOS support
– iPhone 3GS+
– iPad 2+
• Device deployment & publishing
– Qt Creator integration
– OS X & Xcode required
– iOS Developer Program membership required
• Qt 5.2+
30 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 31: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/31.jpg)
Qt on Windows Runtime• Compliant with Windows Store
– Windows 8.1+
– Windows Phone 8.1+
• Feature set
– Qt Essential modules
– Geopositioning
– Qt Quick Enterprise Controls
– Engin.io
– Qt Quick Compiler
– Multimedia
• Qt 5.4+
31 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 32: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/32.jpg)
BlackBerry 10
• Qt as major dev framework in BB10
– QNX Operating System
– Cascades UI framework (based on Qt 4.8)
– Qt 5 possible (as overlay for SDK)
32 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 33: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/33.jpg)
Jolla / Sailfish OS
• Smartphone OS
– Builds on MeeGo / Mer / Nemo foundation
33 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
jolla.com
sailfishos.org
![Page 34: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/34.jpg)
Ubuntu for Phones
• Apps: HTML5 and native (Qt)
– Qt 5 based
– QML toolkit
– www.ubuntu.com/phone
– developer.ubuntu.com/apps/qml/
34 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 35: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/35.jpg)
Symbian & Qt– Works on S60 3.1+
(E71, E72, 5800, N97, N8, X7, 700, 808, etc.) *
– Last Symbian phone: Nokia 808 PureView
– Qt 4.8
35 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
* Qt can be installed on all compatible devices. Not all devices are enabled for Qt content in the Nokia Store. Current list of Nokia Store device deployment support for Qt apps:
http://www.developer.nokia.com/Distribute/Packaging_and_signing.xhtml
Series 60
1.0
Series 60
2.0
(+ 3 FPs)
S60
3.0
S60
3.1
S60
3.2
S60 5.0
=
Symbian^1
Symbian^2 Symbian^3
Qt Compatibility
Nokia E71(S60 3.1, 2008)
Qt Pre-Installed
Nokia 700(Nokia Belle, 2011)
Symbian Anna
Nokia Belle
Deprecated
(only Qt 4)
![Page 36: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/36.jpg)
Harmattan
• Open Source Linux for Mobile Computers
– Based on Maemo and MobLin
→ transformed to Tizen by Samsung
(HTML5-based apps)
• Nokia N9
– MeeGo 1.2 Harmattan
– Only product with OS
36 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Deprecated
(only Qt 4)
![Page 37: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/37.jpg)
Raspberry Pi
• Qt 5 runs on Raspberry Pi
– $25 / $35 hardware
– 3D-accelerated Qt Quick, 60 FPS
– www.raspberrypi.org
37 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 38: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/38.jpg)
Qt for Device Creation
38 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
* http://qt.digia.com/QtEnterpriseEmbedded
![Page 39: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/39.jpg)
Qt for Device Creation
39 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
• 2D Renderer for devices without
OpenGL
• Wayland for multi-process support
• Qt Creator deployment + wizard for
flashing device images
• Virtual keyboard
blog.qt.digia.com/blog/2014/07/04/making-an-android-
device-boot-to-qt/
![Page 40: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/40.jpg)
Qt for Device Creation
40 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
* http://qt.digia.com/QtEnterpriseEmbedded
![Page 41: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/41.jpg)
Qt Cloud Services
41 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
• Backend as a service
+ Platform as a service
– APIs to store & retrieve cloud data
– Included server maintenance,
load balancing & backup
– Server-side dev possible
– C++ & QML support, REST access
• https://qtcloudservices.com/
![Page 42: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/42.jpg)
Qt Cloud Services
42 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 43: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/43.jpg)
Qt WebEngine• Module for embedding web contents
– Simple to create a fully functional
browser
– Full support for Qt Widgets and
Qt Quick
– Great performance
– Full compliance with latest web
standards
• LGPLv3 or commercial
43 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 44: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/44.jpg)
44
Qt – How?
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 45: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/45.jpg)
Developer Environment Setup
• One-click installation
– IDE
– Tool-chains
– Documentation
– Examples
45 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Compiler
Qt SDKworks on
Windows,
Linux, Mac
Tool-Chain
DocumentationIDE
Examples
![Page 46: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/46.jpg)
Qt Creator• Complete IDE
– C++, QML, JavaScript
– Same dev experience for all platforms
• Development
– One-click deployment to desktop, iOS, Android, WP
– Syntax highlighting, autocompletion
– UI Designer
– Static code analyser
– Profiler
46 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 47: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/47.jpg)
47 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Start: Application UIC++ QML / JavaScript
HTML / JavaScript / CSS Other
QWidgets QPainter
OpenGLQtWebengine
All these can be mixed in the same app if needed
Qt Quick Qt Quick Controls
![Page 48: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/48.jpg)
QWidgets
• UI Elements (QLabel, QPushButton, etc.)
– Use platform UI design
– Support style sheets
– Drag & drop UI designer
48 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Great for desktop.
Static layouts make effects difficult.Small UI, different interaction paradigms.
![Page 49: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/49.jpg)
QPainter
• Low level 2D paining engine
– Forms, gradients, transparency, transforms
– QGraphicsView: scene graph for 2D scene
management
49 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Well-known conceptsFull and direct control over appearance
No ready-made common UI components availableDevelopment focus on Qt Quick
![Page 50: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/50.jpg)
Qt Quick
• Qt Quick
– QML language and JavaScript
– Declarative syntax, animations and states
– Drag & drop UI designer
50 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Very easy to make slick, fluid UIs.Most important for mobile devices!
Still different UI controls for some platforms (Blackberry)
* Project page: https://bugreports.qt-project.org/browse/QTCOMPONENTS
![Page 51: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/51.jpg)
Qt Quick Controls
51 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
• QML UI controls
– Native look and feel
– Custom design: Style API
• Layout managers
![Page 52: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/52.jpg)
OpenGL
• Low level
– Basic setup provided by Qt
– Includes OpenGL ES 3.0 / 3.1
– Or: integration with QtQuick
52 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Complete control over GLGood if you have existing codebase & assets, cross-platform
Pure OpenGL is hard work
Angry Birds and Bounceby Rovio
![Page 53: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/53.jpg)
Qt Webengine• Open source browser engine
– Display HTML(5) and JavaScript
– Combine Qt QML / C++ and web code if needed to get best of both worlds
• Qt WebView: embed native web view on Android & iOS
53 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Use your existing web skills to create the UIReuse web components (online help, etc.)
Complex UIs and interaction probably more difficultLess performance than native code (but improving)
![Page 54: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/54.jpg)
54 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Recommendations ...
QPainter
Qt Quick
OpenGL
Web
QWidgets
Desktop App Mobile App Game
Recommended
OK
Not recommended
![Page 55: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/55.jpg)
55 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Hello World
#include <QApplication>
#include <QPushLabel>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QLabel helloLabel("Hello World");
helloLabel.setAlignment(Qt::AlignCenter);
helloLabel.showMaximized();
return app.exec();
}
import QtQuick 2.4
Rectangle {
width: 360
height: 360
Text {
anchors.centerIn: parent
text: "Hello World"
}
}
~ 300 lines of code,
~ 15 files
Native Symbian C++
Qt C++
Qt Quick
QML language
![Page 56: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/56.jpg)
QML• Describe UI by tree structure of
property bindings
– Properties dynamically
evaluated
– Communication through
signals & slots
– Bindings to C++ code
possible
– Animate properties using
states and transitions
56 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
import QtQuick 2.4Rectangle {
width: 200height: 200Image {
source: "QtLogo.png"anchors.centerIn: parent
} }
![Page 57: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/57.jpg)
QML
• Interactivity
– Interact with
mouse / touch
– Execute JavaScript in
signal handlers
57 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
import QtQuick 2.4Rectangle {
width: 200height: 200Image {
source: "QtLogo.png"anchors.centerIn: parent
} MouseArea {
anchors.fill: parentonClicked: parent.color = "green"
} }
![Page 58: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/58.jpg)
QML
• Dynamic property update
– Move image with mouse
58 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
import QtQuick 2.4Rectangle {
width: 200height: 200Image {
source: "QtLogo.png"x: myMouse.mouseXy: myMouse.mouseY
} MouseArea {
id: myMousehoverEnabled: trueanchors.fill: parentonClicked: parent.color = "green"
} }
![Page 59: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/59.jpg)
QML
• Qt Quick Controls
– Native-looking UI
controls
– Custom styling possible
– Not 100% cross-platform
(e.g., Blackberry: own UI)
59 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
import QtQuick 2.3
import QtQuick.Controls 1.2
ApplicationWindow {
title: "My Application"
Button {
text: "Push Me"
anchors.centerIn: parent
}
}
![Page 60: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/60.jpg)
60 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Qt Quick & Qt C++
Quick Prototype
Viewer on PC & mobile: Testing 100% pure QML directly
Deployable App
Qt C++ app to load and show QML
Can include C++ for app logic
![Page 61: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/61.jpg)
61
Qt – When?
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 62: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/62.jpg)
Timeline• Qt 5.4
– December 10th, 2014
– http://qt-project.org/wiki/Qt-5.4-release
• Qt 5.4.1
– Bug-fix release
– https://bugreports.qt-project.org/browse/QTBUG/fixforversion/14400
• Qt 5.5
– April 28th, 2015
– Bluetooth (LE) on Windows RT, iOS
– In-App Purchasing on Windows RT
– Native dialogs and more pop-ups on iOS
– Improved QML/JS <> C++ integration
– New garbage collector
– http://qt-project.org/wiki/Qt-5.5-release
– https://bugreports.qt-project.org/browse/QTBUG/fixforversion/14200
• Qt 6.0
– https://bugreports.qt-project.org/browse/QTBUG/fixforversion/12127
62 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 63: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/63.jpg)
63
Qt – Now!
Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 64: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/64.jpg)
64 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Download
qt.io/download/
![Page 65: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/65.jpg)
Where to find help?
• Qt SDK
– Help, examples
• Discussion boards, wikis
– Qt Project: qt-project.org
• Community
– www.qtcentre.org
65 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
![Page 66: Qt App Development - Cross-Platform Development for Android, iOS, Windows Phone and more!](https://reader030.vdocuments.us/reader030/viewer/2022032421/55a6953b1a28ab6d148b465b/html5/thumbnails/66.jpg)
Thank You.
66 Qt App Development v6.0.0 January 27, 2015 © 2015 Andreas Jakl mopius.com
Andreas Jakl [@andijakl]mopius.com