QML across all UI Stacks Support for Widgets Kevin Krammer and - - PowerPoint PPT Presentation

▶
qml across all ui stacks support for widgets
SMART_READER_LITE
LIVE PREVIEW

QML across all UI Stacks Support for Widgets Kevin Krammer and - - PowerPoint PPT Presentation

Jan 06, 2023 32 likes •292 views

QML across all UI Stacks Support for Widgets Kevin Krammer and Tobias Knig KDAB Agenda Motivation for DeclarativeWidgets Demo of pure QML Widget UI Porting From designer/C++ UI to QML Adding a BB10/Cascades UI Q&A

slide-1
SLIDE 1

QML across all UI Stacks Support for Widgets

Kevin Krammer and Tobias König KDAB

slide-2
SLIDE 2

Agenda

  • Motivation for DeclarativeWidgets
  • Demo of pure QML Widget UI
  • Porting

– From designer/C++ UI to QML – Adding a BB10/Cascades UI

  • Q&A
  • Resources
slide-3
SLIDE 3

Motivation

slide-4
SLIDE 4

Situation

  • Widgets

– Widely used, well understood – Static UI, compiled code – Often tightly coupled with core logic

  • QML

– Relatively new, misunderstood as QtQuick – Runtime loadable, adjustable – Encourages separation core/UI

slide-5
SLIDE 5

Goal

  • Widgets with QML

– No user-visible change – Apply existing developer knowledge – Core independent of UI – UI replaceable

  • QtWidgets -> QtWidgets (update/customize)
  • QtWidgets -> QtQuick
  • QtWidgets -> Cascades
slide-6
SLIDE 6

Declarative Widgets

Demo

slide-7
SLIDE 7

WaterLevel

slide-8
SLIDE 8

Porting

  • Step 1: Declarative Widgets

– Create QML files for windows/dialogs – Make core API exposable

  • Step 2: Mobile UI

– Create QML files for target platform – Re-use core API from Step 1

slide-9
SLIDE 9

Step 1

Demo

slide-10
SLIDE 10

Step 1

Final Result

slide-11
SLIDE 11

Step 2

Demo

slide-12
SLIDE 12

Step 2

Final Result

slide-13
SLIDE 13

Q&A

Thank you for your attention! Any Questions?

  • https://github.com/KDAB/DeclarativeWidgets
  • Free Software / Open Source Software
  • Works with Qt4
  • Work in progress

kevin.krammer@kdab.com, tobias.koenig@kdab.com

slide-14
SLIDE 14

QML across all UI Stacks Support for Widgets

Kevin Krammer and Tobias König KDAB

slide-15
SLIDE 15

Agenda

  • Motivation for DeclarativeWidgets
  • Demo of pure QML Widget UI
  • Porting

– From designer/C++ UI to QML – Adding a BB10/Cascades UI

  • Q&A
  • Resources
slide-16
SLIDE 16

Motivation

slide-17
SLIDE 17

Situation

  • Widgets

– Widely used, well understood – Static UI, compiled code – Often tightly coupled with core logic

  • QML

– Relatively new, misunderstood as QtQuick – Runtime loadable, adjustable – Encourages separation core/UI

slide-18
SLIDE 18

Goal

  • Widgets with QML

– No user-visible change – Apply existing developer knowledge – Core independent of UI – UI replaceable

  • QtWidgets -> QtWidgets (update/customize)
  • QtWidgets -> QtQuick
  • QtWidgets -> Cascades
slide-19
SLIDE 19

Declarative Widgets

Demo

slide-20
SLIDE 20

WaterLevel

slide-21
SLIDE 21

Porting

  • Step 1: Declarative Widgets

– Create QML files for windows/dialogs – Make core API exposable

  • Step 2: Mobile UI

– Create QML files for target platform – Re-use core API from Step 1

slide-22
SLIDE 22

Step 1

Demo

slide-23
SLIDE 23

Step 1

Final Result

slide-24
SLIDE 24

Step 2

Demo

slide-25
SLIDE 25

Step 2

Final Result

slide-26
SLIDE 26

Q&A

Thank you for your attention! Any Questions?

  • https://github.com/KDAB/DeclarativeWidgets
  • Free Software / Open Source Software
  • Works with Qt4
  • Work in progress

kevin.krammer@kdab.com, tobias.koenig@kdab.com