graphically accelerated qtquick components · adeneo embedded paris 3 rue galvani 91300 massy,...
TRANSCRIPT
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
Graphically accelerated QtQuick 2 components
Painting your own component
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• QtQuick is all about creating your own components
• Process made easy, allows for QML extension
2
Custom components
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Aggregation of QML components inside a QML file
– Limited by existing components
– Limited access to C++ side
– Very quick and easy to do
3
QML Files
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Custom Item class
– Less straightforward
– Custom painting of item
– Direct access to C++ side
4
QtQuick class
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Qt 4 & QtQuick 1 – Use QDeclarativeItem as base class
– QDeclarativeItem inherited QGraphicsItem • paint() method
• Qt 5 & QtQuick 2 – Use QQuickItem as base class
– QQuickItem inherits QObject • No paint() method !
5
QtQuick2 item class
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• How to reimplement QtQuick2 items drawing ?
• QQuickPaintedItem
– Inherit QtQuickItem
– Provides a paint() method, QPainter drawing
– Convenient way to port QDeclarativeItem based classes
– Will not fully leverage Scene Graph optimizations and performs slower (2 pass rendering)
6
QtQuickPaintedItem
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Rendering made for Opengl
– Dependent on Opengl / Opengl ES
– State aware to minimize overhead
– Render thread separated from Main thread
7
Scene Graph
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Render using an optimized order:
– Sort by Material
– Do not draw hidden parts
– Does not care about Z-order for solid materials
8
Scene Graph
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• The new underlying organization of all items from Qt5
• Hierarchy, position and size of components, as “Nodes”
• Each node contains all its children
9 Scene
Scene Graph
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
How to leverage QQuick2 performances?
• Inherit QQuickItem
• Set ItemHasContents flag
• Implement updatePaintNode method
• Use Scene Graph classes (QSG*)
• Use update() method to trigger updatePaintNode
10
QtQuick2 item class
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
11
Platform
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
12
Platform
• available in QT 5.1 – Edit qmake.conf to set the location of dependencies
qtbase/mkspecs/devices/linux-imx6-g++/qmake.conf
– Configure using “–device imx6 –opengl es2 -eglfs”
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• oldNode holds the previous state of the node
• Null until initialized
• It contains its type and hierarchy
• Set its color and geometry 13
Example: Red rectangle
QSGNode *MyItem::updatePaintNode(QSGNode *oldNode, UpdatePaintNodeData *) { QSGSimpleRectNode *n = static_cast<QSGSimpleRectNode *>(oldNode); if ( ! n ) { n = new QSGSimpleRectNode(); n->setColor(Qt::red); } n->setRect(boundingRect()); return n; }
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Draw exclusively in the render thread, avoid classes other than QSG*
• Main thread is blocked during rendering, access to items data is safe
• Newly created QObject-based classes are running on rendering thread
• Signals targeting main thread will be queued
14
Caveats
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
QSGNode
QSGTransformNode
QSGOpacityNode
QSGClipNode
QSGGeometryNode
15
Node classes
Text text text
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
QSGNode
QSGTransformNode
QSGOpacityNode
QSGClipNode
QSGGeometryNode
16
Node classes
• QSGTransformNode.setMatrix();
• QSGOpacityNode.setOpacity();
• QSGClipNode.setClipRect();
• QSGGeometryNode.setMaterial(); • QSGGeometryNode.setGeometry();
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
QSGNode
QSGGeometryNode - Base class of visual elements
- Holds Geometry and materials
QSGSimpleRectNode - Rectangle, color
QSGSimpleTextureNode - Rectangle, texture
17
Geometry classes
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• QSGGeometryNode
–Geometry (vertices)
• QSGGeometry
• Points, lines, triangles
18
QSGGeometryNode
QSGGeometry *geometry = new QSGGeometry(QSGGeometry::defaultAttributes_Point2D(), 2); geometry->setDrawingMode(GL_LINES); geometry->setLineWidth(3); geometry->vertexDataAsPoint2D()[0].set(0, 0); geometry->vertexDataAsPoint2D()[1].set(width(), height()); QSGSimpleRectNode *node = new QSGGeometryNode; node->setGeometry(geometry); node->setFlag(QSGNode::OwnsGeometry);
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• QSGGeometryNode
–Material (shader)
• QSGMaterial, QSGFlatColorMaterial, QSGSimpleMaterialShader
• Vertex and fragment shader
• Attributes, uniforms
19
QSGGeometryNode
QSGFlatColorMaterial *material = new QSGFlatColorMaterial; material->setColor(QColor(255, 0, 0)); QSGSimpleRectNode *node = new QSGGeometryNode; node->setGeometry(geometry); node->setFlag(QSGNode::OwnsGeometry);
Adeneo Embedded Seattle 3150 Richards Road, Suite 210 – Bellevue, WA 98005, USA Phone : +1 425 749-4335 / Fax : +1 425 818-1911
Headquarters 2 chemin du Ruisseau – 69134 Ecully, France Phone : +33 4 26 49 25 39/ Fax : +33 4 72 18 08 41
Adeneo Embedded Paris 3 rue Galvani – 91300 Massy, France Phone : +33 1 80 75 01 52
Adeneo Embedded Frankfurt Pfingstweide 51 – 61169 Friedberg Phone : +49 6031 693 707 0
• Qt 5 provides a way to create high performance graphics contents
• Needs some OpenGL knowledge and thinking
• QQuickPaintedItem available for fast porting/prototyping
• Or rely on existing components
20
Sum up