© 201 3 Digi a

Qt Quick Tooling

How to the most out of Quick

1 © 201 3 Digi a Kai Köhne

● Long time Qt Developer ● (and KDE user) – Designer ● [email protected] – QML – QML Profiler ● kkoehne on freenode ● Installer Framework

● MinGW installer

● Qt 5 Release Team

2 © 201 3 Digi a Goals

● Let you know what's there

● Get feedback

● Hope: KDE embraces & extends tooling infrastructure

3 © 201 3 Digi a Overview

GUI (Qt Creator) Command Line Coding QML/JS Editor Qt Quick Designer QML Debugger Console APIs Inspector Console Profiling QML Profiler Console APIs qmlprofiler Deploying Application Templates qmlbundle qmlmin

4 © 201 3 Digi a Coding

● Qt Creator ● / KDevelop

● Plasmate – Semantic Checks – Code Navigation – – Qt Quick Designer

5 © 201 3 Digi a Coding - .qmltypes files

● Metadata about types in ++ plugins

● Should be part of every deployed plugin

– qmlplugindump -notrelocatable MyModule 1.0 – Good way to check for API changes!

6 © 201 3 Digi a Coding - Qt Quick Designer

● Write self-contained elements

● Prefer declarative style

● Expect different API usages in C++ types

7 © 201 3 Digi a Debugging

● Environment variables ● JS API

– QT_DEBUG_PLUGINS – console.log()

– QML_IMPORT_TRACE ● JS API - Qt 5 – ... – console.log(), console.warn(), console.error(), console.assert() ... (grep for – console.trace() BOOL_CONFIG_OPTION) – console.exception() – console.count()

8 © 201 3 Digi a Debugging – Qt Creator

● JS Debugger ● QML Inspector

, stepping, variable – Objects & Properties inspection ... – (->GammaRay) – Mixed with C++ debugger or standalone ● Inspector tools

– Apply on Save – Select/Zoom

● JS Console

9 © 201 3 Digi a Debugging – Remote API

● Qt Creator debugger/profiler needs in-process functionality

● Enable TCP Server:

– Compile with QT_DECLARATIVE_DEBUG define (Qt Quick 1) – Compile with QT_QML_DEBUG define (Qt Quick 2) – Qt qmltooling/ plugins required at runtime

● Application is started with '-qmljsdebugger=port:XXX,block'

● Protocol is extensible!

10 © 201 3 Digi a Profiling

● Qt Creator QML Profiler ● Environment Variables

– QML engine state – QML_SHOW_FRAMERATE (Qt 4)

● Painting (Qt 5: Animations) – QSG_RENDER_TIMING (Qt 5)

● Compiling ● JS API (Qt 5) ● Creating – ● Binding console.time(), console.timeEnd()

● Handling Signal – console.trace(), console.traceEnd() – Debug binding loops ● qmlprofiler command line tool – Check for optimized bindings – Qt 5: V8 sample based profiler

11 © 201 3 Digi a Deployment

● Different paradigms ● qmlmin (Qt 5)

– Viewer vs standalone ● qmlbundle (Qt 5) – Files vs Qt resouces vs bundles – ...

● One topic for the QtCS :)

12 © 201 3 Digi a

Thank you!

www.qt.digia.com (btw, we're hiring ;)