diff options
author | Ulf Hermann <[email protected]> | 2019-09-17 18:10:59 +0200 |
---|---|---|
committer | Ulf Hermann <[email protected]> | 2020-02-11 19:26:05 +0100 |
commit | 90b4528b846542bfa6f0723487315140b9de17b4 (patch) | |
tree | 9356c0e6b5a736b3228ca6793416d927432c101e | |
parent | 38c03709236f6a2114ace7adf1b6bdcdfe8e4e18 (diff) |
Avoid discouraged patterns in examples
In particular, use required properties where applicable, explicitly
import QtQml where we use it, avoid unqualified access into the root
scope of a component, use JavaScript functions with explicit parameters
as signal handlers.
Change-Id: I3eaaba47cc3c7a2a12d488e36f9eec145cedbb0e
Reviewed-by: Fabian Kosmale <[email protected]>
Reviewed-by: Shawn Rutledge <[email protected]>
78 files changed, 634 insertions, 421 deletions
diff --git a/examples/qml/referenceexamples/binding/example.qml b/examples/qml/referenceexamples/binding/example.qml index a89b4bc02e..b45ef6881b 100644 --- a/examples/qml/referenceexamples/binding/example.qml +++ b/examples/qml/referenceexamples/binding/example.qml @@ -62,7 +62,7 @@ BirthdayParty { shoe { size: 12; color: "white"; brand: "Nike"; price: 90.0 } } // ![0] - onPartyStarted: console.log("This party started rockin' at " + time); + onPartyStarted: (time) => { console.log("This party started rockin' at " + time); } Boy { diff --git a/examples/qml/referenceexamples/signal/example.qml b/examples/qml/referenceexamples/signal/example.qml index 42d6c44939..5d80d58867 100644 --- a/examples/qml/referenceexamples/signal/example.qml +++ b/examples/qml/referenceexamples/signal/example.qml @@ -53,7 +53,7 @@ import QtQuick 2.0 // For QColor BirthdayParty { // ![0] - onPartyStarted: console.log("This party started rockin' at " + time); + onPartyStarted: (time) => { console.log("This party started rockin' at " + time); } // ![0] host: Boy { diff --git a/examples/qml/referenceexamples/valuesource/example.qml b/examples/qml/referenceexamples/valuesource/example.qml index 0abb76261c..65d511058a 100644 --- a/examples/qml/referenceexamples/valuesource/example.qml +++ b/examples/qml/referenceexamples/valuesource/example.qml @@ -56,7 +56,7 @@ BirthdayParty { HappyBirthdaySong on announcement { name: "Bob Jones" } // ![0] - onPartyStarted: console.log("This party started rockin' at " + time); + onPartyStarted: (time) => { console.log("This party started rockin' at " + time); } host: Boy { diff --git a/examples/quick/animation/basics/property-animation.qml b/examples/quick/animation/basics/property-animation.qml index a764c395ee..8d640c9dda 100644 --- a/examples/quick/animation/basics/property-animation.qml +++ b/examples/quick/animation/basics/property-animation.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Item { diff --git a/examples/quick/animation/behaviors/tvtennis.qml b/examples/quick/animation/behaviors/tvtennis.qml index 89d912777a..261f603de6 100644 --- a/examples/quick/animation/behaviors/tvtennis.qml +++ b/examples/quick/animation/behaviors/tvtennis.qml @@ -116,6 +116,13 @@ Rectangle { Rectangle { color: "#1e1b18"; x: page.width/2+50; y: 10; width: 20; height: 40 } Repeater { model: page.height / 20 - Rectangle { color: "#328930"; x: page.width/2-5; y: index * 20; width: 10; height: 10 } + Rectangle { + required property int index + color: "#328930" + x: page.width / 2 - 5 + y: index * 20 + width: 10 + height: 10 + } } } diff --git a/examples/quick/animation/behaviors/wigglytext.qml b/examples/quick/animation/behaviors/wigglytext.qml index cc2e086b51..81d4a8aef9 100644 --- a/examples/quick/animation/behaviors/wigglytext.qml +++ b/examples/quick/animation/behaviors/wigglytext.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Rectangle { @@ -58,7 +59,7 @@ Rectangle { width: 320; height: 480; color: "#474747"; focus: true - Keys.onPressed: { + Keys.onPressed: (event) => { if (event.key == Qt.Key_Delete || event.key == Qt.Key_Backspace) container.remove() else if (event.text != "") { diff --git a/examples/quick/animation/pathanimation/pathanimation.qml b/examples/quick/animation/pathanimation/pathanimation.qml index b98fbebefc..ae96b32680 100644 --- a/examples/quick/animation/pathanimation/pathanimation.qml +++ b/examples/quick/animation/pathanimation/pathanimation.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Rectangle { diff --git a/examples/quick/animation/pathinterpolator/pathinterpolator.qml b/examples/quick/animation/pathinterpolator/pathinterpolator.qml index 0c0d7bad46..07a82fc916 100644 --- a/examples/quick/animation/pathinterpolator/pathinterpolator.qml +++ b/examples/quick/animation/pathinterpolator/pathinterpolator.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Rectangle { diff --git a/examples/quick/animation/states/states.qml b/examples/quick/animation/states/states.qml index 498fb6867c..5ff8e5318c 100644 --- a/examples/quick/animation/states/states.qml +++ b/examples/quick/animation/states/states.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Rectangle { diff --git a/examples/quick/draganddrop/tiles/DragTile.qml b/examples/quick/draganddrop/tiles/DragTile.qml index 78fe7a483a..47f0ebed5e 100644 --- a/examples/quick/draganddrop/tiles/DragTile.qml +++ b/examples/quick/draganddrop/tiles/DragTile.qml @@ -53,7 +53,9 @@ import QtQuick 2.0 //! [0] Item { id: root - property string colorKey + + required property string colorKey + required property int modelData width: 64; height: 64 @@ -74,9 +76,9 @@ Item { anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter - color: colorKey + color: root.colorKey - Drag.keys: [ colorKey ] + Drag.keys: [ root.colorKey ] Drag.active: mouseArea.drag.active Drag.hotSpot.x: 32 Drag.hotSpot.y: 32 @@ -85,7 +87,7 @@ Item { anchors.fill: parent color: "white" font.pixelSize: 48 - text: modelData + 1 + text: root.modelData + 1 horizontalAlignment:Text.AlignHCenter verticalAlignment: Text.AlignVCenter } diff --git a/examples/quick/draganddrop/tiles/DropTile.qml b/examples/quick/draganddrop/tiles/DropTile.qml index de4c0dee44..bf7101f0f6 100644 --- a/examples/quick/draganddrop/tiles/DropTile.qml +++ b/examples/quick/draganddrop/tiles/DropTile.qml @@ -64,7 +64,7 @@ DropArea { id: dropRectangle anchors.fill: parent - color: colorKey + color: dragTarget.colorKey states: [ State { diff --git a/examples/quick/externaldraganddrop/DragAndDropTextItem.qml b/examples/quick/externaldraganddrop/DragAndDropTextItem.qml index 9858a961c9..605dc07434 100644 --- a/examples/quick/externaldraganddrop/DragAndDropTextItem.qml +++ b/examples/quick/externaldraganddrop/DragAndDropTextItem.qml @@ -71,14 +71,18 @@ Rectangle { id: dropArea anchors.fill: parent keys: ["text/plain"] - onEntered: if (!acceptDropCB.checked) { - drag.accepted = false - rejectAnimation.start() + onEntered: (drag) => { + if (!acceptDropCB.checked) { + drag.accepted = false + rejectAnimation.start() + } } - onDropped: if (drop.hasText && acceptDropCB.checked) { - if (drop.proposedAction == Qt.MoveAction || drop.proposedAction == Qt.CopyAction) { - item.display = drop.text - drop.acceptProposedAction() + onDropped: (drop) => { + if (drop.hasText && acceptDropCB.checked) { + if (drop.proposedAction == Qt.MoveAction || drop.proposedAction == Qt.CopyAction) { + item.display = drop.text + drop.acceptProposedAction() + } } } } @@ -95,7 +99,10 @@ Rectangle { Drag.hotSpot.y: 0 Drag.mimeData: { "text/plain": item.display } Drag.dragType: Drag.Automatic - Drag.onDragFinished: if (dropAction == Qt.MoveAction) item.display = "" + Drag.onDragFinished: (dropAction) => { + if (dropAction == Qt.MoveAction) + item.display = "" + } } Examples.CheckBox { id: acceptDropCB diff --git a/examples/quick/imageelements/animatedsprite.qml b/examples/quick/imageelements/animatedsprite.qml index 0c6bf5e28d..cc5226882a 100644 --- a/examples/quick/imageelements/animatedsprite.qml +++ b/examples/quick/imageelements/animatedsprite.qml @@ -73,7 +73,7 @@ Item { MouseArea { anchors.fill: parent acceptedButtons: Qt.LeftButton | Qt.RightButton - onClicked: { + onClicked: (mouse) => { if (!sprite.running) sprite.start(); if (!sprite.paused) diff --git a/examples/quick/imageelements/content/BorderImageSelector.qml b/examples/quick/imageelements/content/BorderImageSelector.qml index 93ff5136bc..d8c2101be7 100644 --- a/examples/quick/imageelements/content/BorderImageSelector.qml +++ b/examples/quick/imageelements/content/BorderImageSelector.qml @@ -93,7 +93,10 @@ Item { Repeater { model: [ "Scale", "Repeat", "Scale/Repeat", "Round" ] delegate: Text { - text: model.modelData + required property string modelData + required property int index + + text: modelData anchors.verticalCenter: parent.verticalCenter x: (index - selector.curIdx) * 80 + 140 diff --git a/examples/quick/imageelements/content/MyBorderImage.qml b/examples/quick/imageelements/content/MyBorderImage.qml index 01d26a9630..3198de3bf1 100644 --- a/examples/quick/imageelements/content/MyBorderImage.qml +++ b/examples/quick/imageelements/content/MyBorderImage.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Item { diff --git a/examples/quick/keyinteraction/focus/Core/ContextMenu.qml b/examples/quick/keyinteraction/focus/Core/ContextMenu.qml index c5430aa650..31b5e1b83d 100644 --- a/examples/quick/keyinteraction/focus/Core/ContextMenu.qml +++ b/examples/quick/keyinteraction/focus/Core/ContextMenu.qml @@ -52,6 +52,7 @@ import QtQuick 2.1 FocusScope { id: container + required property Item keyRightTarget property bool open: false @@ -62,7 +63,7 @@ FocusScope { anchors.fill: parent color: "#D1DBBD" focus: true - Keys.onRightPressed: mainView.focus = true + Keys.onRightPressed: container.keyRightTarget.focus = true Text { anchors { top: parent.top; horizontalCenter: parent.horizontalCenter; margins: 30 } diff --git a/examples/quick/keyinteraction/focus/Core/GridMenu.qml b/examples/quick/keyinteraction/focus/Core/GridMenu.qml index 3f62adc792..78d6654957 100644 --- a/examples/quick/keyinteraction/focus/Core/GridMenu.qml +++ b/examples/quick/keyinteraction/focus/Core/GridMenu.qml @@ -51,12 +51,11 @@ import QtQuick 2.1 FocusScope { + id: menu property alias interactive: gridView.interactive - - onActiveFocusChanged: { - if (activeFocus) - mainView.state = "showGridViews" - } + required property Item keyUpTarget + required property Item keyDownTarget + required property Item keyLeftTarget Rectangle { anchors.fill: parent @@ -73,13 +72,15 @@ FocusScope { focus: true model: 12 - KeyNavigation.up: tabMenu - KeyNavigation.down: listMenu - KeyNavigation.left: contextMenu + KeyNavigation.up: menu.keyUpTarget + KeyNavigation.down: menu.keyDownTarget + KeyNavigation.left: menu.keyLeftTarget delegate: Item { id: container - width: GridView.view.cellWidth; height: GridView.view.cellHeight + width: GridView.view.cellWidth + height: GridView.view.cellHeight + required property int index Rectangle { id: content @@ -97,7 +98,7 @@ FocusScope { hoverEnabled: true onClicked: { - container.GridView.view.currentIndex = index + container.GridView.view.currentIndex = container.index container.forceActiveFocus() } } diff --git a/examples/quick/keyinteraction/focus/Core/ListMenu.qml b/examples/quick/keyinteraction/focus/Core/ListMenu.qml index d8e9daba78..694ae3cac6 100644 --- a/examples/quick/keyinteraction/focus/Core/ListMenu.qml +++ b/examples/quick/keyinteraction/focus/Core/ListMenu.qml @@ -48,21 +48,22 @@ ** ****************************************************************************/ +import QtQml 2.1 import QtQuick 2.1 FocusScope { + id: menu clip: true - - onActiveFocusChanged: { - if (activeFocus) - mainView.state = "showListViews" - } + required property Item keyUpTarget + required property Item keyLeftTarget ListView { id: list1 y: activeFocus ? 10 : 40; width: parent.width / 3; height: parent.height - 20 focus: true - KeyNavigation.up: gridMenu; KeyNavigation.left: contextMenu; KeyNavigation.right: list2 + KeyNavigation.up: menu.keyUpTarget + KeyNavigation.left: menu.keyLeftTarget + KeyNavigation.right: list2 model: 10; cacheBuffer: 200 delegate: ListViewDelegate {} @@ -74,7 +75,9 @@ FocusScope { ListView { id: list2 y: activeFocus ? 10 : 40; x: parseInt(parent.width / 3); width: parent.width / 3; height: parent.height - 20 - KeyNavigation.up: gridMenu; KeyNavigation.left: list1; KeyNavigation.right: list3 + KeyNavigation.up: menu.keyUpTarget + KeyNavigation.left: list1 + KeyNavigation.right: list3 model: 10; cacheBuffer: 200 delegate: ListViewDelegate {} @@ -86,7 +89,8 @@ FocusScope { ListView { id: list3 y: activeFocus ? 10 : 40; x: parseInt(2 * parent.width / 3); width: parent.width / 3; height: parent.height - 20 - KeyNavigation.up: gridMenu; KeyNavigation.left: list2 + KeyNavigation.up: menu.keyUpTarget + KeyNavigation.left: list2 model: 10; cacheBuffer: 200 delegate: ListViewDelegate {} diff --git a/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml b/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml index b1dde9ddc5..5a2957eab0 100644 --- a/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml +++ b/examples/quick/keyinteraction/focus/Core/ListViewDelegate.qml @@ -52,6 +52,8 @@ import QtQuick 2.1 Item { id: container + required property int index + width: ListView.view.width; height: 60; anchors.leftMargin: 10; anchors.rightMargin: 10 Rectangle { @@ -67,7 +69,7 @@ Item { Text { id: label anchors.centerIn: content - text: "List element " + (index + 1) + text: "List element " + (container.index + 1) color: "#193441" font.pixelSize: 14 } @@ -78,7 +80,7 @@ Item { hoverEnabled: true onClicked: { - container.ListView.view.currentIndex = index + container.ListView.view.currentIndex = container.index container.forceActiveFocus() } } diff --git a/examples/quick/keyinteraction/focus/Core/TabMenu.qml b/examples/quick/keyinteraction/focus/Core/TabMenu.qml index a40e070b2c..11b3d005c3 100644 --- a/examples/quick/keyinteraction/focus/Core/TabMenu.qml +++ b/examples/quick/keyinteraction/focus/Core/TabMenu.qml @@ -51,10 +51,9 @@ import QtQuick 2.1 FocusScope { - onActiveFocusChanged: { - if (activeFocus) - mainView.state = "showTabViews" - } + id: menu + required property Item keyUpTarget + required property Item keyDownTarget Rectangle { anchors.fill: parent @@ -76,8 +75,8 @@ FocusScope { activeFocusOnTab: true focus: true - KeyNavigation.up: listMenu - KeyNavigation.down: gridMenu + KeyNavigation.up: menu.keyUpTarget + KeyNavigation.down: menu.keyDownTarget Rectangle { id: content diff --git a/examples/quick/keyinteraction/focus/focus.qml b/examples/quick/keyinteraction/focus/focus.qml index e07df57697..9db9ab48bc 100644 --- a/examples/quick/keyinteraction/focus/focus.qml +++ b/examples/quick/keyinteraction/focus/focus.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.1 import QtQuick 2.1 import "Core" @@ -67,20 +68,45 @@ Rectangle { id: tabMenu y: 160; width: parent.width; height: 160 + keyUpTarget: listMenu + keyDownTarget: gridMenu + focus: true activeFocusOnTab: true + + onActiveFocusChanged: { + if (activeFocus) + mainView.state = "showTabViews" + } } GridMenu { id: gridMenu y: 320; width: parent.width; height: 320 activeFocusOnTab: true + + keyUpTarget: tabMenu + keyDownTarget: listMenu + keyLeftTarget: contextMenu + + onActiveFocusChanged: { + if (activeFocus) + mainView.state = "showGridViews" + } } ListMenu { id: listMenu y: 640; width: parent.width; height: 320 activeFocusOnTab: true + + keyUpTarget: gridMenu + keyLeftTarget: contextMenu + + onActiveFocusChanged: { + if (activeFocus) + mainView.state = "showListViews" + } } Rectangle { @@ -129,7 +155,13 @@ Rectangle { } } - ContextMenu { id: contextMenu; x: -265; width: 260; height: parent.height } + ContextMenu { + keyRightTarget: mainView + id: contextMenu + x: -265 + width: 260 + height: parent.height + } states: State { name: "contextMenuOpen" diff --git a/examples/quick/localstorage/localstorage/Header.qml b/examples/quick/localstorage/localstorage/Header.qml index e9446de55e..47879500a7 100644 --- a/examples/quick/localstorage/localstorage/Header.qml +++ b/examples/quick/localstorage/localstorage/Header.qml @@ -59,6 +59,9 @@ Item { width: Screen.width / 2 height: Screen.height / 7 + required property ListView listView + required property Text statusText + function insertrec() { var rowid = parseInt(JS.dbInsert(dateInput.text, descInput.text, distInput.text), 10) if (rowid) { @@ -148,7 +151,7 @@ Item { } onEditingFinished: { if (dateInput.text == "") { - statustext.text = "Please fill in the date" + root.statusText.text = "Please fill in the date" dateInput.forceActiveFocus() } } @@ -161,10 +164,10 @@ Item { activeFocusOnTab: true onEditingFinished: { if (descInput.text.length < 8) { - statustext.text = "Enter a description of minimum 8 characters" + root.statusText.text = "Enter a description of minimum 8 characters" descInput.forceActiveFocus() } else { - statustext.text = "" + root.statusText.text = "" } } } @@ -179,7 +182,7 @@ Item { } onEditingFinished: { if (distInput.text == "") { - statustext.text = "Please fill in the distance" + root.statusText.text = "Please fill in the distance" distInput.forceActiveFocus() } } diff --git a/examples/quick/localstorage/localstorage/MyDelegate.qml b/examples/quick/localstorage/localstorage/MyDelegate.qml index 63a83bfbae..e8575d4f7a 100644 --- a/examples/quick/localstorage/localstorage/MyDelegate.qml +++ b/examples/quick/localstorage/localstorage/MyDelegate.qml @@ -54,18 +54,27 @@ import QtQuick.Layouts 1.1 import "Database.js" as JS Item { + id: delegate + width: parent.width height: rDate.implicitHeight + required property int index + required property int distance + required property string trip_desc + required property string date + + signal clicked() + Rectangle { id: baseRec anchors.fill: parent opacity: 0.8 - color: index % 2 ? "lightgrey" : "grey" + color: delegate.index % 2 ? "lightgrey" : "grey" MouseArea { anchors.fill: parent - onClicked: listView.currentIndex = index + onClicked: delegate.clicked() } GridLayout { anchors.fill:parent @@ -73,21 +82,21 @@ Item { Text { id: rDate - text: date + text: delegate.date font.pixelSize: 22 Layout.preferredWidth: parent.width / 4 color: "black" } Text { id: rDesc - text: trip_desc + text: delegate.trip_desc Layout.fillWidth: true font.pixelSize: 22 color: "black" } Text { id: rDistance - text: distance + text: delegate.distance font.pixelSize: 22 Layout.alignment: Qt.AlignRight color: "black" diff --git a/examples/quick/localstorage/localstorage/localstorage.qml b/examples/quick/localstorage/localstorage/localstorage.qml index 41f5cbd561..418aab838e 100644 --- a/examples/quick/localstorage/localstorage/localstorage.qml +++ b/examples/quick/localstorage/localstorage/localstorage.qml @@ -55,6 +55,7 @@ import QtQuick.LocalStorage 2.0 import "Database.js" as JS Window { + id: window visible: true width: Screen.width / 2 height: Screen.height / 1.8 @@ -72,19 +73,21 @@ Window { Header { id: input Layout.fillWidth: true + listView: listView + statusText: statustext } RowLayout { MyButton { text: "New" onClicked: { input.initrec_new() - creatingNewEntry = true + window.creatingNewEntry = true listView.model.setProperty(listView.currentIndex, "id", 0) } } MyButton { id: saveButton - enabled: (creatingNewEntry || editingEntry) && listView.currentIndex != -1 + enabled: (window.creatingNewEntry || window.editingEntry) && listView.currentIndex != -1 text: "Save" onClicked: { var insertedRow = false; @@ -109,8 +112,8 @@ Window { if (insertedRow) { input.initrec() - creatingNewEntry = false - editingEntry = false + window.creatingNewEntry = false + window.editingEntry = false listView.forceLayout() } } @@ -118,20 +121,20 @@ Window { MyButton { id: editButton text: "Edit" - enabled: !creatingNewEntry && !editingEntry && listView.currentIndex != -1 + enabled: !window.creatingNewEntry && !window.editingEntry && listView.currentIndex != -1 onClicked: { input.editrec(listView.model.get(listView.currentIndex).date, listView.model.get(listView.currentIndex).trip_desc, listView.model.get(listView.currentIndex).distance, listView.model.get(listView.currentIndex).id) - editingEntry = true + window.editingEntry = true } } MyButton { id: deleteButton text: "Delete" - enabled: !creatingNewEntry && listView.currentIndex != -1 + enabled: !window.creatingNewEntry && listView.currentIndex != -1 onClicked: { JS.dbDeleteRow(listView.model.get(listView.currentIndex).id) listView.model.remove(listView.currentIndex, 1) @@ -145,7 +148,7 @@ Window { MyButton { id: cancelButton text: "Cancel" - enabled: (creatingNewEntry || editingEntry) && listView.currentIndex != -1 + enabled: (window.creatingNewEntry || window.editingEntry) && listView.currentIndex != -1 onClicked: { if (listView.model.get(listView.currentIndex).id === 0) { // This entry had an id of 0, which means it was being created and hadn't @@ -153,8 +156,8 @@ Window { listView.model.remove(listView.currentIndex, 1) } listView.forceLayout() - creatingNewEntry = false - editingEntry = false + window.creatingNewEntry = false + window.editingEntry = false input.initrec() } } @@ -176,9 +179,11 @@ Window { Layout.fillWidth: true Layout.fillHeight: true model: MyModel {} - delegate: MyDelegate {} + delegate: MyDelegate { + onClicked: listView.currentIndex = index + } // Don't allow changing the currentIndex while the user is creating/editing values. - enabled: !creatingNewEntry && !editingEntry + enabled: !window.creatingNewEntry && !window.editingEntry highlight: highlightBar highlightFollowsCurrentItem: true diff --git a/examples/quick/models/abstractitemmodel/main.cpp b/examples/quick/models/abstractitemmodel/main.cpp index 515f47ec30..dd5b368c6b 100644 --- a/examples/quick/models/abstractitemmodel/main.cpp +++ b/examples/quick/models/abstractitemmodel/main.cpp @@ -68,10 +68,8 @@ int main(int argc, char ** argv) QQuickView view; view.setResizeMode(QQuickView::SizeRootObjectToView); - QQmlContext *ctxt = view.rootContext(); - ctxt->setContextProperty("myModel", &model); + view.setInitialProperties({{"model", QVariant::fromValue(&model)}}); //![0] - view.setSource(QUrl("qrc:view.qml")); view.show(); diff --git a/examples/quick/models/abstractitemmodel/view.qml b/examples/quick/models/abstractitemmodel/view.qml index f699aa40c8..2b9f87df92 100644 --- a/examples/quick/models/abstractitemmodel/view.qml +++ b/examples/quick/models/abstractitemmodel/view.qml @@ -53,8 +53,14 @@ import QtQuick 2.0 ListView { width: 200; height: 250 - model: myModel - delegate: Text { text: "Animal: " + type + ", " + size } + required model + + delegate: Text { + required property string type + required property string size + + text: "Animal: " + type + ", " + size + } } //![0] diff --git a/examples/quick/models/objectlistmodel/main.cpp b/examples/quick/models/objectlistmodel/main.cpp index 977bbfb93b..8fbe7c183c 100644 --- a/examples/quick/models/objectlistmodel/main.cpp +++ b/examples/quick/models/objectlistmodel/main.cpp @@ -68,16 +68,16 @@ int main(int argc, char ** argv) { QGuiApplication app(argc, argv); - QList<QObject*> dataList; - dataList.append(new DataObject("Item 1", "red")); - dataList.append(new DataObject("Item 2", "green")); - dataList.append(new DataObject("Item 3", "blue")); - dataList.append(new DataObject("Item 4", "yellow")); + QList<QObject *> dataList = { + new DataObject("Item 1", "red"), + new DataObject("Item 2", "green"), + new DataObject("Item 3", "blue"), + new DataObject("Item 4", "yellow") + }; QQuickView view; view.setResizeMode(QQuickView::SizeRootObjectToView); - QQmlContext *ctxt = view.rootContext(); - ctxt->setContextProperty("myModel", QVariant::fromValue(dataList)); + view.setInitialProperties({{ "model", QVariant::fromValue(dataList) }}); //![0] view.setSource(QUrl("qrc:view.qml")); diff --git a/examples/quick/models/objectlistmodel/view.qml b/examples/quick/models/objectlistmodel/view.qml index d9a32aff14..ba0c905e1e 100644 --- a/examples/quick/models/objectlistmodel/view.qml +++ b/examples/quick/models/objectlistmodel/view.qml @@ -53,13 +53,15 @@ import QtQuick 2.0 //![0] ListView { width: 100; height: 100 + required model - model: myModel delegate: Rectangle { + required color + required property string name + height: 25 width: 100 - color: model.modelData.color - Text { text: name } + Text { text: parent.name } } } //![0] diff --git a/examples/quick/models/stringlistmodel/main.cpp b/examples/quick/models/stringlistmodel/main.cpp index 6b4db422a6..d9de69b3aa 100644 --- a/examples/quick/models/stringlistmodel/main.cpp +++ b/examples/quick/models/stringlistmodel/main.cpp @@ -68,15 +68,15 @@ int main(int argc, char ** argv) QGuiApplication app(argc, argv); //![0] - QStringList dataList; - dataList.append("Item 1"); - dataList.append("Item 2"); - dataList.append("Item 3"); - dataList.append("Item 4"); + QStringList dataList = { + "Item 1", + "Item 2", + "Item 3", + "Item 4" + }; QQuickView view; - QQmlContext *ctxt = view.rootContext(); - ctxt->setContextProperty("myModel", QVariant::fromValue(dataList)); + view.setInitialProperties({{ "model", QVariant::fromValue(dataList) }}); //![0] view.setSource(QUrl("qrc:view.qml")); diff --git a/examples/quick/models/stringlistmodel/view.qml b/examples/quick/models/stringlistmodel/view.qml index f74b7db1c1..e392284d0f 100644 --- a/examples/quick/models/stringlistmodel/view.qml +++ b/examples/quick/models/stringlistmodel/view.qml @@ -52,13 +52,15 @@ import QtQuick 2.0 //![0] ListView { - width: 100; height: 100 + width: 100 + height: 100 + required model - model: myModel delegate: Rectangle { + required property string modelData height: 25 width: 100 - Text { text: modelData } + Text { text: parent.modelData } } } //![0] diff --git a/examples/quick/mousearea/mousearea-wheel-example.qml b/examples/quick/mousearea/mousearea-wheel-example.qml index 44b9216285..5e8fba3ac3 100644 --- a/examples/quick/mousearea/mousearea-wheel-example.qml +++ b/examples/quick/mousearea/mousearea-wheel-example.qml @@ -63,6 +63,8 @@ Rectangle { model: ["#9ACD32", "#EEEEEE", "#FFD700", "#87CEEB"] Rectangle { + required property color modelData + property real scaleFactor: 1 height: 40 * scaleFactor diff --git a/examples/quick/mousearea/mousearea.qml b/examples/quick/mousearea/mousearea.qml index 1540d85fdd..cecbc2cfc8 100644 --- a/examples/quick/mousearea/mousearea.qml +++ b/examples/quick/mousearea/mousearea.qml @@ -76,7 +76,7 @@ Rectangle { onEntered: info.text = 'Entered' onExited: info.text = 'Exited (pressed=' + pressed + ')' - onPressed: { + onPressed: (mouse) => { if (mouse.button == Qt.LeftButton) buttonID = 'LeftButton' else if (mouse.button == Qt.RightButton) @@ -139,14 +139,14 @@ Rectangle { + ' (' + posInBox.x + ',' + posInBox.y + ' in window)' } - onReleased: { + onReleased: (mouse) => { btn.text = 'Released (isClick=' + mouse.isClick + ' wasHeld=' + mouse.wasHeld + ')' posInfo.text = '' } //! [clicks] onPressAndHold: btn.text = 'Press and hold' - onClicked: btn.text = 'Clicked (wasHeld=' + mouse.wasHeld + ')' + onClicked: (mouse) => { btn.text = 'Clicked (wasHeld=' + mouse.wasHeld + ')' } onDoubleClicked: btn.text = 'Double clicked' //! [clicks] } diff --git a/examples/quick/particles/affectors/content/customaffector.qml b/examples/quick/particles/affectors/content/customaffector.qml index 71646bcf39..6fabfb3ab2 100644 --- a/examples/quick/particles/affectors/content/customaffector.qml +++ b/examples/quick/particles/affectors/content/customaffector.qml @@ -81,7 +81,7 @@ Item { property real velocity: 1.5 width: parent.width height: parent.height - 100 - onAffectParticles: { + onAffectParticles: (particles, dt) => { /* //Linear movement if (particle.r == 0) { particle.r = Math.random() > 0.5 ? -1 : 1; @@ -117,7 +117,7 @@ Item { width: parent.width + 120 height: 100 anchors.bottom: parent.bottom - onAffectParticles: { + onAffectParticles: (particles, dt) => { for (var i=0; i<particles.length; i++) { var particle = particles[i]; var pseudoRand = (Math.floor(particle.t*1327) % 10) + 1; diff --git a/examples/quick/particles/affectors/content/groupgoal.qml b/examples/quick/particles/affectors/content/groupgoal.qml index 6472a3b450..9910531a98 100644 --- a/examples/quick/particles/affectors/content/groupgoal.qml +++ b/examples/quick/particles/affectors/content/groupgoal.qml @@ -62,7 +62,7 @@ Rectangle { Text { color: "white" anchors.right: parent.right - text: score + text: root.score } ParticleSystem { @@ -96,7 +96,7 @@ Rectangle { ParticleGroup { name: "lit" duration: 10000 - onEntered: score++; + onEntered: root.score++ TrailEmitter { id: fireballFlame group: "flame" diff --git a/examples/quick/particles/emitters/content/burstandpulse.qml b/examples/quick/particles/emitters/content/burstandpulse.qml index 8bd19ed8ed..d3c38c2360 100644 --- a/examples/quick/particles/emitters/content/burstandpulse.qml +++ b/examples/quick/particles/emitters/content/burstandpulse.qml @@ -52,6 +52,8 @@ import QtQuick 2.0 import QtQuick.Particles 2.0 Rectangle { + id: root + width: 320 height: 480 color: "black" @@ -63,12 +65,12 @@ Rectangle { repeat: true onTriggered: { //! [0] - if (lastWasPulse) { + if (root.lastWasPulse) { burstEmitter.burst(500); - lastWasPulse = false; + root.lastWasPulse = false; } else { pulseEmitter.pulse(500); - lastWasPulse = true; + root.lastWasPulse = true; } //! [0] } diff --git a/examples/quick/particles/emitters/content/customemitter.qml b/examples/quick/particles/emitters/content/customemitter.qml index aa8ca6b2f9..f6aea13d08 100644 --- a/examples/quick/particles/emitters/content/customemitter.qml +++ b/examples/quick/particles/emitters/content/customemitter.qml @@ -79,7 +79,7 @@ ParticleSystem { size: 12 anchors.centerIn: parent //! [0] - onEmitParticles: { + onEmitParticles: (particles) => { for (var i=0; i<particles.length; i++) { var particle = particles[i]; particle.startSize = Math.max(02,Math.min(492,Math.tan(particle.t/2)*24)); @@ -90,8 +90,8 @@ ParticleSystem { theta /= 6.0; theta *= 2.0*Math.PI; theta += sys.convert(sys.petalRotation);//Convert from degrees to radians - particle.initialVX = petalLength * Math.cos(theta); - particle.initialVY = petalLength * Math.sin(theta); + particle.initialVX = sys.petalLength * Math.cos(theta); + particle.initialVY = sys.petalLength * Math.sin(theta); particle.initialAX = particle.initialVX * -0.5; particle.initialAY = particle.initialVY * -0.5; } diff --git a/examples/quick/particles/imageparticle/content/sharing.qml b/examples/quick/particles/imageparticle/content/sharing.qml index a24d9fd7c7..13b0dadf85 100644 --- a/examples/quick/particles/imageparticle/content/sharing.qml +++ b/examples/quick/particles/imageparticle/content/sharing.qml @@ -56,6 +56,8 @@ import QtQuick 2.0 import QtQuick.Particles 2.0 Rectangle { + id: root + property real delegateHeight: 65 width: 200; height: 300 gradient: Gradient { @@ -66,20 +68,26 @@ Rectangle { // Define a delegate component. A component will be // instantiated for each visible item in the list. component PetDelegate: Item { - id: wrapper - width: 200; height: delegateHeight + id: pet + width: 200; height: root.delegateHeight z: 10 + + required property int index + required property string name + required property string type + required property int age + Column { - Text {color: "white"; text: name; font.pixelSize: 18 } - Text {color: "white"; text: 'Type: ' + type; font.pixelSize: 14 } - Text {color: "white"; text: 'Age: ' + age; font.pixelSize: 14 } + Text {color: "white"; text: pet.name; font.pixelSize: 18 } + Text {color: "white"; text: 'Type: ' + pet.type; font.pixelSize: 14 } + Text {color: "white"; text: 'Age: ' + pet.age; font.pixelSize: 14 } } - MouseArea { anchors.fill: parent; onClicked: listView.currentIndex = index; } + MouseArea { anchors.fill: parent; onClicked: listView.currentIndex = pet.index; } // indent the item if it is the current item states: State { name: "Current" - when: wrapper.ListView.isCurrentItem - PropertyChanges { target: wrapper; x: 20 } + when: pet.ListView.isCurrentItem + PropertyChanges { target: pet; x: 20 } } transitions: Transition { NumberAnimation { properties: "x"; duration: 200 } @@ -89,7 +97,7 @@ Rectangle { // Define a highlight with customized movement between items. component HighlightBar : Rectangle { z: 0 - width: 200; height: delegateHeight + width: 200; height: root.delegateHeight gradient: Gradient { GradientStop { position: 0.0; color: "#99FF99" } GradientStop { position: 1.0; color: "#88FF88" } diff --git a/examples/quick/particles/itemparticle/particleview.qml b/examples/quick/particles/itemparticle/particleview.qml index 3b412e37e5..8eb18dc283 100644 --- a/examples/quick/particles/itemparticle/particleview.qml +++ b/examples/quick/particles/itemparticle/particleview.qml @@ -156,7 +156,7 @@ Item { interval: 800 onTriggered: { force.enabled = false; - mp.take(alertItem, true); + mp.take(root.alertItem, true); centerEmitter.burst(1); } } @@ -216,6 +216,11 @@ Item { Component { id: theDelegate Image { + required property int index + required property string title + required property string media + required property string thumbnail + id: image antialiasing: true; source: thumbnail @@ -237,7 +242,7 @@ Item { width: parent.paintedWidth + 1 height: parent.paintedHeight + 1 color: "black" - opacity: darken * (1 - depth) + opacity: image.darken * (1 - image.depth) antialiasing: true; } Text { @@ -247,7 +252,7 @@ Item { width: parent.paintedWidth - 4 horizontalAlignment: Text.AlignHCenter elide: Text.ElideRight - text: title + text: image.title color: "black" } ItemParticle.onDetached: mp.take(image); // respawns @@ -277,7 +282,7 @@ Item { } PropertyChanges { target: image - source: media + source: image.media x: 0 y: 0 width: root.width diff --git a/examples/quick/positioners/positioners-transitions.qml b/examples/quick/positioners/positioners-transitions.qml index fbaa05c81c..d4f3772c4e 100644 --- a/examples/quick/positioners/positioners-transitions.qml +++ b/examples/quick/positioners/positioners-transitions.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 Item { @@ -215,9 +216,9 @@ Item { opacity: page.effectiveOpacity } - Rectangle { color: "#80c342"; width:page. smallSize; height: page.smallSize } - Rectangle { color: "#14aaff"; width: smallSize; height: page.smallSize } - Rectangle { color: "#6400aa"; width: page.page.smallSize; height: page.smallSize } + Rectangle { color: "#80c342"; width: page.smallSize; height: page.smallSize } + Rectangle { color: "#14aaff"; width: page.smallSize; height: page.smallSize } + Rectangle { color: "#6400aa"; width: page.smallSize; height: page.smallSize } } Flow { diff --git a/examples/quick/quick-accessibility/content/Slider.qml b/examples/quick/quick-accessibility/content/Slider.qml index aa425797a7..241e5d804e 100644 --- a/examples/quick/quick-accessibility/content/Slider.qml +++ b/examples/quick/quick-accessibility/content/Slider.qml @@ -72,7 +72,7 @@ Rectangle { x: 1 y: 1 height: parent.height - 2 - width: ((parent.width - 2) / maximumValue) * value + width: ((parent.width - 2) / slider.maximumValue) * slider.value color: "lightgrey" Behavior on width { NumberAnimation { duration: 50 } @@ -88,8 +88,9 @@ Rectangle { MouseArea { anchors.fill: parent - onClicked: { - var pos = mouse.x / slider.width * (maximumValue - minimumValue) + minimumValue + onClicked: (mouse) => { + var pos = mouse.x / slider.width * (slider.maximumValue - slider.minimumValue) + + slider.minimumValue slider.value = pos } } diff --git a/examples/quick/righttoleft/layoutdirection/layoutdirection.qml b/examples/quick/righttoleft/layoutdirection/layoutdirection.qml index 4e3e93852c..de111ea025 100644 --- a/examples/quick/righttoleft/layoutdirection/layoutdirection.qml +++ b/examples/quick/righttoleft/layoutdirection/layoutdirection.qml @@ -84,8 +84,8 @@ Rectangle { Repeater { model: 3 Loader { - property int value: index - sourceComponent: positionerDelegate + required property int index + sourceComponent: PositionerDelegate {} } } } @@ -106,8 +106,8 @@ Rectangle { Repeater { model: 8 Loader { - property int value: index - sourceComponent: positionerDelegate + required property int index + sourceComponent: PositionerDelegate {} } } } @@ -128,8 +128,8 @@ Rectangle { Repeater { model: 8 Loader { - property int value: index - sourceComponent: positionerDelegate + required property int index + sourceComponent: PositionerDelegate {} } } } @@ -152,7 +152,7 @@ Rectangle { layoutDirection: root.direction orientation: Qt.Horizontal model: 48 - delegate: viewDelegate + delegate: ViewDelegate {} } Text { @@ -166,7 +166,7 @@ Rectangle { cellWidth: 50; cellHeight: 50 layoutDirection: root.direction model: 48 - delegate: viewDelegate + delegate: ViewDelegate {} } Rectangle { @@ -230,37 +230,36 @@ Rectangle { } } - Component { - id: positionerDelegate + component PositionerDelegate : Rectangle { + width: 40 + height: 40 + property int lightness: parent.index + 1; + color: Qt.rgba(0.8 / lightness, 0.8 / lightness, 0.8 / lightness, 1.0) + Text { + text: parent.lightness + color: "white" + font.pixelSize: 18 + anchors.centerIn: parent + } + } + + component ViewDelegate : Item { + id: delegateItem + required property int index + width: (listView.effectiveLayoutDirection == Qt.LeftToRight ? (index == 48 - 1) : (index == 0)) ? 40 : 50 Rectangle { width: 40; height: 40 - color: Qt.rgba(0.8/(parent.value+1),0.8/(parent.value+1),0.8/(parent.value+1),1.0) + color: Qt.rgba(0.5 + (48 - delegateItem.index) * Math.random() / 48, + 0.3 + delegateItem.index * Math.random() / 48, + 0.3 * Math.random(), + 1.0) Text { - text: parent.parent.value+1 + text: delegateItem.index + 1 color: "white" font.pixelSize: 18 anchors.centerIn: parent } } } - Component { - id: viewDelegate - Item { - width: (listView.effectiveLayoutDirection == Qt.LeftToRight ? (index == 48 - 1) : (index == 0)) ? 40 : 50 - Rectangle { - width: 40; height: 40 - color: Qt.rgba(0.5+(48 - index)*Math.random()/48, - 0.3+index*Math.random()/48, - 0.3*Math.random(), - 1.0) - Text { - text: index+1 - color: "white" - font.pixelSize: 18 - anchors.centerIn: parent - } - } - } - } } diff --git a/examples/quick/righttoleft/textalignment/textalignment.qml b/examples/quick/righttoleft/textalignment/textalignment.qml index c5790027f2..698917a3c0 100644 --- a/examples/quick/righttoleft/textalignment/textalignment.qml +++ b/examples/quick/righttoleft/textalignment/textalignment.qml @@ -93,18 +93,23 @@ Rectangle { width: 320 height: 320 id: editorTypeRow - model: editorType.length + model: root.editorType.length orientation: ListView.Horizontal cacheBuffer: 1000//Load the really expensive ones async if possible delegate: Item { + id: delegate + width: editorColumn.width height: editorColumn.height + + required property int index + Column { id: editorColumn spacing: 5 width: textColumn.width+10 Text { - text: root.editorType[index] + text: root.editorType[delegate.index] font.pixelSize: 16 anchors.horizontalCenter: parent.horizontalCenter } @@ -113,8 +118,8 @@ Rectangle { spacing: 5 anchors.horizontalCenter: parent.horizontalCenter Repeater { - model: textComponents.length - delegate: textComponents[index] + model: root.textComponents.length + delegate: root.textComponents[delegate.index] } } } @@ -203,9 +208,11 @@ Rectangle { Component { id: plainTextComponent Text { + required property int index + width: 180 text: root.text[index] - font.pixelSize: pxSz + font.pixelSize: root.pxSz wrapMode: Text.WordWrap horizontalAlignment: root.horizontalAlignment LayoutMirroring.enabled: root.mirror @@ -216,10 +223,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -228,7 +235,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -237,9 +244,11 @@ Rectangle { Component { id: styledTextComponent Text { + required property int index + width: 180 text: root.text[index] - font.pixelSize: pxSz + font.pixelSize: root.pxSz wrapMode: Text.WordWrap horizontalAlignment: root.horizontalAlignment LayoutMirroring.enabled: root.mirror @@ -252,10 +261,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -264,7 +273,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -273,9 +282,11 @@ Rectangle { Component { id: richTextComponent Text { + required property int index + width: 180 text: root.text[index] - font.pixelSize: pxSz + font.pixelSize: root.pxSz wrapMode: Text.WordWrap horizontalAlignment: root.horizontalAlignment LayoutMirroring.enabled: root.mirror @@ -286,10 +297,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -298,7 +309,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -307,9 +318,11 @@ Rectangle { Component { id: italicRichTextComponent Text { + required property int index + width: 180 text: "<i>" + root.text[index] + "</i>" - font.pixelSize: pxSz + font.pixelSize: root.pxSz wrapMode: Text.WordWrap horizontalAlignment: root.horizontalAlignment LayoutMirroring.enabled: root.mirror @@ -321,10 +334,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -333,7 +346,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -342,9 +355,11 @@ Rectangle { Component { id: plainTextEdit TextEdit { + required property int index + width: 180 text: root.text[index] - font.pixelSize: pxSz + font.pixelSize: root.pxSz cursorVisible: true wrapMode: TextEdit.WordWrap horizontalAlignment: root.horizontalAlignment @@ -355,10 +370,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -367,7 +382,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -376,9 +391,11 @@ Rectangle { Component { id: italicTextEdit TextEdit { + required property int index + width: 180 text: "<i>" + root.text[index] + "<i>" - font.pixelSize: pxSz + font.pixelSize: root.pxSz cursorVisible: true wrapMode: TextEdit.WordWrap textFormat: TextEdit.RichText @@ -390,10 +407,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[parent.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -402,7 +419,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } @@ -411,13 +428,15 @@ Rectangle { Component { id: textInput Item { + id: textDelegate + required property int index width: 180 height: textInput.text.length > 20 ? 3*textInput.height : textInput.height TextInput { id: textInput width: 180 - text: root.text[index] - font.pixelSize: pxSz + text: root.text[textDelegate.index] + font.pixelSize: root.pxSz cursorVisible: true horizontalAlignment: root.horizontalAlignment LayoutMirroring.enabled: root.mirror @@ -427,10 +446,10 @@ Rectangle { anchors.fill: parent } Text { - text: root.description[index] + text: root.description[textDelegate.index] color: Qt.rgba(1,1,1,1.0) anchors.centerIn: parent - font.pixelSize: pxSz - 2 + font.pixelSize: root.pxSz - 2 Rectangle { z: -1 color: Qt.rgba(0.3, 0, 0, 0.3) @@ -439,7 +458,7 @@ Rectangle { } Text { color: "white" - text: shortText(parent.horizontalAlignment) + text: root.shortText(parent.horizontalAlignment) anchors { top: parent.top; right: parent.right; margins: 2 } } } diff --git a/examples/quick/scenegraph/rendernode/main.qml b/examples/quick/scenegraph/rendernode/main.qml index 153a71e097..5631df317c 100644 --- a/examples/quick/scenegraph/rendernode/main.qml +++ b/examples/quick/scenegraph/rendernode/main.qml @@ -66,7 +66,7 @@ Item { MouseArea { anchors.fill: parent acceptedButtons: Qt.LeftButton | Qt.RightButton - onClicked: { + onClicked: (mouse) => { if (mouse.button === Qt.LeftButton) { clipper.clip = !clipper.clip } else if (mouse.button === Qt.RightButton) { diff --git a/examples/quick/shared/FlickrRssModel.qml b/examples/quick/shared/FlickrRssModel.qml index 5f88fabcae..2fb4412ba1 100644 --- a/examples/quick/shared/FlickrRssModel.qml +++ b/examples/quick/shared/FlickrRssModel.qml @@ -72,7 +72,7 @@ ListModel { var jsonText = xhr.responseText; var objArray = JSON.parse(jsonText.replace(/\'/g,"'")) if (objArray.errors !== undefined) - console.log(lCategory, "Error fetching tweets: " + imageItems.errors[0].message) + console.log("Error fetching tweets: " + objArray.errors[0].message) else { for (var key in objArray.items) { var rssItem = objArray.items[key]; diff --git a/examples/quick/shared/LauncherList.qml b/examples/quick/shared/LauncherList.qml index 9859b5b635..cb13ec4372 100644 --- a/examples/quick/shared/LauncherList.qml +++ b/examples/quick/shared/LauncherList.qml @@ -48,6 +48,9 @@ ** $QT_END_LICENSE$ ** ****************************************************************************/ + +import QtQml 2.12 +import QtQml.Models 2.12 import QtQuick 2.12 Rectangle { @@ -75,6 +78,7 @@ Rectangle { id: launcherList clip: true delegate: SimpleLauncherDelegate{ + required property url url onClicked: root.showExample(url) } model: ListModel {id:myModel} diff --git a/examples/quick/shared/SimpleLauncherDelegate.qml b/examples/quick/shared/SimpleLauncherDelegate.qml index 7f07dea52a..dd29b8b821 100644 --- a/examples/quick/shared/SimpleLauncherDelegate.qml +++ b/examples/quick/shared/SimpleLauncherDelegate.qml @@ -55,6 +55,9 @@ Rectangle { width: ListView.view.width height: button.implicitHeight + 22 + required property string name + required property string description + signal clicked() gradient: Gradient { @@ -110,7 +113,7 @@ Rectangle { anchors.leftMargin: 10 anchors.right: parent.right anchors.rightMargin: 10 - text: name + text: container.name color: "black" font.pixelSize: 22 wrapMode: Text.WrapAtWordBoundaryOrAnywhere @@ -122,7 +125,7 @@ Rectangle { id: buttonLabel2 anchors.left: parent.left anchors.leftMargin: 10 - text: description + text: container.description wrapMode: Text.WrapAtWordBoundaryOrAnywhere color: "#666" font.pixelSize: 12 diff --git a/examples/quick/shared/TabSet.qml b/examples/quick/shared/TabSet.qml index 9e2759c3ec..ab8476ad44 100644 --- a/examples/quick/shared/TabSet.qml +++ b/examples/quick/shared/TabSet.qml @@ -78,6 +78,7 @@ Item { Repeater { model: stack.children.length delegate: Rectangle { + required property int index width: tabWidget.width / stack.children.length height: Math.max(Screen.pixelDensity * 7, label.implicitHeight * 1.2) @@ -90,18 +91,18 @@ Item { anchors { fill: parent; leftMargin: 2; topMargin: 5; rightMargin: 1 } border { left: 7; right: 7 } source: "images/tab.png" - visible: tabWidget.current == index + visible: tabWidget.current == parent.index } Text { id: label horizontalAlignment: Qt.AlignHCenter; verticalAlignment: Qt.AlignVCenter anchors.fill: parent - text: stack.children[index].title + text: stack.children[parent.index].title elide: Text.ElideRight - font.bold: tabWidget.current == index + font.bold: tabWidget.current == parent.index } TapHandler { - onTapped: tabWidget.current = index + onTapped: tabWidget.current = parent.index } } } diff --git a/examples/quick/tableview/gameoflife/main.qml b/examples/quick/tableview/gameoflife/main.qml index 90be69b9c0..fb3195892f 100644 --- a/examples/quick/tableview/gameoflife/main.qml +++ b/examples/quick/tableview/gameoflife/main.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.12 import QtQuick 2.12 import QtQuick.Window 2.3 import QtQuick.Controls 2.2 @@ -81,11 +82,14 @@ ApplicationWindow { implicitWidth: 15 implicitHeight: 15 - color: model.value ? "#f3f3f4" : "#b5b7bf" + required property var model + required property bool value + + color: value ? "#f3f3f4" : "#b5b7bf" MouseArea { anchors.fill: parent - onClicked: model.value = !model.value + onClicked: parent.model.value = !parent.value } } //! [tableview] diff --git a/examples/quick/tableview/pixelator/main.qml b/examples/quick/tableview/pixelator/main.qml index 38a25f439f..a5edefae90 100644 --- a/examples/quick/tableview/pixelator/main.qml +++ b/examples/quick/tableview/pixelator/main.qml @@ -65,7 +65,9 @@ Window { id: pixelDelegate Item { - readonly property real gray: model.display / 255.0 + required property real display + + readonly property real gray: display / 255.0 readonly property real size: 16 implicitWidth: size @@ -77,7 +79,7 @@ Window { id: rect anchors.centerIn: parent color: "#09102b" - radius: size - gray * size + radius: parent.size - parent.gray * parent.size implicitWidth: radius implicitHeight: radius //! [rectshape] diff --git a/examples/quick/text/fonts/availableFonts.qml b/examples/quick/text/fonts/availableFonts.qml index ea3bff22b8..41dbae0021 100644 --- a/examples/quick/text/fonts/availableFonts.qml +++ b/examples/quick/text/fonts/availableFonts.qml @@ -61,11 +61,12 @@ Rectangle { delegate: Item { height: 40; width: ListView.view.width + required property string modelData Text { anchors.centerIn: parent - text: modelData + text: parent.modelData //! [delegate] - font.family: modelData + font.family: parent.modelData //! [delegate] font.pixelSize: 20 color: "white" diff --git a/examples/quick/text/fonts/fonts.qml b/examples/quick/text/fonts/fonts.qml index d356e00417..4478db0135 100644 --- a/examples/quick/text/fonts/fonts.qml +++ b/examples/quick/text/fonts/fonts.qml @@ -51,6 +51,7 @@ import QtQuick 2.0 Rectangle { + id: root property string myText: "The quick brown fox jumps over the lazy dog." width: 320; height: 480 @@ -71,7 +72,7 @@ Rectangle { spacing: 15 Text { - text: myText + text: root.myText color: "lightsteelblue" width: parent.width wrapMode: Text.WordWrap @@ -81,7 +82,7 @@ Rectangle { font.pixelSize: 20 } Text { - text: myText + text: root.myText color: "lightsteelblue" width: parent.width wrapMode: Text.WordWrap @@ -89,7 +90,7 @@ Rectangle { font { family: "Times"; pixelSize: 20; capitalization: Font.AllUppercase } } Text { - text: myText + text: root.myText color: "lightsteelblue" width: parent.width horizontalAlignment: Text.AlignRight @@ -97,14 +98,14 @@ Rectangle { font { family: fixedFont.name; pixelSize: 20; weight: Font.Bold; capitalization: Font.AllLowercase } } Text { - text: myText + text: root.myText color: "lightsteelblue" width: parent.width wrapMode: Text.WordWrap font { family: fixedFont.name; pixelSize: 20; italic: true; capitalization: Font.SmallCaps } } Text { - text: myText + text: root.myText color: "lightsteelblue" width: parent.width wrapMode: Text.WordWrap @@ -112,7 +113,7 @@ Rectangle { } Text { text: { - if (webFont.status == FontLoader.Ready) myText + if (webFont.status == FontLoader.Ready) root.myText else if (webFont.status == FontLoader.Loading) "Loading..." else if (webFont.status == FontLoader.Error) "Error loading font" } diff --git a/examples/quick/text/imgtag/TextWithImage.qml b/examples/quick/text/imgtag/TextWithImage.qml index 1cb65e739d..d22e93146d 100644 --- a/examples/quick/text/imgtag/TextWithImage.qml +++ b/examples/quick/text/imgtag/TextWithImage.qml @@ -55,5 +55,5 @@ Text { font.pointSize: 14 wrapMode: Text.WordWrap textFormat: Text.StyledText - horizontalAlignment: main.hAlign + horizontalAlignment: parent.hAlign } diff --git a/examples/quick/text/imgtag/imgtag.qml b/examples/quick/text/imgtag/imgtag.qml index 1790853de2..177008940a 100644 --- a/examples/quick/text/imgtag/imgtag.qml +++ b/examples/quick/text/imgtag/imgtag.qml @@ -56,7 +56,7 @@ Rectangle { focus: true color: "#dedede" - property var hAlign: Text.AlignLeft + property int hAlign: Text.AlignLeft Flickable { anchors.fill: parent @@ -68,6 +68,7 @@ Rectangle { x: 10; y: 10 spacing: 20 width: parent.width - 20 + property int hAlign: main.hAlign TextWithImage { text: "This is a <b>happy</b> face<img src=\"images/face-smile.png\">" diff --git a/examples/quick/text/styledtext-layout.qml b/examples/quick/text/styledtext-layout.qml index 631a37b493..b399b638dc 100644 --- a/examples/quick/text/styledtext-layout.qml +++ b/examples/quick/text/styledtext-layout.qml @@ -71,12 +71,12 @@ Rectangle { text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer at ante dui <a href=\"http://www.digia.com\">www.digia.com</a>.<br/>Curabitur ante est, pulvinar quis adipiscing a, iaculis id ipsum. Nunc blandit condimentum odio vel egestas.<br><ul type=\"bullet\"><li>Coffee<ol type=\"a\"><li>Espresso<li>Cappuccino<li>Latte</ol><li>Juice<ol type=\"1\"><li>Orange</li><li>Apple</li><li>Pineapple</li><li>Tomato</li></ol></li></ul><p><font color=\"#434343\"><i>Proin consectetur <b>sapien</b> in ipsum lacinia sit amet mattis orci interdum. Quisque vitae accumsan lectus. Ut nisi turpis, sollicitudin ut dignissim id, fermentum ac est. Maecenas nec libero leo. Sed ac leo eget ipsum ultricies viverra sit amet eu orci. Praesent et tortor risus, viverra accumsan sapien. Sed faucibus eleifend lectus, sed euismod urna porta eu. Quisque vitae accumsan lectus. Ut nisi turpis, sollicitudin ut dignissim id, fermentum ac est. Maecenas nec libero leo. Sed ac leo eget ipsum ultricies viverra sit amet eu orci." //! [layout] - onLineLaidOut: { - line.width = width / 2 - (margin) + onLineLaidOut: (line) => { + line.width = width / 2 - main.margin if (line.y + line.height >= height) { - line.y -= height - margin - line.x = width / 2 + margin + line.y -= height - main.margin + line.x = width / 2 + main.activeFocusmargin } if (line.isLast) { diff --git a/examples/quick/threading/threadedlistmodel/timedisplay.qml b/examples/quick/threading/threadedlistmodel/timedisplay.qml index 5ad901c676..c4e6e7b249 100644 --- a/examples/quick/threading/threadedlistmodel/timedisplay.qml +++ b/examples/quick/threading/threadedlistmodel/timedisplay.qml @@ -59,7 +59,10 @@ Rectangle { anchors.fill: parent model: listModel delegate: Component { - Text { text: time } + Text { + required property string time + text: time + } } ListModel { id: listModel } diff --git a/examples/quick/threading/workerscript/Spinner.qml b/examples/quick/threading/workerscript/Spinner.qml index 9c70090dba..a2257f8639 100644 --- a/examples/quick/threading/workerscript/Spinner.qml +++ b/examples/quick/threading/workerscript/Spinner.qml @@ -78,6 +78,7 @@ Rectangle { clip: true model: 64 delegate: Text { + required property int index font.pixelSize: 18; color: "white"; text: index; diff --git a/examples/quick/threading/workerscript/workerscript.qml b/examples/quick/threading/workerscript/workerscript.qml index 735cc8d1f1..eb8ad43d01 100644 --- a/examples/quick/threading/workerscript/workerscript.qml +++ b/examples/quick/threading/workerscript/workerscript.qml @@ -58,7 +58,7 @@ Rectangle { id: myWorker source: "workerscript.mjs" - onMessage: { + onMessage: (messageObject) => { if (messageObject.row == rowSpinner.value && messageObject.column == columnSpinner.value){ //Not an old result if (messageObject.result == -1) resultText.text = "Column must be <= Row"; diff --git a/examples/quick/touchinteraction/flickable/content/Panel.qml b/examples/quick/touchinteraction/flickable/content/Panel.qml index 21f8fc8afd..0aae0635b2 100644 --- a/examples/quick/touchinteraction/flickable/content/Panel.qml +++ b/examples/quick/touchinteraction/flickable/content/Panel.qml @@ -50,112 +50,106 @@ import QtQuick 2.0 -Component { - Item { - property variant stickies +Item { + required property string name + required property var notes - id: page - width: ListView.view.width+40; height: ListView.view.height + property real horizontalVelocity: 0 + id: page + width: ListView.view.width+40; height: ListView.view.height - Image { - source: "cork.jpg" - width: page.ListView.view.width - height: page.ListView.view.height - fillMode: Image.PreserveAspectCrop - clip: true - } - - MouseArea { - anchors.fill: parent - onClicked: page.focus = false; - } - Text { - text: name; x: 15; y: 8; height: 40; width: 370 - font.pixelSize: 18; font.bold: true; color: "white" - style: Text.Outline; styleColor: "black" - } + Image { + source: "cork.jpg" + width: page.ListView.view.width + height: page.ListView.view.height + fillMode: Image.PreserveAspectCrop + clip: true + } - Repeater { - model: notes - Item { - id: stickyPage + MouseArea { + anchors.fill: parent + onClicked: page.focus = false; + } - property int randomX: Math.random() * (page.ListView.view.width-0.5*stickyImage.width) +100 - property int randomY: Math.random() * (page.ListView.view.height-0.5*stickyImage.height) +50 + Text { + text: page.name; x: 15; y: 8; height: 40; width: 370 + font.pixelSize: 18; font.bold: true; color: "white" + style: Text.Outline; styleColor: "black" + } - x: randomX; y: randomY + Repeater { + model: page.notes + Item { + id: stickyPage + required property string noteText - rotation: -flickable.horizontalVelocity / 100; - Behavior on rotation { - SpringAnimation { spring: 2.0; damping: 0.15 } - } + property int randomX: Math.random() * (page.ListView.view.width-0.5*stickyImage.width) +100 + property int randomY: Math.random() * (page.ListView.view.height-0.5*stickyImage.height) +50 - Item { - id: sticky - scale: 0.7 - - Image { - id: stickyImage - x: 8 + -width * 0.6 / 2; y: -20 - source: "note-yellow.png" - scale: 0.6; transformOrigin: Item.TopLeft - } + x: randomX; y: randomY - TextEdit { - id: myText - x: -104; y: 36; width: 215; height: 200 - font.pixelSize: 24 - readOnly: false - rotation: -8 - text: noteText - } + rotation: -page.horizontalVelocity / 100 + Behavior on rotation { + SpringAnimation { spring: 2.0; damping: 0.15 } + } - Item { - x: stickyImage.x; y: -20 - width: stickyImage.width * stickyImage.scale - height: stickyImage.height * stickyImage.scale - - MouseArea { - id: mouse - anchors.fill: parent - drag.target: stickyPage - drag.axis: Drag.XAndYAxis - drag.minimumY: 0 - drag.maximumY: page.height - 80 - drag.minimumX: 100 - drag.maximumX: page.width - 140 - onClicked: myText.forceActiveFocus() - } - } - } + Item { + id: sticky + scale: 0.7 Image { - x: -width / 2; y: -height * 0.5 / 2 - source: "tack.png" - scale: 0.7; transformOrigin: Item.TopLeft + id: stickyImage + x: 8 + -width * 0.6 / 2; y: -20 + source: "note-yellow.png" + scale: 0.6; transformOrigin: Item.TopLeft } - states: State { - name: "pressed" - when: mouse.pressed - PropertyChanges { target: sticky; rotation: 8; scale: 1 } - PropertyChanges { target: page; z: 8 } + TextEdit { + id: myText + x: -104; y: 36; width: 215; height: 200 + font.pixelSize: 24 + readOnly: false + rotation: -8 + text: stickyPage.noteText } - transitions: Transition { - NumberAnimation { properties: "rotation,scale"; duration: 200 } + Item { + x: stickyImage.x; y: -20 + width: stickyImage.width * stickyImage.scale + height: stickyImage.height * stickyImage.scale + + MouseArea { + id: mouse + anchors.fill: parent + drag.target: stickyPage + drag.axis: Drag.XAndYAxis + drag.minimumY: 0 + drag.maximumY: page.height - 80 + drag.minimumX: 100 + drag.maximumX: page.width - 140 + onClicked: myText.forceActiveFocus() + } } } - } - } -} - - - - - + Image { + x: -width / 2; y: -height * 0.5 / 2 + source: "tack.png" + scale: 0.7; transformOrigin: Item.TopLeft + } + states: State { + name: "pressed" + when: mouse.pressed + PropertyChanges { target: sticky; rotation: 8; scale: 1 } + PropertyChanges { target: page; z: 8 } + } + transitions: Transition { + NumberAnimation { properties: "rotation,scale"; duration: 200 } + } + } + } +} diff --git a/examples/quick/touchinteraction/flickable/corkboards.qml b/examples/quick/touchinteraction/flickable/corkboards.qml index afb5dd309c..4825053f3f 100644 --- a/examples/quick/touchinteraction/flickable/corkboards.qml +++ b/examples/quick/touchinteraction/flickable/corkboards.qml @@ -92,6 +92,8 @@ Rectangle { orientation: ListView.Horizontal snapMode: ListView.SnapOneItem model: list - delegate: Panel { } + delegate: Panel { + horizontalVelocity: flickable.horizontalVelocity + } } } diff --git a/examples/quick/touchinteraction/multipointtouch/content/AugmentedTouchPoint.qml b/examples/quick/touchinteraction/multipointtouch/content/AugmentedTouchPoint.qml index 5750ffcad1..56f287666f 100644 --- a/examples/quick/touchinteraction/multipointtouch/content/AugmentedTouchPoint.qml +++ b/examples/quick/touchinteraction/multipointtouch/content/AugmentedTouchPoint.qml @@ -66,7 +66,7 @@ TouchPoint { interval: 100 running: false repeat: false - onTriggered: child.enabled = false + onTriggered: container.child.enabled = false } property Item child: SpriteGoal { enabled: false diff --git a/examples/quick/views/delegatemodel/dragselection.qml b/examples/quick/views/delegatemodel/dragselection.qml index 15fd2654c2..f9a0d37311 100644 --- a/examples/quick/views/delegatemodel/dragselection.qml +++ b/examples/quick/views/delegatemodel/dragselection.qml @@ -48,6 +48,7 @@ ** ****************************************************************************/ +import QtQml 2.0 import QtQuick 2.0 import QtQml.Models 2.1 @@ -64,6 +65,8 @@ Item { Package { id: packageRoot + required property var modelData + MouseArea { id: visibleContainer Package.name: "visible" @@ -130,7 +133,7 @@ Item { horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter color: "white" - text: modelData + text: packageRoot.modelData font.pixelSize: 18 } diff --git a/examples/quick/views/delegatemodel/slideshow.qml b/examples/quick/views/delegatemodel/slideshow.qml index b252519bbf..638c8bf10f 100644 --- a/examples/quick/views/delegatemodel/slideshow.qml +++ b/examples/quick/views/delegatemodel/slideshow.qml @@ -74,6 +74,8 @@ Rectangle { width: 76; height: 76 + required property string thumbnail + Rectangle { id: image x: 0; y: 0; width: 76; height: 76 @@ -86,7 +88,7 @@ Rectangle { anchors.leftMargin: 1 anchors.topMargin: 1 - source: thumbnail + source: delegateItem.thumbnail fillMode: Image.PreserveAspectFit } diff --git a/examples/quick/views/gridview/gridview-example.qml b/examples/quick/views/gridview/gridview-example.qml index 76a1d8dd37..4cc30d3736 100644 --- a/examples/quick/views/gridview/gridview-example.qml +++ b/examples/quick/views/gridview/gridview-example.qml @@ -74,20 +74,24 @@ Rectangle { highlight: Rectangle { width: 80; height: 80; color: "lightsteelblue" } delegate: Item { + required property string icon + required property string name + required property int index + width: 100; height: 100 Image { id: myIcon y: 20; anchors.horizontalCenter: parent.horizontalCenter - source: icon + source: parent.icon } Text { anchors { top: myIcon.bottom; horizontalCenter: parent.horizontalCenter } - text: name + text: parent.name } MouseArea { anchors.fill: parent - onClicked: parent.GridView.view.currentIndex = index + onClicked: parent.GridView.view.currentIndex = parent.index } } } diff --git a/examples/quick/views/listview/content/PressAndHoldButton.qml b/examples/quick/views/listview/content/PressAndHoldButton.qml index 527394eb4d..6d633c0264 100644 --- a/examples/quick/views/listview/content/PressAndHoldButton.qml +++ b/examples/quick/views/listview/content/PressAndHoldButton.qml @@ -72,12 +72,12 @@ Image { PropertyAction { target: container; property: "pressed"; value: true } ScriptAction { script: container.clicked() } - PauseAnimation { duration: repeatDelay } + PauseAnimation { duration: container.repeatDelay } SequentialAnimation { loops: Animation.Infinite ScriptAction { script: container.clicked() } - PauseAnimation { duration: repeatDuration } + PauseAnimation { duration: container.repeatDuration } } } diff --git a/examples/quick/views/listview/content/ToggleButton.qml b/examples/quick/views/listview/content/ToggleButton.qml index 0a2747a683..890a94570b 100644 --- a/examples/quick/views/listview/content/ToggleButton.qml +++ b/examples/quick/views/listview/content/ToggleButton.qml @@ -63,6 +63,6 @@ Rectangle { Text { id: text; anchors.centerIn: parent; font.pixelSize: 14 } MouseArea { anchors.fill: parent - onClicked: { active = !active; root.toggled() } + onClicked: { root.active = !root.active; root.toggled() } } } diff --git a/examples/quick/views/listview/displaymargin.qml b/examples/quick/views/listview/displaymargin.qml index e0024e72a9..19261caaa6 100644 --- a/examples/quick/views/listview/displaymargin.qml +++ b/examples/quick/views/listview/displaymargin.qml @@ -68,10 +68,13 @@ Item { width: parent.width height: 25 color: index % 2 ? "steelblue" : "lightsteelblue" + + required property int index + Text { anchors.centerIn: parent color: "white" - text: "Item " + (index + 1) + text: "Item " + (parent.index + 1) } } } diff --git a/examples/quick/views/listview/dynamiclist.qml b/examples/quick/views/listview/dynamiclist.qml index bfc697d094..f37aab98e2 100644 --- a/examples/quick/views/listview/dynamiclist.qml +++ b/examples/quick/views/listview/dynamiclist.qml @@ -101,6 +101,11 @@ Rectangle { width: listView.width; height: 80 clip: true + required property int index + required property string name + required property real cost + required property var attributes + Column { id: arrows anchors { @@ -109,10 +114,16 @@ Rectangle { } Image { source: "content/pics/arrow-up.png" - MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index-1, 1) } + MouseArea { + anchors.fill: parent + onClicked: fruitModel.move(delegateItem.index, delegateItem.index - 1, 1) + } } Image { source: "content/pics/arrow-down.png" - MouseArea { anchors.fill: parent; onClicked: fruitModel.move(index, index+1, 1) } + MouseArea { + anchors.fill: parent + onClicked: fruitModel.move(delegateItem.index, delegateItem.index + 1, 1) + } } } @@ -125,7 +136,7 @@ Rectangle { Text { anchors.horizontalCenter: parent.horizontalCenter - text: name + text: delegateItem.name font.pixelSize: 15 color: "white" } @@ -133,8 +144,12 @@ Rectangle { anchors.horizontalCenter: parent.horizontalCenter spacing: 5 Repeater { - model: attributes - Text { text: description; color: "White" } + model: delegateItem.attributes + Text { + required property string description + text: description + color: "White" + } } } } @@ -154,13 +169,13 @@ Rectangle { PressAndHoldButton { anchors.verticalCenter: parent.verticalCenter source: "content/pics/plus-sign.png" - onClicked: fruitModel.setProperty(index, "cost", cost + 0.25) + onClicked: fruitModel.setProperty(delegateItem.index, "cost", delegateItem.cost + 0.25) } Text { id: costText anchors.verticalCenter: parent.verticalCenter - text: '$' + Number(cost).toFixed(2) + text: '$' + Number(delegateItem.cost).toFixed(2) font.pixelSize: 15 color: "white" font.bold: true @@ -169,12 +184,16 @@ Rectangle { PressAndHoldButton { anchors.verticalCenter: parent.verticalCenter source: "content/pics/minus-sign.png" - onClicked: fruitModel.setProperty(index, "cost", Math.max(0,cost-0.25)) + onClicked: fruitModel.setProperty(delegateItem.index, "cost", + Math.max(0, delegateItem.cost - 0.25)) } Image { source: "content/pics/list-delete.png" - MouseArea { anchors.fill:parent; onClicked: fruitModel.remove(index) } + MouseArea { + anchors.fill: parent + onClicked: fruitModel.remove(delegateItem.index) + } } } } diff --git a/examples/quick/views/listview/expandingdelegates.qml b/examples/quick/views/listview/expandingdelegates.qml index 1308e8441d..6ed1d8c341 100644 --- a/examples/quick/views/listview/expandingdelegates.qml +++ b/examples/quick/views/listview/expandingdelegates.qml @@ -67,6 +67,11 @@ Rectangle { Item { id: recipe + required property string title + required property string picture + required property string ingredients + required property string method + // Create a property to contain the visibility of the details. // We can bind multiple element's opacity to this one property, // rather than having a "PropertyChanges" line for each element we @@ -106,7 +111,7 @@ Rectangle { Image { id: recipeImage width: 50; height: 50 - source: picture + source: recipe.picture } //! [1] Column { @@ -114,7 +119,7 @@ Rectangle { spacing: 5 Text { - text: title + text: recipe.title font.bold: true; font.pointSize: 16 } @@ -125,7 +130,7 @@ Rectangle { } SmallText { - text: ingredients + text: recipe.ingredients wrapMode: Text.WordWrap width: parent.width opacity: recipe.detailsOpacity @@ -155,7 +160,12 @@ Rectangle { contentHeight: methodText.height clip: true - Text { id: methodText; text: method; wrapMode: Text.WordWrap; width: details.width } + Text { + id: methodText + text: recipe.method + wrapMode: Text.WordWrap + width: details.width + } } Image { diff --git a/examples/quick/views/listview/highlight.qml b/examples/quick/views/listview/highlight.qml index 5b03d30f25..092b4d59bd 100644 --- a/examples/quick/views/listview/highlight.qml +++ b/examples/quick/views/listview/highlight.qml @@ -58,44 +58,44 @@ import "content" Rectangle { width: 200; height: 300 - // Define a delegate component. A component will be + // Define a delegate component. The component will be // instantiated for each visible item in the list. - Component { - id: petDelegate - Item { - id: wrapper - width: 200; height: 55 - Column { - SmallText { text: 'Name: ' + name } - SmallText { text: 'Type: ' + type } - SmallText { text: 'Age: ' + age } - } - // indent the item if it is the current item - states: State { - name: "Current" - when: wrapper.ListView.isCurrentItem - PropertyChanges { target: wrapper; x: 20 } - } - transitions: Transition { - NumberAnimation { properties: "x"; duration: 200 } - } - MouseArea { - anchors.fill: parent - onClicked: wrapper.ListView.view.currentIndex = index - } + component PetDelegate: Item { + id: pet + width: 200; height: 55 + + required property int index + required property string name + required property string type + required property int age + + Column { + SmallText { text: 'Name: ' + pet.name } + SmallText { text: 'Type: ' + pet.type } + SmallText { text: 'Age: ' + pet.age } + } + // indent the item if it is the current item + states: State { + name: "Current" + when: pet.ListView.isCurrentItem + PropertyChanges { target: pet; x: 20 } + } + transitions: Transition { + NumberAnimation { properties: "x"; duration: 200 } + } + MouseArea { + anchors.fill: parent + onClicked: pet.ListView.view.currentIndex = pet.index } } //! [0] // Define a highlight with customized movement between items. - Component { - id: highlightBar - Rectangle { - width: 200; height: 50 - color: "#FFFF88" - y: listView.currentItem.y; - Behavior on y { SpringAnimation { spring: 2; damping: 0.1 } } - } + component HighlightBar : Rectangle { + width: 200; height: 50 + color: "#FFFF88" + y: listView.currentItem.y + Behavior on y { SpringAnimation { spring: 2; damping: 0.1 } } } ListView { @@ -104,12 +104,12 @@ Rectangle { x: 30 model: PetsModel {} - delegate: petDelegate + delegate: PetDelegate {} focus: true // Set the highlight delegate. Note we must also set highlightFollowsCurrentItem // to false so the highlight delegate can control how the highlight is moved. - highlight: highlightBar + highlight: HighlightBar {} highlightFollowsCurrentItem: false } //! [0] diff --git a/examples/quick/views/listview/highlightranges.qml b/examples/quick/views/listview/highlightranges.qml index 7bc9ab7fe1..dafd064332 100644 --- a/examples/quick/views/listview/highlightranges.qml +++ b/examples/quick/views/listview/highlightranges.qml @@ -62,17 +62,17 @@ Rectangle { loops: -1 running: true ScriptAction { - script: if (increasing) { - current++; - if (current >= aModel.count -1) { - current = aModel.count - 1; - increasing = !increasing; + script: if (root.increasing) { + root.current++; + if (root.current >= aModel.count -1) { + root.current = aModel.count - 1; + root.increasing = !root.increasing; } } else { - current--; - if (current <= 0) { - current = 0; - increasing = !increasing; + root.current--; + if (root.current <= 0) { + root.current = 0; + root.increasing = !root.increasing; } } } @@ -161,16 +161,22 @@ Rectangle { Item { width: 160 height: column.height + + required property int index + required property string name + required property string type + required property int age + Column { id: column - Text { text: 'Name: ' + name } - Text { text: 'Type: ' + type } - Text { text: 'Age: ' + age } + Text { text: 'Name: ' + parent.name } + Text { text: 'Type: ' + parent.type } + Text { text: 'Age: ' + parent.age } } MouseArea { anchors.fill: parent - onClicked: root.current = index + onClicked: root.current = parent.index } } } diff --git a/examples/quick/views/listview/sections.qml b/examples/quick/views/listview/sections.qml index 75b0f5c6d9..d51ed89789 100644 --- a/examples/quick/views/listview/sections.qml +++ b/examples/quick/views/listview/sections.qml @@ -87,8 +87,10 @@ Rectangle { height: childrenRect.height color: "lightsteelblue" + required property string section + Text { - text: section + text: parent.section font.bold: true font.pixelSize: 20 } @@ -101,7 +103,11 @@ Rectangle { anchors.bottom: buttonBar.top width: parent.width model: animalsModel - delegate: Text { text: name; font.pixelSize: 18 } + delegate: Text { + required property string name + text: name + font.pixelSize: 18 + } section.property: "size" section.criteria: ViewSection.FullString diff --git a/examples/quick/views/objectmodel/objectmodel.qml b/examples/quick/views/objectmodel/objectmodel.qml index 8fc2f7c386..c9e4b8a5cd 100644 --- a/examples/quick/views/objectmodel/objectmodel.qml +++ b/examples/quick/views/objectmodel/objectmodel.qml @@ -70,21 +70,21 @@ Rectangle { color: "#FFFEF0" Text { text: "Page 1"; font.bold: true; anchors.centerIn: parent } - Component.onDestruction: if (printDestruction) print("destroyed 1") + Component.onDestruction: if (root.printDestruction) print("destroyed 1") } Rectangle { width: view.width; height: view.height color: "#F0FFF7" Text { text: "Page 2"; font.bold: true; anchors.centerIn: parent } - Component.onDestruction: if (printDestruction) print("destroyed 2") + Component.onDestruction: if (root.printDestruction) print("destroyed 2") } Rectangle { width: view.width; height: view.height color: "#F4F0FF" Text { text: "Page 3"; font.bold: true; anchors.centerIn: parent } - Component.onDestruction: if (printDestruction) print("destroyed 3") + Component.onDestruction: if (root.activeFocusprintDestruction) print("destroyed 3") } } @@ -112,6 +112,8 @@ Rectangle { model: itemModel.count Rectangle { + required property int index + width: 5; height: 5 radius: 3 color: view.currentIndex == index ? "blue" : "white" @@ -119,7 +121,7 @@ Rectangle { MouseArea { width: 20; height: 20 anchors.centerIn: parent - onClicked: view.currentIndex = index + onClicked: view.currentIndex = parent.index } } } diff --git a/examples/quick/views/package/Delegate.qml b/examples/quick/views/package/Delegate.qml index 7c73f35c3d..9f4f1946d8 100644 --- a/examples/quick/views/package/Delegate.qml +++ b/examples/quick/views/package/Delegate.qml @@ -52,6 +52,12 @@ import QtQuick 2.0 //! [0] Package { + id: delegate + + required property int upTo + required property int index + required property string display + Text { id: listDelegate; width: parent.width; height: 25; text: 'Empty'; Package.name: 'list' } Text { id: gridDelegate; width: parent.width / 2; height: 50; text: 'Empty'; Package.name: 'grid' } @@ -60,8 +66,8 @@ Package { width: parent.width; height: 25 color: 'lightsteelblue' - Text { text: display; anchors.centerIn: parent } - state: root.upTo > index ? 'inGrid' : 'inList' + Text { text: delegate.display; anchors.centerIn: parent } + state: delegate.upTo > delegate.index ? 'inGrid' : 'inList' states: [ State { name: 'inList' diff --git a/examples/quick/views/package/view.qml b/examples/quick/views/package/view.qml index 311cc3be8e..632d27c724 100644 --- a/examples/quick/views/package/view.qml +++ b/examples/quick/views/package/view.qml @@ -77,7 +77,9 @@ Rectangle { //![0] DelegateModel { id: visualModel - delegate: Delegate {} + delegate: Delegate { + upTo: root.upTo + } model: myModel } diff --git a/examples/quick/window/AllScreens.qml b/examples/quick/window/AllScreens.qml index a5da380025..ac0e1cb821 100644 --- a/examples/quick/window/AllScreens.qml +++ b/examples/quick/window/AllScreens.qml @@ -69,8 +69,14 @@ Column { id: screenInfo model: Qt.application.screens Shared.Label { + required property string name + required property int virtualX + required property int virtualY + required property int width + required property int height + lineHeight: 1.5 - text: name + "\n" + virtualX + ", " + virtualY + " " + modelData.width + "x" + modelData.height + text: name + "\n" + virtualX + ", " + virtualY + " " + width + "x" + height } } } diff --git a/examples/quick/window/CurrentScreen.qml b/examples/quick/window/CurrentScreen.qml index 2703582399..563cca32a5 100644 --- a/examples/quick/window/CurrentScreen.qml +++ b/examples/quick/window/CurrentScreen.qml @@ -115,10 +115,10 @@ Item { Shared.Label { text: Screen.virtualX + ", " + Screen.virtualY } Shared.Label { text: "orientation" } - Shared.Label { text: orientationToString(Screen.orientation) + " (" + Screen.orientation + ")" } + Shared.Label { text: root.orientationToString(Screen.orientation) + " (" + Screen.orientation + ")" } Shared.Label { text: "primary orientation" } - Shared.Label { text: orientationToString(Screen.primaryOrientation) + " (" + Screen.primaryOrientation + ")" } + Shared.Label { text: root.orientationToString(Screen.primaryOrientation) + " (" + Screen.primaryOrientation + ")" } //! [screen] Shared.Label { text: "10mm rectangle" } diff --git a/examples/quick/window/Splash.qml b/examples/quick/window/Splash.qml index c3e36d9b3b..b33ad6c168 100644 --- a/examples/quick/window/Splash.qml +++ b/examples/quick/window/Splash.qml @@ -78,9 +78,9 @@ Window { } //! [timer] Timer { - interval: timeoutInterval; running: true; repeat: false + interval: splash.timeoutInterval; running: true; repeat: false onTriggered: { - visible = false + splash.visible = false splash.timeout() } } diff --git a/examples/quick/window/window.qml b/examples/quick/window/window.qml index 2ee7fb6e09..4280b6a4c0 100644 --- a/examples/quick/window/window.qml +++ b/examples/quick/window/window.qml @@ -53,65 +53,66 @@ import QtQuick.Window 2.3 import "../shared" as Shared QtObject { + id: root property real defaultSpacing: 10 property SystemPalette palette: SystemPalette { } property var controlWindow: Window { - width: col.implicitWidth + defaultSpacing * 2 - height: col.implicitHeight + defaultSpacing * 2 - color: palette.window + width: col.implicitWidth + root.defaultSpacing * 2 + height: col.implicitHeight + root.defaultSpacing * 2 + color: root.palette.window title: "Control Window" Column { id: col anchors.fill: parent - anchors.margins: defaultSpacing - spacing: defaultSpacing + anchors.margins: root.defaultSpacing + spacing: root.defaultSpacing property real cellWidth: col.width / 3 - spacing Shared.Label { text: "Control the second window:" } Grid { id: grid columns: 3 - spacing: defaultSpacing + spacing: root.defaultSpacing width: parent.width Shared.Button { id: showButton width: col.cellWidth - text: testWindow.visible ? "Hide" : "Show" - onClicked: testWindow.visible = !testWindow.visible + text: root.testWindow.visible ? "Hide" : "Show" + onClicked: root.testWindow.visible = !root.testWindow.visible } //! [windowedCheckbox] Shared.CheckBox { text: "Windowed" height: showButton.height width: col.cellWidth - Binding on checked { value: testWindow.visibility === Window.Windowed } - onClicked: testWindow.visibility = Window.Windowed + Binding on checked { value: root.testWindow.visibility === Window.Windowed } + onClicked: root.testWindow.visibility = Window.Windowed } //! [windowedCheckbox] Shared.CheckBox { height: showButton.height width: col.cellWidth text: "Full Screen" - Binding on checked { value: testWindow.visibility === Window.FullScreen } - onClicked: testWindow.visibility = Window.FullScreen + Binding on checked { value: root.testWindow.visibility === Window.FullScreen } + onClicked: root.testWindow.visibility = Window.FullScreen } Shared.Button { id: autoButton width: col.cellWidth text: "Automatic" - onClicked: testWindow.visibility = Window.AutomaticVisibility + onClicked: root.testWindow.visibility = Window.AutomaticVisibility } Shared.CheckBox { height: autoButton.height text: "Minimized" - Binding on checked { value: testWindow.visibility === Window.Minimized } - onClicked: testWindow.visibility = Window.Minimized + Binding on checked { value: root.testWindow.visibility === Window.Minimized } + onClicked: root.testWindow.visibility = Window.Minimized } Shared.CheckBox { height: autoButton.height text: "Maximized" - Binding on checked { value: testWindow.visibility === Window.Maximized } - onClicked: testWindow.visibility = Window.Maximized + Binding on checked { value: root.testWindow.visibility === Window.Maximized } + onClicked: root.testWindow.visibility = Window.Maximized } } function visibilityToString(v) { @@ -133,17 +134,17 @@ QtObject { } Shared.Label { id: visibilityLabel - text: "second window is " + (testWindow.visible ? "visible" : "invisible") + - " and has visibility " + parent.visibilityToString(testWindow.visibility) + text: "second window is " + (root.testWindow.visible ? "visible" : "invisible") + + " and has visibility " + parent.visibilityToString(root.testWindow.visibility) } Rectangle { - color: palette.text + color: root.palette.text width: parent.width height: 1 } CurrentScreen { } Rectangle { - color: palette.text + color: root.palette.text width: parent.width height: 1 } @@ -159,40 +160,40 @@ QtObject { flags: Qt.Window | Qt.WindowFullscreenButtonHint Rectangle { anchors.fill: parent - anchors.margins: defaultSpacing + anchors.margins: root.defaultSpacing Shared.Label { anchors.centerIn: parent text: "Second Window" } MouseArea { anchors.fill: parent - onClicked: testWindow.color = "#e0c31e" + onClicked: root.testWindow.color = "#e0c31e" } Shared.Button { anchors.right: parent.right anchors.top: parent.top - anchors.margins: defaultSpacing - text: testWindow.visibility === Window.FullScreen ? "exit fullscreen" : "go fullscreen" + anchors.margins: root.defaultSpacing + text: root.testWindow.visibility === Window.FullScreen ? "exit fullscreen" : "go fullscreen" width: 150 onClicked: { - if (testWindow.visibility === Window.FullScreen) - testWindow.visibility = Window.AutomaticVisibility + if (root.testWindow.visibility === Window.FullScreen) + root.testWindow.visibility = Window.AutomaticVisibility else - testWindow.visibility = Window.FullScreen + root.testWindow.visibility = Window.FullScreen } } Shared.Button { anchors.left: parent.left anchors.top: parent.top - anchors.margins: defaultSpacing + anchors.margins: root.defaultSpacing text: "X" width: 30 - onClicked: testWindow.close() + onClicked: root.testWindow.close() } } } property var splashWindow: Splash { - onTimeout: controlWindow.visible = true + onTimeout: root.controlWindow.visible = true } } |