SlideShare una empresa de Scribd logo
1 de 13
Descargar para leer sin conexión
vitali.pe@gmail.com
vitali.p@volicon.com

QT Graphics View Framework
[vitali]: ~/qt-secene-demos/ >> python cool_intro.py
Traceback (most recent call last):
File "PySideexamplesopengloverpainting.py", line 198, in paintEvent
self.resizeGL(self.width(), self.height())
File "PySideexamplesopengloverpainting.py", line 227, in resizeGL
glViewport(((width - side) / 2), ((height - side) / 2), side, side)
ctypes.ArgumentError: argument 1: <class 'TypeError'>: wrong type
Traceback (most recent call last):
File "PySideexamplesopengloverpainting.py", line 198, in paintEvent
self.resizeGL(self.width(), self.height())
File "PySideexamplesopengloverpainting.py", line 227, in resizeGL
glViewport(((width - side) / 2), ((height - side) / 2), side, side)
ctypes.ArgumentError: argument 1: <class 'TypeError'>: wrong type
Soo... QGraphicsScene..
Basically it’s a canvas library on (a lot of) steroids.

Features:
Model/View Architecture.
It’s own event system (not signals & slots)
Low level rendering (with QPainter)
Input Handling (mouse & keyboard)
Simple animation
Support for embedding QWidgets
Collision detection
Drag & Drop
….
Demo App
https://bitbucket.org/vitalipe/sggle/wiki/Home
Architecture Overview
Only 3 Basic components item(s), that are added to the scene,
and one or more views to display the
scene.

View

View

Graphics Scene

Item
Item

VIew
Item
This is the actual QWidget, that is added to
your layout...

Item
Item
First, lets talk about rendering widgets in QT

●
●
●

Widget render themselves by overriding paintEvent()
QT uses the “painter's algorithm”
Any Widget can be hardware accelerated.

paintEvent()

1
paintEvent()

2

3
paintEvent()

4
paintEvent()
Ok… so what about graphics scene?
The graphics scene, has a different more flexible
and optimized API for drawing and transforms , but
the same principle apply….
1
2
Also up until QT 5 , QML widgets where
implemented on top of QGraphicsView

3

4
Rendering in Qt 4.8
QML
Via QGraphicsView

Qt Webkit

QWidget

QPainter

OpenGL
Renderer

Software
Renderer
Rendering in Qt 5

QML

Qt Webkit

QWidget

QPainter

SceneGraph

OpenGL
Renderer

Software
Renderer
Why? you ask...
Well… because painter’s algorithm will fuckup any
OpenGL based rendering pipeline!

QML

Z-Buffering FTW!
SceneGraph

Yes you can get away with it on desktops when
you're not developing AAA games… but Qt Quick
is for moblie remember ?

OpenGL
Renderer
The Item, View & Scene

QGraphicsScene:
●
●
●
●

itemAt(x : float, y : float)
addItem(item : QGraphicsItem)
addPixmap( pixmap : QPixmap)
selectedItems()
...

Providing an interface for managing items
Propagating events to each item
Managing item state, such as selection and focus handling
Providing (untransformed) rendering functionality.
The Item, View & Scene

QGraphicsItem:
●
●
●
●
●
●

setPos(pos : QPointF)
setTransform(t : QTransform)
setEnabled( enabled : bool)
childItems()
...

Mouse and keyboard input events
Drag and drop
Parent-child relationships.
Collision detection.
Has many many built-in sub types
If you want to implement layers effects, etc… you need a custom item
The Item, View & Scene

QGraphicsView:
●
●
●
●
●

mapFromScene(pos : QPointF)
mapToScene(pos : QPointF)
centerOn(pos : QPointF)
setTransform(t : QTransform)
...

Visualizes the contents of a scene.
Is a subclass of QWidget
A scene can have multiple views attached to it.
Translates keyboard and mouse events to scene events
Has it’s own transform matrix.
Questions ?

Más contenido relacionado

La actualidad más candente

Necessitas - Qt on Android - from FSCONS 2011
Necessitas - Qt on Android - from FSCONS 2011Necessitas - Qt on Android - from FSCONS 2011
Necessitas - Qt on Android - from FSCONS 2011
Johan Thelin
 
Efficient Graphics with Qt
Efficient Graphics with QtEfficient Graphics with Qt
Efficient Graphics with Qt
Ariya Hidayat
 

La actualidad más candente (18)

Meet the Widgets: Another Way to Implement UI
Meet the Widgets: Another Way to Implement UIMeet the Widgets: Another Way to Implement UI
Meet the Widgets: Another Way to Implement UI
 
Special Effects with Qt Graphics View
Special Effects with Qt Graphics ViewSpecial Effects with Qt Graphics View
Special Effects with Qt Graphics View
 
Qt for Beginners Part 3 - QML and Qt Quick
Qt for Beginners Part 3 - QML and Qt QuickQt for Beginners Part 3 - QML and Qt Quick
Qt for Beginners Part 3 - QML and Qt Quick
 
QThreads: Are You Using Them Wrong?
QThreads: Are You Using Them Wrong? QThreads: Are You Using Them Wrong?
QThreads: Are You Using Them Wrong?
 
Convert Your Legacy OpenGL Code to Modern OpenGL with Qt
Convert Your Legacy OpenGL Code to Modern OpenGL with QtConvert Your Legacy OpenGL Code to Modern OpenGL with Qt
Convert Your Legacy OpenGL Code to Modern OpenGL with Qt
 
Qt on Real Time Operating Systems
Qt on Real Time Operating SystemsQt on Real Time Operating Systems
Qt on Real Time Operating Systems
 
Qt State Machine Framework
Qt State Machine FrameworkQt State Machine Framework
Qt State Machine Framework
 
Copy Your Favourite Nokia App with Qt
Copy Your Favourite Nokia App with QtCopy Your Favourite Nokia App with Qt
Copy Your Favourite Nokia App with Qt
 
Best Practices in Qt Quick/QML - Part 1 of 4
Best Practices in Qt Quick/QML - Part 1 of 4Best Practices in Qt Quick/QML - Part 1 of 4
Best Practices in Qt Quick/QML - Part 1 of 4
 
Necessitas - Qt on Android - from FSCONS 2011
Necessitas - Qt on Android - from FSCONS 2011Necessitas - Qt on Android - from FSCONS 2011
Necessitas - Qt on Android - from FSCONS 2011
 
Building the QML Run-time
Building the QML Run-timeBuilding the QML Run-time
Building the QML Run-time
 
Qt Workshop
Qt WorkshopQt Workshop
Qt Workshop
 
Qt Widget In-Depth
Qt Widget In-DepthQt Widget In-Depth
Qt Widget In-Depth
 
Hello, QML
Hello, QMLHello, QML
Hello, QML
 
Efficient Graphics with Qt
Efficient Graphics with QtEfficient Graphics with Qt
Efficient Graphics with Qt
 
Cross Platform Qt
Cross Platform QtCross Platform Qt
Cross Platform Qt
 
Intro to QML / Declarative UI
Intro to QML / Declarative UIIntro to QML / Declarative UI
Intro to QML / Declarative UI
 
Qt for beginners part 2 widgets
Qt for beginners part 2   widgetsQt for beginners part 2   widgets
Qt for beginners part 2 widgets
 

Destacado (6)

Practical Model View Programming
Practical Model View ProgrammingPractical Model View Programming
Practical Model View Programming
 
Qt 5 - C++ and Widgets
Qt 5 - C++ and WidgetsQt 5 - C++ and Widgets
Qt 5 - C++ and Widgets
 
Python Tricks That You Can't Live Without
Python Tricks That You Can't Live WithoutPython Tricks That You Can't Live Without
Python Tricks That You Can't Live Without
 
Object-oriented Programming in Python
Object-oriented Programming in PythonObject-oriented Programming in Python
Object-oriented Programming in Python
 
Python Advanced – Building on the foundation
Python Advanced – Building on the foundationPython Advanced – Building on the foundation
Python Advanced – Building on the foundation
 
Python Worst Practices
Python Worst PracticesPython Worst Practices
Python Worst Practices
 

Similar a Qt Graphics View Framework (Qt Developers Meetup Isreal)

Similar a Qt Graphics View Framework (Qt Developers Meetup Isreal) (20)

Developing and Benchmarking Qt applications on Hawkboard with Xgxperf
Developing and Benchmarking Qt applications on Hawkboard with XgxperfDeveloping and Benchmarking Qt applications on Hawkboard with Xgxperf
Developing and Benchmarking Qt applications on Hawkboard with Xgxperf
 
The Ring programming language version 1.6 book - Part 73 of 189
The Ring programming language version 1.6 book - Part 73 of 189The Ring programming language version 1.6 book - Part 73 of 189
The Ring programming language version 1.6 book - Part 73 of 189
 
The Ring programming language version 1.2 book - Part 51 of 84
The Ring programming language version 1.2 book - Part 51 of 84The Ring programming language version 1.2 book - Part 51 of 84
The Ring programming language version 1.2 book - Part 51 of 84
 
Qt Programming on TI Processors
Qt Programming on TI ProcessorsQt Programming on TI Processors
Qt Programming on TI Processors
 
Extended and embedding: containerd update & project use cases
Extended and embedding: containerd update & project use casesExtended and embedding: containerd update & project use cases
Extended and embedding: containerd update & project use cases
 
Basics of gtk_ilugc
Basics of gtk_ilugcBasics of gtk_ilugc
Basics of gtk_ilugc
 
KDE 4.1 Plasma widgets
KDE 4.1 Plasma widgetsKDE 4.1 Plasma widgets
KDE 4.1 Plasma widgets
 
openGL basics for sample program (1).ppt
openGL basics for sample program (1).pptopenGL basics for sample program (1).ppt
openGL basics for sample program (1).ppt
 
openGL basics for sample program.ppt
openGL basics for sample program.pptopenGL basics for sample program.ppt
openGL basics for sample program.ppt
 
The Ring programming language version 1.8 book - Part 77 of 202
The Ring programming language version 1.8 book - Part 77 of 202The Ring programming language version 1.8 book - Part 77 of 202
The Ring programming language version 1.8 book - Part 77 of 202
 
JS digest. February 2017
JS digest. February 2017JS digest. February 2017
JS digest. February 2017
 
Tools for developing Android Games
 Tools for developing Android Games Tools for developing Android Games
Tools for developing Android Games
 
The Ring programming language version 1.7 book - Part 75 of 196
The Ring programming language version 1.7 book - Part 75 of 196The Ring programming language version 1.7 book - Part 75 of 196
The Ring programming language version 1.7 book - Part 75 of 196
 
QT 프로그래밍 기초(basic of QT programming tutorial)
QT 프로그래밍 기초(basic of QT programming tutorial)QT 프로그래밍 기초(basic of QT programming tutorial)
QT 프로그래밍 기초(basic of QT programming tutorial)
 
Witekio custom modern qt quick components
Witekio custom modern qt quick componentsWitekio custom modern qt quick components
Witekio custom modern qt quick components
 
Qt for beginners part 4 doing more
Qt for beginners part 4   doing moreQt for beginners part 4   doing more
Qt for beginners part 4 doing more
 
State of the Art OpenGL and Qt
State of the Art OpenGL and QtState of the Art OpenGL and Qt
State of the Art OpenGL and Qt
 
Flink Forward Berlin 2017: Matt Zimmer - Custom, Complex Windows at Scale Usi...
Flink Forward Berlin 2017: Matt Zimmer - Custom, Complex Windows at Scale Usi...Flink Forward Berlin 2017: Matt Zimmer - Custom, Complex Windows at Scale Usi...
Flink Forward Berlin 2017: Matt Zimmer - Custom, Complex Windows at Scale Usi...
 
Developing for Plone using ArchGenXML / ArgoUML
Developing for Plone using ArchGenXML / ArgoUMLDeveloping for Plone using ArchGenXML / ArgoUML
Developing for Plone using ArchGenXML / ArgoUML
 
Qt5 on ti processors
Qt5 on ti processorsQt5 on ti processors
Qt5 on ti processors
 

Último

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Último (20)

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 

Qt Graphics View Framework (Qt Developers Meetup Isreal)

  • 1. vitali.pe@gmail.com vitali.p@volicon.com QT Graphics View Framework [vitali]: ~/qt-secene-demos/ >> python cool_intro.py Traceback (most recent call last): File "PySideexamplesopengloverpainting.py", line 198, in paintEvent self.resizeGL(self.width(), self.height()) File "PySideexamplesopengloverpainting.py", line 227, in resizeGL glViewport(((width - side) / 2), ((height - side) / 2), side, side) ctypes.ArgumentError: argument 1: <class 'TypeError'>: wrong type Traceback (most recent call last): File "PySideexamplesopengloverpainting.py", line 198, in paintEvent self.resizeGL(self.width(), self.height()) File "PySideexamplesopengloverpainting.py", line 227, in resizeGL glViewport(((width - side) / 2), ((height - side) / 2), side, side) ctypes.ArgumentError: argument 1: <class 'TypeError'>: wrong type
  • 2. Soo... QGraphicsScene.. Basically it’s a canvas library on (a lot of) steroids. Features: Model/View Architecture. It’s own event system (not signals & slots) Low level rendering (with QPainter) Input Handling (mouse & keyboard) Simple animation Support for embedding QWidgets Collision detection Drag & Drop ….
  • 4. Architecture Overview Only 3 Basic components item(s), that are added to the scene, and one or more views to display the scene. View View Graphics Scene Item Item VIew Item This is the actual QWidget, that is added to your layout... Item Item
  • 5. First, lets talk about rendering widgets in QT ● ● ● Widget render themselves by overriding paintEvent() QT uses the “painter's algorithm” Any Widget can be hardware accelerated. paintEvent() 1 paintEvent() 2 3 paintEvent() 4 paintEvent()
  • 6. Ok… so what about graphics scene? The graphics scene, has a different more flexible and optimized API for drawing and transforms , but the same principle apply…. 1 2 Also up until QT 5 , QML widgets where implemented on top of QGraphicsView 3 4
  • 7. Rendering in Qt 4.8 QML Via QGraphicsView Qt Webkit QWidget QPainter OpenGL Renderer Software Renderer
  • 8. Rendering in Qt 5 QML Qt Webkit QWidget QPainter SceneGraph OpenGL Renderer Software Renderer
  • 9. Why? you ask... Well… because painter’s algorithm will fuckup any OpenGL based rendering pipeline! QML Z-Buffering FTW! SceneGraph Yes you can get away with it on desktops when you're not developing AAA games… but Qt Quick is for moblie remember ? OpenGL Renderer
  • 10. The Item, View & Scene QGraphicsScene: ● ● ● ● itemAt(x : float, y : float) addItem(item : QGraphicsItem) addPixmap( pixmap : QPixmap) selectedItems() ... Providing an interface for managing items Propagating events to each item Managing item state, such as selection and focus handling Providing (untransformed) rendering functionality.
  • 11. The Item, View & Scene QGraphicsItem: ● ● ● ● ● ● setPos(pos : QPointF) setTransform(t : QTransform) setEnabled( enabled : bool) childItems() ... Mouse and keyboard input events Drag and drop Parent-child relationships. Collision detection. Has many many built-in sub types If you want to implement layers effects, etc… you need a custom item
  • 12. The Item, View & Scene QGraphicsView: ● ● ● ● ● mapFromScene(pos : QPointF) mapToScene(pos : QPointF) centerOn(pos : QPointF) setTransform(t : QTransform) ... Visualizes the contents of a scene. Is a subclass of QWidget A scene can have multiple views attached to it. Translates keyboard and mouse events to scene events Has it’s own transform matrix.