Doc: Create separate topic for dummy QML data

There is now a collection topic for methods for
simulating data in the Qt Design Studio Manual.
Move information about creating dummy QML models
there.

Change-Id: Id15998b172169a7d714250350f6f627b998ad9e8
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>
This commit is contained in:
Leena Miettinen
2020-09-29 09:13:07 +02:00
parent 3ca4544869
commit cb8ee308ee
8 changed files with 27 additions and 90 deletions

View File

@@ -104,6 +104,7 @@
\li \l{Specifying Item Properties} \li \l{Specifying Item Properties}
\li \l{Using Custom Fonts} \li \l{Using Custom Fonts}
\li \l{Annotating Designs} \li \l{Annotating Designs}
\li \l{Loading Placeholder Data}
\li \l{Qt Quick UI Forms} \li \l{Qt Quick UI Forms}
\endlist \endlist
\li \l {Adding Dynamics} \li \l {Adding Dynamics}

View File

@@ -26,7 +26,11 @@
/*! /*!
\page qtquick-annotations.html \page qtquick-annotations.html
\previouspage qtquick-fonts.html \previouspage qtquick-fonts.html
\if defined(qtdesignstudio)
\nextpage creator-quick-ui-forms.html \nextpage creator-quick-ui-forms.html
\else
\nextpage qtquick-placeholder-data.html
\endif
\title Annotating Designs \title Annotating Designs

View File

@@ -203,94 +203,6 @@
You can add other languages later by editing the project file. You can add other languages later by editing the project file.
\endif \endif
\section1 Loading Placeholder Data
The Design mode supports views, models, and delegates, so that when you add
a Grid View, List View, or Path View item, the ListModel and the delegate
item are added automatically.
However, the missing context of the application presents a challenge.
Specific models defined in C++ are the most obvious case. Often,
the context is missing simple properties, which are either defined in C++,
or in other QML files. A typical example is an item that uses the
properties of its parent, such as \c parent.width.
\section2 Using Dummy Models
If you open a file in the Design mode that references a C++ model, you see
nothing on
the canvas. If the data in the model is fetched from the internet, you have
no control over it. To get reliable data, \e {dummy data} was introduced.
For example, the following code snippet describes the file example.qml that
contains a ListView that in turn specifies a C++ model:
\qml
ListView {
model: dataModel
delegate: ContactDelegate {
name: name
}
}
\endqml
Create a directory named \e dummydata in the root directory of the project,
so that it is not deployed to the device. In the \c dummydata directory,
create a QML file that has the same name as the value of \c model:
\code
qml/exampleapp/example.qml
dummydata/dataModel.qml
\endcode
Then create the dataModel.qml file that contains the dummy data:
\qml
import QtQuick 2.0
ListModel {
ListElement {
name: "Ariane"
}
ListElement {
name: "Bella"
}
ListElement {
name: "Corinna"
}
}
\endqml
\section2 Creating Dummy Context
The following example presents a common pattern in QML:
\qml
Item {
width: parent.width
height: parent.height
}
\endqml
This works nicely for applications but the Design mode displays a zero-sized
item. A parent for the opened file does not exist, because the context is
missing. To get around the missing context, the idea of a \e {dummy
context} is introduced. If you place a file with the same name as the
application (here, example.qml) in the \c {dummydata/context} directory,
you can fake a parent context:
\qml
import QtQuick 2.0
import QmlDesigner 1.0
DummyContextObject {
parent: Item {
width: 640
height: 300
}
}
\endqml
\section1 Building Transformations on Items \section1 Building Transformations on Items
The \uicontrol Advanced tab allows you to configure advanced The \uicontrol Advanced tab allows you to configure advanced

View File

@@ -31,7 +31,11 @@
/*! /*!
\page creator-quick-ui-forms.html \page creator-quick-ui-forms.html
\if defined(qtdesignstudio)
\previouspage qtquick-annotations.html \previouspage qtquick-annotations.html
\else
\previouspage qtquick-placeholder-data.html
\endif
\nextpage qtquick-adding-dynamics.html \nextpage qtquick-adding-dynamics.html
\title Qt Quick UI Forms \title Qt Quick UI Forms

View File

@@ -101,6 +101,15 @@
You can annotate your designs to provide reviewers or developers You can annotate your designs to provide reviewers or developers
with additional information about them. with additional information about them.
\if defined(qtcreator)
\li \l {Loading Placeholder Data}
You can create QML files that contain placeholder data, so that
you can test grid, list, or path views, even though you don't
have access to real data.
\endif
\if defined(qtdesignstudio) \if defined(qtdesignstudio)
\endlist \endlist

View File

@@ -24,7 +24,7 @@
****************************************************************************/ ****************************************************************************/
/*! /*!
\previouspage studio-simulation-overview.html \previouspage qtquick-placeholder-data.html
\page studio-javascript.html \page studio-javascript.html
\nextpage studio-simulink.html \nextpage studio-simulink.html

View File

@@ -26,7 +26,7 @@
/*! /*!
\page studio-simulation-overview.html \page studio-simulation-overview.html
\previouspage creator-editor-options-text.html \previouspage creator-editor-options-text.html
\nextpage studio-javascript.html \nextpage qtquick-placeholder-data.html
\title Simulating Data Input \title Simulating Data Input
@@ -37,6 +37,12 @@
Simulink simulation. Simulink simulation.
\list \list
\li \l{Loading Placeholder Data}
You can create QML files that contain placeholder data, so that
you can test grid, list, or path views, even though you don't
have access to real data.
\li \l{Simulating Application Logic} \li \l{Simulating Application Logic}
You can use JavaScript to generate mock data for your UI. You can use JavaScript to generate mock data for your UI.

View File

@@ -159,6 +159,7 @@
\endlist \endlist
\li \l{Simulating Data Input} \li \l{Simulating Data Input}
\list \list
\li \l{Loading Placeholder Data}
\li \l{Simulating Application Logic} \li \l{Simulating Application Logic}
\li \l{Simulating Dynamic Systems} \li \l{Simulating Dynamic Systems}
\endlist \endlist