\section1 BezierCurve Declaration
- \snippet quick/scenegraph/customgeometry/beziercurve.h 1
+ \snippet scenegraph/customgeometry/beziercurve.h 1
The item declaration subclasses the QQuickItem class and adds five
properties. One for each of the four control points in the bezier
signals for each of them so changes will be picked up the QML
engine and used accordingly.
- \snippet quick/scenegraph/customgeometry/beziercurve.h 2
+ \snippet scenegraph/customgeometry/beziercurve.h 2
The synchronization point between the QML scene and the rendering
scene graph is the virtual function \l
\section1 BezierCurve Implementation
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 1
+ \snippet scenegraph/customgeometry/beziercurve.cpp 1
The BezierCurve constructor sets up default values for the
control points and the number of segments. The bezier curve
QQuickItem::updatePaintNode() when it is time for the QML scene to
be synchronized with the rendering scene graph.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 2
+ \snippet scenegraph/customgeometry/beziercurve.cpp 2
The BezierCurve class has no data members that need to be cleaned
up so the destructor does nothing. It is worth mentioning that the
QSGNode references in the QQuickItem class nor try to clean them
up explicitly.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 3
+ \snippet scenegraph/customgeometry/beziercurve.cpp 3
The setter function for the p1 property checks if the value is
unchanged and exits early if this is the case. Then it updates the
The other property setters are equivalent, and are omitted from
this example.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 4
+ \snippet scenegraph/customgeometry/beziercurve.cpp 4
The updatePaintNode() function is the primary integration point
for synchronizing the state of the QML scene with the rendering
our QSGGeometryNode which we will fill with geometry and a
material.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 5
+ \snippet scenegraph/customgeometry/beziercurve.cpp 5
We then create the geometry and add it to the node. The first
argument to the QSGGeometry constructor is a definition of the
geometry a member of a QSGGeometryNode subclass, in which case, we
would not have set the QSGGeometryNode::OwnsGeometry flag.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 6
+ \snippet scenegraph/customgeometry/beziercurve.cpp 6
The scene graph API provides a few commonly used used material
implementations. In this example we use the QSGFlatColorMaterial
color. Again we pass the ownership of the material to the node, so
it can be cleaned up by the scene graph.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 7
+ \snippet scenegraph/customgeometry/beziercurve.cpp 7
In the case where the QML item has changed and we only want to
modify the existing node's geometry, we cast the \c oldNode to a
segment count has changed, we call QSGGeometry::allocate() to make
sure it has the right number of vertices.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 8
+ \snippet scenegraph/customgeometry/beziercurve.cpp 8
To fill the geometry, we first extract the vertex array from
it. Since we are using one of the default attribute sets, we can
Then we go through each segment and calculate its position and
write that value to the vertex.
- \snippet quick/scenegraph/customgeometry/beziercurve.cpp 9
+ \snippet scenegraph/customgeometry/beziercurve.cpp 9
In the end of the function, we return the node so the scene graph
can render it.
\section1 Application Entry-Point
- \snippet quick/scenegraph/customgeometry/main.cpp 1
+ \snippet scenegraph/customgeometry/main.cpp 1
The application is a straightforward QML application, with a
QGuiApplication and a QQuickView that we pass a .qml file. To make
\section1 Using the Item
- \snippet quick/scenegraph/customgeometry/main.qml 1
+ \snippet scenegraph/customgeometry/main.qml 1
Our .qml file imports the \c {QtQuick 2.0} module to get the
standard types and also our own \c {CustomGeometry 1.0} module
which contains our newly created BezierCurve objects.
- \snippet quick/scenegraph/customgeometry/main.qml 2
+ \snippet scenegraph/customgeometry/main.qml 2
Then we create the our root item and an instance of the
BezierCurve which we anchor to fill the root.
- \snippet quick/scenegraph/customgeometry/main.qml 3
+ \snippet scenegraph/customgeometry/main.qml 3
To make the example a bit more interesting we add an animation to
change the two control points in the curve. The end points stay
unchanged.
- \snippet quick/scenegraph/customgeometry/main.qml 4
+ \snippet scenegraph/customgeometry/main.qml 4
Finally we overlay a short text outlining what the example shows.
in the QML file and this value is used by the OpenGL shader
program that draws the squircles.
- \snippet quick/scenegraph/openglunderqml/squircle.h 1
+ \snippet scenegraph/openglunderqml/squircle.h 1
First of all, we need a QObject with a slot to connect the signals
to. We subclass QQuickItem in order to use the \l
Lets move on to the implementation.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 7
+ \snippet scenegraph/openglunderqml/squircle.cpp 7
The constructor of the \c Squircle class simply initializes the
values. The shader program will be initialized during rendering
later.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 8
+ \snippet scenegraph/openglunderqml/squircle.cpp 8
The property setter checks that the value has indeed changed
before updating its internal variable. It then calls \l
initialization, before the object has been entered into the scene
and before it has a window.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 1
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 2
+ \snippet scenegraph/openglunderqml/squircle.cpp 1
+ \snippet scenegraph/openglunderqml/squircle.cpp 2
For our paint function to be called, we need to connect to the
window's signals. When Squircle object is populated into the
slots are invoked on the wrong thread with no OpenGL context
present.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 3
+ \snippet scenegraph/openglunderqml/squircle.cpp 3
The default behavior of the scene graph is to clear the
framebuffer before rendering. Since we render before the scene
graph, we need to turn this clearing off. This means that we need
to clear ourselves in the \c paint() function.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 4
+ \snippet scenegraph/openglunderqml/squircle.cpp 4
The first thing we do in the \c paint() function is to
initialize the shader program. By initializing the shader program
all rendering related operations must happen on the rendering
thread.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 5
+ \snippet scenegraph/openglunderqml/squircle.cpp 5
We use the shader program to draw the squircle. At the end of the
\c paint function we release the program and disable the
attributes we used so that the OpenGL context is in a "clean"
state for the scene graph to pick it up.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 6
+ \snippet scenegraph/openglunderqml/squircle.cpp 6
In the \c cleanup() function we delete the program.
- \snippet quick/scenegraph/openglunderqml/squircle.cpp 9
+ \snippet scenegraph/openglunderqml/squircle.cpp 9
We use the \c sync() function to copy the state of the
object in the GUI thread into the rendering thread.
thread is blocked, so it is safe to simply copy the value without
any additional protection.
- \snippet quick/scenegraph/openglunderqml/main.cpp 1
+ \snippet scenegraph/openglunderqml/main.cpp 1
The application's \c main() function instantiates a QQuickView and
launches the \c main.qml file. The only thing worth noting is that
we export the \c Squircle class to QML using the \l
qmlRegisterType() macro.
- \snippet quick/scenegraph/openglunderqml/main.qml 1
+ \snippet scenegraph/openglunderqml/main.qml 1
We import the Squircle QML type with the name we registered in the
\c main() function. We then instantiate it and create a running
NumberAnimation on the its \c t property.
- \snippet quick/scenegraph/openglunderqml/main.qml 2
+ \snippet scenegraph/openglunderqml/main.qml 2
Then we overlay a short descriptive text, so that it is clearly
visible that we are in fact rendering OpenGL under our Qt Quick
material state is what we assign to each individual node, in this
case to give them different colors.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 1
+ \snippet scenegraph/simplematerial/simplematerial.cpp 1
The first thing we do when creating custom materials with the
simplified scheme is to create a state class. In this case the
compare function which the scene graph can use to reorder the node
rendering.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 2
+ \snippet scenegraph/simplematerial/simplematerial.cpp 2
Next we define the material shader, by subclassing a template
instantiation of \l QSGSimpleMaterialShader with our \c State.
classes. Using the same \c State class in multiple shaders will
will lead to undefined behavior.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 3
+ \snippet scenegraph/simplematerial/simplematerial.cpp 3
Next comes the declaration of the shader source code, where we
define a vertex and fragment shader. The simple material assumes
the presence of \c qt_Matrix in the vertex shader and \c
qt_Opacity in the fragment shader.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 4
+ \snippet scenegraph/simplematerial/simplematerial.cpp 4
We reimplement the \c attributes function to return the name of
the \c aVertex and \c aTexCoord attribute names. These attributes
will be mapped to attribute indices 0 and 1 in the node's
geometry.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 6
+ \snippet scenegraph/simplematerial/simplematerial.cpp 6
Uniforms can be accessed either by name or by index, where index
is faster than name, so we reimplement the \c resolveUniforms()
to worry about resolving \c qt_Opacity or \c qt_Matrix as these
are handled by the baseclass.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 5
+ \snippet scenegraph/simplematerial/simplematerial.cpp 5
The \c updateState() function is called once for every unique
state and we use it to update the shader program with the current
usecase, where all the colors are different, the updateState will
be called once for every node.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 7
+ \snippet scenegraph/simplematerial/simplematerial.cpp 7
The \c ColorNode class is supposed to draw something, so it needs
to be a subclass of \l QSGGeometryNode.
Finally, we tell the node to take ownership of the material, so we
do not have to explicitly memorymanage it.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 8
+ \snippet scenegraph/simplematerial/simplematerial.cpp 8
Since the Item is providing its own graphics to the scene graph,
we set the flag \l QQuickItem::ItemHasContents.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 9
+ \snippet scenegraph/simplematerial/simplematerial.cpp 9
Whenever the Item has changed graphically, the \l
QQuickItem::updatePaintNode() function is called.
state. Finally, we notify the scene graph that the node has
undergone changes to its geometry and material.
- \snippet quick/scenegraph/simplematerial/simplematerial.cpp 11
+ \snippet scenegraph/simplematerial/simplematerial.cpp 11
The \c main() function of the application adds the custom QML type
using \l qmlRegisterType() and opens up a \l QQuickView with our
QML file.
- \snippet quick/scenegraph/simplematerial/main.qml 1
+ \snippet scenegraph/simplematerial/main.qml 1
In the QML file, we import our custom type so we can instantiate
it.
- \snippet quick/scenegraph/simplematerial/main.qml 2
+ \snippet scenegraph/simplematerial/main.qml 2
Then we create a column of three instances of our custom item,
each with a different color.
- \snippet quick/scenegraph/simplematerial/main.qml 3
+ \snippet scenegraph/simplematerial/main.qml 3
And finally we overlay a short descriptive text.
projects / platform / upstream / qtdeclarative.git / commitdiff