diff options
Diffstat (limited to 'examples')
33 files changed, 87 insertions, 55 deletions
diff --git a/examples/quickcontrols2/chattutorial/doc/src/qtquickcontrols2-chattutorial.qdoc b/examples/quickcontrols2/chattutorial/doc/src/qtquickcontrols2-chattutorial.qdoc index f048b12c..519d1c7a 100644 --- a/examples/quickcontrols2/chattutorial/doc/src/qtquickcontrols2-chattutorial.qdoc +++ b/examples/quickcontrols2/chattutorial/doc/src/qtquickcontrols2-chattutorial.qdoc @@ -216,6 +216,9 @@ Now we can build and run the application: \borderedimage qtquickcontrols2-chattutorial-chapter1.png +\noautolist +\generatelist examplefiles .*chapter1.* + \section1 Chapter 2: Lists In this chapter, we'll explain how to create a list of interactive items using @@ -290,6 +293,9 @@ vertical space. \borderedimage qtquickcontrols2-chattutorial-chapter2.png +\generatelist examplefiles .*(chapter2|shared).* +\generatelist exampleimages .*shared.*(Einstein|Hemingway|Gude)\.png + \section1 Chapter 3: Navigation In this chapter, you'll learn how to use \l StackView to navigate between pages @@ -514,6 +520,9 @@ Finally, the button is only enabled when there is actually a message to send. \borderedimage qtquickcontrols2-chattutorial-chapter3.gif +\generatelist examplefiles .*(chapter3|shared).* +\generatelist exampleimages .*shared.*(Einstein|Hemingway|Gude)\.png + \section1 Chapter 4: Models In chapter 4, we'll take you through the process of creating both read-only and @@ -730,6 +739,9 @@ text field to make way for future input. \borderedimage qtquickcontrols2-chattutorial-chapter4.gif +\generatelist examplefiles .*(chapter4|shared).* +\generatelist exampleimages + \section1 Chapter 5: Styling Styles in Qt Quick Controls 2 are designed to work on any platform. In this @@ -856,6 +868,9 @@ After building and running the application, you should see these results: \borderedimage qtquickcontrols2-chattutorial-chapter5-contacts-universal-dark.png \borderedimage qtquickcontrols2-chattutorial-chapter5-conversations-universal-dark.png +\generatelist examplefiles .*(chapter5|shared).* +\generatelist exampleimages + \section1 Summary In this tutorial, we've taken you through the following steps of writing a diff --git a/examples/quickcontrols2/gallery/gallery.cpp b/examples/quickcontrols2/gallery/gallery.cpp index 7b70f1c8..b4d59685 100644 --- a/examples/quickcontrols2/gallery/gallery.cpp +++ b/examples/quickcontrols2/gallery/gallery.cpp @@ -53,6 +53,7 @@ #include <QQmlContext> #include <QSettings> #include <QQuickStyle> +#include <QIcon> int main(int argc, char *argv[]) { @@ -62,6 +63,8 @@ int main(int argc, char *argv[]) QGuiApplication app(argc, argv); + QIcon::setThemeName("gallery"); + QSettings settings; QString style = QQuickStyle::name(); if (!style.isEmpty()) diff --git a/examples/quickcontrols2/gallery/gallery.pro b/examples/quickcontrols2/gallery/gallery.pro index 45496a35..705eeae0 100644 --- a/examples/quickcontrols2/gallery/gallery.pro +++ b/examples/quickcontrols2/gallery/gallery.pro @@ -8,8 +8,9 @@ SOURCES += \ RESOURCES += \ gallery.qml \ qtquickcontrols2.conf \ + icons/gallery/index.theme \ + $$files(icons/*.png, true) \ $$files(images/*.png) \ - $$files(images/+material/*.png) \ $$files(pages/*.qml) target.path = $$[QT_INSTALL_EXAMPLES]/quickcontrols2/gallery diff --git a/examples/quickcontrols2/gallery/gallery.qml b/examples/quickcontrols2/gallery/gallery.qml index 9f253ab3..5344b74e 100644 --- a/examples/quickcontrols2/gallery/gallery.qml +++ b/examples/quickcontrols2/gallery/gallery.qml @@ -50,7 +50,7 @@ import QtQuick 2.9 import QtQuick.Layouts 1.3 -import QtQuick.Controls 2.2 +import QtQuick.Controls 2.3 import QtQuick.Controls.Material 2.1 import QtQuick.Controls.Universal 2.1 import Qt.labs.settings 1.0 @@ -89,12 +89,7 @@ ApplicationWindow { anchors.fill: parent ToolButton { - contentItem: Image { - fillMode: Image.Pad - horizontalAlignment: Image.AlignHCenter - verticalAlignment: Image.AlignVCenter - source: stackView.depth > 1 ? "images/back.png" : "images/drawer.png" - } + icon.name: stackView.depth > 1 ? "back" : "drawer" onClicked: { if (stackView.depth > 1) { stackView.pop() @@ -116,12 +111,7 @@ ApplicationWindow { } ToolButton { - contentItem: Image { - fillMode: Image.Pad - horizontalAlignment: Image.AlignHCenter - verticalAlignment: Image.AlignVCenter - source: "images/menu.png" - } + icon.name: "menu" onClicked: optionsMenu.open() Menu { diff --git a/examples/quickcontrols2/gallery/images/back.png b/examples/quickcontrols2/gallery/icons/gallery/20x20/back.png Binary files differindex db43e273..db43e273 100644 --- a/examples/quickcontrols2/gallery/images/back.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20/back.png diff --git a/examples/quickcontrols2/gallery/images/drawer.png b/examples/quickcontrols2/gallery/icons/gallery/20x20/drawer.png Binary files differindex 1e974efa..1e974efa 100644 --- a/examples/quickcontrols2/gallery/images/drawer.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20/drawer.png diff --git a/examples/quickcontrols2/gallery/images/menu.png b/examples/quickcontrols2/gallery/icons/gallery/20x20/menu.png Binary files differindex a10473d9..a10473d9 100644 --- a/examples/quickcontrols2/gallery/images/menu.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20/menu.png diff --git a/examples/quickcontrols2/gallery/images/back@2x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/back.png Binary files differindex c55ab315..c55ab315 100644 --- a/examples/quickcontrols2/gallery/images/back@2x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/back.png diff --git a/examples/quickcontrols2/gallery/images/drawer@2x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/drawer.png Binary files differindex eba3b6cc..eba3b6cc 100644 --- a/examples/quickcontrols2/gallery/images/drawer@2x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/drawer.png diff --git a/examples/quickcontrols2/gallery/images/menu@2x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/menu.png Binary files differindex 649c2a08..649c2a08 100644 --- a/examples/quickcontrols2/gallery/images/menu@2x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@2/menu.png diff --git a/examples/quickcontrols2/gallery/images/back@3x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/back.png Binary files differindex b228eb87..b228eb87 100644 --- a/examples/quickcontrols2/gallery/images/back@3x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/back.png diff --git a/examples/quickcontrols2/gallery/images/drawer@3x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/drawer.png Binary files differindex 3584ed6d..3584ed6d 100644 --- a/examples/quickcontrols2/gallery/images/drawer@3x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/drawer.png diff --git a/examples/quickcontrols2/gallery/images/menu@3x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/menu.png Binary files differindex 9554b695..9554b695 100644 --- a/examples/quickcontrols2/gallery/images/menu@3x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@3/menu.png diff --git a/examples/quickcontrols2/gallery/images/back@4x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/back.png Binary files differindex dd157e78..dd157e78 100644 --- a/examples/quickcontrols2/gallery/images/back@4x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/back.png diff --git a/examples/quickcontrols2/gallery/images/drawer@4x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/drawer.png Binary files differindex 60d93aff..60d93aff 100644 --- a/examples/quickcontrols2/gallery/images/drawer@4x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/drawer.png diff --git a/examples/quickcontrols2/gallery/images/menu@4x.png b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/menu.png Binary files differindex 187c171c..187c171c 100644 --- a/examples/quickcontrols2/gallery/images/menu@4x.png +++ b/examples/quickcontrols2/gallery/icons/gallery/20x20@4/menu.png diff --git a/examples/quickcontrols2/gallery/icons/gallery/index.theme b/examples/quickcontrols2/gallery/icons/gallery/index.theme new file mode 100644 index 00000000..a1bcd5e0 --- /dev/null +++ b/examples/quickcontrols2/gallery/icons/gallery/index.theme @@ -0,0 +1,24 @@ +[Icon Theme] +Name=Gallery +Comment=Qt Quick Controls 2 Gallery Example Icon Theme + +Directories=20x20,20x20@2,20x20@3,20x20@4 + +[20x20] +Size=20 +Type=Fixed + +[20x20@2] +Size=20 +Scale=2 +Type=Fixed + +[20x20@3] +Size=20 +Scale=3 +Type=Fixed + +[20x20@4] +Size=20 +Scale=4 +Type=Fixed diff --git a/examples/quickcontrols2/gallery/images/+material/back.png b/examples/quickcontrols2/gallery/images/+material/back.png Binary files differdeleted file mode 100644 index ebc1000f..00000000 --- a/examples/quickcontrols2/gallery/images/+material/back.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/back@2x.png b/examples/quickcontrols2/gallery/images/+material/back@2x.png Binary files differdeleted file mode 100644 index cf6163c8..00000000 --- a/examples/quickcontrols2/gallery/images/+material/back@2x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/back@3x.png b/examples/quickcontrols2/gallery/images/+material/back@3x.png Binary files differdeleted file mode 100644 index 96376a5a..00000000 --- a/examples/quickcontrols2/gallery/images/+material/back@3x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/back@4x.png b/examples/quickcontrols2/gallery/images/+material/back@4x.png Binary files differdeleted file mode 100644 index 578ac14f..00000000 --- a/examples/quickcontrols2/gallery/images/+material/back@4x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/drawer.png b/examples/quickcontrols2/gallery/images/+material/drawer.png Binary files differdeleted file mode 100644 index 615cc817..00000000 --- a/examples/quickcontrols2/gallery/images/+material/drawer.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/drawer@2x.png b/examples/quickcontrols2/gallery/images/+material/drawer@2x.png Binary files differdeleted file mode 100644 index b1dd106d..00000000 --- a/examples/quickcontrols2/gallery/images/+material/drawer@2x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/drawer@3x.png b/examples/quickcontrols2/gallery/images/+material/drawer@3x.png Binary files differdeleted file mode 100644 index 289889bf..00000000 --- a/examples/quickcontrols2/gallery/images/+material/drawer@3x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/drawer@4x.png b/examples/quickcontrols2/gallery/images/+material/drawer@4x.png Binary files differdeleted file mode 100644 index 215e6a82..00000000 --- a/examples/quickcontrols2/gallery/images/+material/drawer@4x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/menu.png b/examples/quickcontrols2/gallery/images/+material/menu.png Binary files differdeleted file mode 100644 index f02429e9..00000000 --- a/examples/quickcontrols2/gallery/images/+material/menu.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/menu@2x.png b/examples/quickcontrols2/gallery/images/+material/menu@2x.png Binary files differdeleted file mode 100644 index 9309ad9a..00000000 --- a/examples/quickcontrols2/gallery/images/+material/menu@2x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/menu@3x.png b/examples/quickcontrols2/gallery/images/+material/menu@3x.png Binary files differdeleted file mode 100644 index 7bddf71f..00000000 --- a/examples/quickcontrols2/gallery/images/+material/menu@3x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/images/+material/menu@4x.png b/examples/quickcontrols2/gallery/images/+material/menu@4x.png Binary files differdeleted file mode 100644 index e5c23a3b..00000000 --- a/examples/quickcontrols2/gallery/images/+material/menu@4x.png +++ /dev/null diff --git a/examples/quickcontrols2/gallery/pages/DialogPage.qml b/examples/quickcontrols2/gallery/pages/DialogPage.qml index daaa7329..8bade21f 100644 --- a/examples/quickcontrols2/gallery/pages/DialogPage.qml +++ b/examples/quickcontrols2/gallery/pages/DialogPage.qml @@ -50,7 +50,7 @@ import QtQuick 2.6 import QtQuick.Layouts 1.0 -import QtQuick.Controls 2.1 +import QtQuick.Controls 2.3 ScrollablePage { id: page @@ -101,7 +101,7 @@ ScrollablePage { x: (parent.width - width) / 2 y: (parent.height - height) / 2 - parent: ApplicationWindow.overlay + parent: Overlay.overlay modal: true title: "Confirmation" @@ -134,7 +134,7 @@ ScrollablePage { y: (parent.height - height) / 2 width: Math.min(page.width, page.height) / 3 * 2 contentHeight: logo.height * 2 - parent: ApplicationWindow.overlay + parent: Overlay.overlay modal: true title: "Content" @@ -194,7 +194,7 @@ ScrollablePage { x: (parent.width - width) / 2 y: (parent.height - height) / 2 - parent: ApplicationWindow.overlay + parent: Overlay.overlay focus: true modal: true diff --git a/examples/quickcontrols2/sidepanel/doc/src/qtquickcontrols2-sidepanel.qdoc b/examples/quickcontrols2/sidepanel/doc/src/qtquickcontrols2-sidepanel.qdoc index 7e4dfce6..bc630bb8 100644 --- a/examples/quickcontrols2/sidepanel/doc/src/qtquickcontrols2-sidepanel.qdoc +++ b/examples/quickcontrols2/sidepanel/doc/src/qtquickcontrols2-sidepanel.qdoc @@ -29,10 +29,10 @@ \example sidepanel \title Qt Quick Controls 2 - Side Panel \ingroup qtquickcontrols2-examples - \brief A non-closable persistent side panel with Drawer. + \brief A persistent side panel with Drawer. - This example demonstrates how \l Drawer can be used as a non-closable - persistent side panel. + This example demonstrates how \l Drawer can be used as a persistent side + panel. \raw HTML <div class="table"><table style="background:transparent; border:0px"> @@ -52,17 +52,17 @@ When the application is in portrait mode, the drawer is an interactive side panel that can be swiped open from the left edge. It appears on - top of the content, and blocks user interaction through its modal + top of the content, blocking user interaction through its modal background. When the application is in landscape mode, the drawer and - the content are laid out side by side. + the content are laid out side-by-side. The current orientation of the application is determined by comparing the width and height of the window: \snippet sidepanel/sidepanel.qml orientation - This is used to specify whether the drawer is \l {Popup::}{modal} and - \l {Drawer::}{interactive}, and to configure its \l {Drawer::}{position} + This is used to determine whether the drawer should be \l {Popup::}{modal} + and \l {Drawer::}{interactive}, and to configure its \l {Drawer::}{position} and \l {Popup::visible}{visibility} accordingly. \quotefromfile sidepanel/sidepanel.qml diff --git a/examples/quickcontrols2/swipetoremove/doc/src/qtquickcontrols2-swipetoremove.qdoc b/examples/quickcontrols2/swipetoremove/doc/src/qtquickcontrols2-swipetoremove.qdoc index 095bd837..476667bb 100644 --- a/examples/quickcontrols2/swipetoremove/doc/src/qtquickcontrols2-swipetoremove.qdoc +++ b/examples/quickcontrols2/swipetoremove/doc/src/qtquickcontrols2-swipetoremove.qdoc @@ -29,10 +29,10 @@ \example swipetoremove \title Qt Quick Controls 2 - Swipe to Remove \ingroup qtquickcontrols2-examples - \brief Demonstrates removing list items by swipe. + \brief Demonstrates removal of list items by swipe gesture. This example demonstrates how \l SwipeDelegate can be used to implement - removal of list items by swipe. This UI pattern is often used in touch + removal of list items by swiping. This UI pattern is often used in touch user interfaces. \image qtquickcontrols2-swipetoremove.png @@ -46,7 +46,7 @@ The following snippet presents how the logic of removing items is implemented. When the swipe is \l {SwipeDelegate::swipe}{completed}, it - starts a timer tha waits a few seconds to let the user undo the remove + starts a timer that waits a few seconds to let the user undo the remove action. Once the undo timer triggers, the item is removed from the list: \snippet swipetoremove/swipetoremove.qml removal diff --git a/examples/quickcontrols2/wearable/doc/src/qtquickcontrols2-wearable.qdoc b/examples/quickcontrols2/wearable/doc/src/qtquickcontrols2-wearable.qdoc index b56b4c1d..7d4a6a23 100644 --- a/examples/quickcontrols2/wearable/doc/src/qtquickcontrols2-wearable.qdoc +++ b/examples/quickcontrols2/wearable/doc/src/qtquickcontrols2-wearable.qdoc @@ -38,7 +38,7 @@ \section1 Structure - The main .qml file \c wearable.qml consists of an ApplicationWindow, a StackView + The main .qml file, \c wearable.qml, consists of an ApplicationWindow, a StackView for a stack-based navigation model, and buttons for interactive navigation. \quotefromfile wearable/wearable.qml @@ -61,9 +61,9 @@ \section1 Styling The demo uses a custom \l {Styling Qt Quick Controls 2}{Qt Quick Controls 2 style} - embedded into the demo's resources. Since the style is specific to this particular - demo, it only needs to implement a few controls. The style also provides a singleton - type that contains various styling attributes, such as fonts and colors. + embedded into the demo's resources. The custom style is implemented for a + few controls only, as it is specific to this particular demo. It uses a + singleton type for various styling attributes, such as fonts and colors. \list \li \c qml/Style/PageIndicator.qml @@ -83,10 +83,11 @@ \section1 Custom Type - The demo application contains a custom button type implemented in \c qml/NaviButton.qml. - The navigation button is used as a home and back button in \c wearable.qml. \c NaviButton - extends the standard AbstractButton API with properties that control the slide in and slide - out transitions and the button image. + The demo application contains a custom button type implemented in + \c qml/NaviButton.qml. The navigation button is used as a home and back + button in \c wearable.qml. \c NaviButton extends the AbstractButton type + with properties that control the slide in and slide out transitions and + the button image. \quotefromfile wearable/qml/NaviButton.qml \skipuntil import "Style" @@ -100,10 +101,9 @@ \section1 Launcher Page - The application launcher, which is specified as the initial content above, is - implemented using a circular PathView in \c LauncherPage.qml. Each application is - contained within its own .qml file, which is listed in a ListModel on the launcher - page. + The application launcher is implemented using a circular PathView in + \c LauncherPage.qml. Each application is in a separate .qml file, + which is added to the ListModel on the launcher page. \quotefromfile wearable/qml/LauncherPage.qml \skipto PathView @@ -133,29 +133,28 @@ applications, data acquisition is implemented using \l XMLHttpRequest to read from local files. These files were generated by storing responses from remote servers in JSON format. This code can be easily modified to acquire - data from real remote servers. + data from remote servers. \section2 Navigation This application displays a walking route from source to destination. This - route is obtained as a response by invoking an API provided by - \l {https://www.openstreetmap.org/}. The response is in JSON format and the - corresponding JavaScript file associated with the application helps interpret - the response. Currently, it is not possible to specify the source and destination - from within the application, but it can be easily added based on the device's - capabilities. For example, user input could be implemented as screens with - input fields, or can be communicated over Bluetooth/Wifi from a paired app - running on another device such as a smart phone or PC. + route information is obtained using the REST API provided by + \l {https://www.openstreetmap.org/}. The API response is in JSON format, which + is parsed using JavaScript by the application. Currently, it is not possible + to specify the source and destination from within the application, but it can + be added based on the device's capabilities. For example, user input + could be implemented as screens with input fields, or can be communicated + over Bluetooth/Wifi from a paired application running on another device + such as a smart phone or PC. \section2 Weather This application displays weather information such as temperature, sunrise and sunset times, air pressure, and so on. This information is obtained - as a response to invoking \l {https://openweathermap.org/}. The response is - in JSON format and the corresponding JavaScript file associated with the - application helps interpret the response. As with the Navigation application, - this application can be modified by adding screens to accept location information - to obtain weather data for a given location. + from \l {https://openweathermap.org/} using its REST API. The API response is + in JSON format, which is parsed using JavaScript by the application. This + application can also be modified by adding screens to obtain weather data for + a given location. \section2 World Clock @@ -165,7 +164,7 @@ \section2 Others - The remaining applications return static data for now, but they can easily be + The remaining applications return static data for now, but they can be modified to process response data obtained from respective services. \include examples-run.qdocinc |