aboutsummaryrefslogtreecommitdiffstats
path: root/doc/qtdesignstudio/src/qtquick3d-editor/qtdesignstudio-3d-repeater-3d.qdoc
blob: 4b5a0c4b9d7935a3ddd6e701a7a05e8cfe1c23da (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
/****************************************************************************
**
** Copyright (C) 2021 The Qt Company Ltd.
** Contact: https://www.qt.io/licensing/
**
** This file is part of Qt Design Studio.
**
** $QT_BEGIN_LICENSE:FDL$
** Commercial License Usage
** Licensees holding valid commercial Qt licenses may use this file in
** accordance with the commercial license agreement provided with the
** Software or, alternatively, in accordance with the terms contained in
** a written agreement between you and The Qt Company. For licensing terms
** and conditions see https://www.qt.io/terms-conditions. For further
** information use the contact form at https://www.qt.io/contact-us.
**
** GNU Free Documentation License Usage
** Alternatively, this file may be used under the terms of the GNU Free
** Documentation License version 1.3 as published by the Free Software
** Foundation and appearing in the file included in the packaging of
** this file. Please review the following information to ensure
** the GNU Free Documentation License version 1.3 requirements
** will be met: https://www.gnu.org/licenses/fdl-1.3.html.
** $QT_END_LICENSE$
**
****************************************************************************/

/*!
    \page studio-3d-repeater-3d.html
    \previouspage studio-3d-morph-target.html
    \nextpage studio-3d-loader-3d.html

    \title Repeater3D

    \note The \uicontrol Repeater3D component is released as a tech preview
    feature in \QDS 2.2, and its functionality will be improved in future
    releases.

    The \uicontrol Repeater3D component is used to create multiple
    similar items. Like other view types, \uicontrol Repeater3D needs a model
    and a delegate. The delegate sets the item to use and the model sets the
    structure of the items in the \uicontrol Repeater3D component.

    The model can be any of the supported \l{Qt QML Models QML Types}
    {data models}. Additionally, like delegates for other views, a delegate for
    the \uicontrol Repeater3D can access its index within the repeater, as well
    as the model data relevant to the delegate.

    \note \uicontrol Repeater3D owns all items it instantiates. Removing or
    dynamically destroying an item created by \uicontrol Repeater3D results in
    unpredictable behavior.

    \note \uicontrol Repeater3D can only repeat objects derived from
    \uicontrol Nodes.

    For more information, see \l{https://doc.qt.io/qt/qml-qtquick3d-repeater3d.html}
    {Repeater3D} in the \uicontrol {Qt Quick 3D} documentation.

    \section2 Repeater3D Properties

    \section3 Model

    The \uicontrol Model property specifies the model providing data for the
    repeater. You can only use the \uicontrol Model property in the
    \uicontrol Properties view to set a numeric model or to bind to QML based
    models. You can use \l {Text Editor} to define any of the supported
    data models as the value of the \uicontrol Model property:
        \list
            \li A number that indicates the number of delegates to be created by
                the repeater.
            \li A model, such as a \uicontrol ListModel component, or a
                QAbstractItemModel subclass.
            \li A string list.
            \li An object list.
        \endlist

    The type of model affects the properties that are exposed to the delegate.

    \section3 Delegate

    The \uicontrol Delegate property specifies a template defining each object
    instantiated by the repeater. Currently, the \uicontrol Delegate property
    needs to be defined in code using the \uicontrol Edit mode or
    \uicontrol {Text Editor}. Delegates are exposed to a read-only index
    property that indicates the index of the delegate within the repeater. For
    more information, see \l{https://doc.qt.io/qt/qml-qtquick3d-repeater3d.html#delegate-prop}
    {Delegate} in the \uicontrol {Qt Quick 3D} documentation.

    If the model is a model object, such as a ListModel, the delegate can access
    all model roles as named properties, in the same way that delegates do for
    view classes like \uicontrol ListView.

    \section1 Adding a Repeater3D Component with a Numeric Model

    This section explains how to add a \uicontrol Repeater3D component with
    a numeric model to your \QDS project.

    To add a \uicontrol Repeater3D component:

    \list 1
      \li Drag a \uicontrol Repeater3D component from \uicontrol Components to
      \e scene in \uicontrol Navigator.
      \li Select \e repeater3D in \uicontrol Navigator and in
      \uicontrol Properties, set \uicontrol Model to 4.
      \image repeater3d-model-property.png
    \endlist
    Now, you have set up the \uicontrol Repeater3D component to use a numeric
    model that draws four instances of the same item. Next, you need to add the
    item to draw. In this example we are using a \uicontrol Cube.
    \list 1
      \li From \uicontrol Components, drag a \uicontrol Cube to \e repeater3D in
      \uicontrol Navigator.
      Now, four cubes are drawn to the scene, but they are drawn to the exact same
      place.
      \li Select \e cube in \uicontrol Navigator and in \uicontrol Properties
      select \inlineimage icons/action-icon.png
      next to \uicontrol Translation > \uicontrol X.
      \li Select \uicontrol {Set binding} to open \uicontrol {Binding Editor}.
      \li In the binding editor, enter \c{index * 150}. This sets the X
      location to increase by 150 for each of the cube instances.
      \image repeater3d-index-binding.png
      \li Select \uicontrol OK and go to \uicontrol {3D Editor} to see the
      result.
    \endlist
    \image repeater3d-numeric-model.webp

    \section1 Adding a Repeater3D Component with a List Model

    This section explains how to add a \uicontrol Repeater3D component with
    a ListModel to your \QDS project:

    To add a \uicontrol Repeater3D component:

    \list 1
      \li Drag a \uicontrol Repeater3D component from \uicontrol Components to
      \e scene in \uicontrol Navigator.
      \li You need to enter the QML code for the \uicontrol ListModel manually.
      Go to \uicontrol {Text Editor} and enter the following code somewhere
      inside the root object:
      \code qml
        ListModel {
            id: planetModel
            ListElement {
                name: "Mars"
                radius: 3.39
            }
            ListElement {
                name: "Earth"
                radius: 6.37
            }
            ListElement {
                name: "Venus"
                radius: 6.05
            }
        }
        \endcode
      The default root object for a \QDS project is \uicontrol Rectangle, so
      you can paste the \uicontrol ListModel code, for example, like this:
      \code qml
      Rectangle {
        width: Constants.width
        height: Constants.height
        color: Constants.backgroundColor

        ListModel {
            id: planetModel
            ListElement {
                name: "Mars"
                radius: 3.39
            }
            ListElement {
                name: "Earth"
                radius: 6.37
            }
            ListElement {
                name: "Venus"
                radius: 6.05
            }
        }

        View3D {
            id: view3D
            anchors.fill: parent
            ...
    \endcode
    \li In \uicontrol {Text Editor}, add \c {model: planetModel} to the
    \uicontrol Repeater3D object to tell that you want to use your
    \uicontrol ListModel as the model for the \uicontrol Repeater3D object.
    \code qml
    Repeater3D {
        id: repeater3D
        model: planetModel
    }
    \endcode
    \endlist

    Now, you have set up the \uicontrol Repeater3D component to use a
    \uicontrol ListModel to draw the items. Next, you need to add the
    item to draw. In this example we are using a \uicontrol Sphere.

    \list 1
      \li From \uicontrol Components, drag a \uicontrol Sphere to \e repeater3D
      in \uicontrol Navigator.
      \image repeater3d-listmodel-navigator.png
      \li Select \e sphere in \uicontrol Navigator and select
      \inlineimage icons/action-icon.png
      next to \uicontrol Scale > \uicontrol X.
      \li Select \uicontrol {Set binding} to open \uicontrol {Binding Editor}.
      \li In the binding editor, enter \c{radius}. This sets the X
      scale to the radius value defined in the ListModel for each of the sphere
      instances.
      \image repeater3d-radius-binding.png
      \li Select \uicontrol OK.
      \li Repeat steps 2 to 5 for \uicontrol Scale > \uicontrol Y and
      \uicontrol Scale > \uicontrol Z.
    \endlist

    Now, three spheres of different size are drawn but they are drawn in the same
    position so you need to change the position to see all spheres.

    \list 1
      \li Select \e sphere in \uicontrol Navigator and select
      \inlineimage icons/action-icon.png
      next to \uicontrol Translation > \uicontrol X.
      \li Select \uicontrol {Set binding} to open \uicontrol {Binding Editor}.
      \li In the binding editor, enter \c{index * 1000}. This sets the X
      location to increase by 1000 for each of the sphere instances.
      \image repeater3d-location-binding.png
      \li Select \uicontrol OK and go to \uicontrol {3D Editor} to see the
      result. You need to zoom out to see all the spheres.
    \endlist

    \image repeater3d-list-model.webp

*/