diff options
Diffstat (limited to 'examples/quick/keyinteraction/GridMenu.qml')
-rw-r--r-- | examples/quick/keyinteraction/GridMenu.qml | 52 |
1 files changed, 41 insertions, 11 deletions
diff --git a/examples/quick/keyinteraction/GridMenu.qml b/examples/quick/keyinteraction/GridMenu.qml index d21f846089..b17a72bdc8 100644 --- a/examples/quick/keyinteraction/GridMenu.qml +++ b/examples/quick/keyinteraction/GridMenu.qml @@ -1,10 +1,12 @@ // Copyright (C) 2021 The Qt Company Ltd. // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause +pragma ComponentBehavior: Bound import QtQuick FocusScope { id: menu + property alias interactive: gridView.interactive required property Item keyUpTarget required property Item keyDownTarget @@ -14,14 +16,24 @@ FocusScope { anchors.fill: parent clip: true gradient: Gradient { - GradientStop { position: 0.0; color: "#193441" } - GradientStop { position: 1.0; color: Qt.darker("#193441") } + GradientStop { + position: 0.0 + color: "#193441" + } + GradientStop { + position: 1.0 + color: Qt.darker("#193441") + } } GridView { id: gridView - anchors.fill: parent; anchors.leftMargin: 20; anchors.rightMargin: 20 - cellWidth: 152; cellHeight: 152 + + anchors.fill: parent + anchors.leftMargin: 20 + anchors.rightMargin: 20 + cellWidth: 152 + cellHeight: 152 focus: true model: 12 @@ -31,22 +43,36 @@ FocusScope { delegate: Item { id: container - width: GridView.view.cellWidth - height: GridView.view.cellHeight + + width: gridView.cellWidth + height: gridView.cellHeight required property int index Rectangle { id: content + color: "transparent" antialiasing: true - anchors.fill: parent; anchors.margins: 20; radius: 10 + anchors.fill: parent + anchors.margins: 20 + radius: 10 - Rectangle { color: "#91AA9D"; anchors.fill: parent; anchors.margins: 3; radius: 8; antialiasing: true } - Image { source: "images/qt-logo.png"; anchors.centerIn: parent } + Rectangle { + color: "#91AA9D" + anchors.fill: parent + anchors.margins: 3 + radius: 8 + antialiasing: true + } + Image { + source: "images/qt-logo.png" + anchors.centerIn: parent + } } MouseArea { id: mouseArea + anchors.fill: parent hoverEnabled: true @@ -57,7 +83,8 @@ FocusScope { } states: State { - name: "active"; when: container.activeFocus + name: "active" + when: container.activeFocus PropertyChanges { content { color: "#FCFFF5" @@ -67,7 +94,10 @@ FocusScope { } transitions: Transition { - NumberAnimation { properties: "scale"; duration: 100 } + NumberAnimation { + properties: "scale" + duration: 100 + } } } } |