diff options
Diffstat (limited to 'src/quick/doc/snippets')
4 files changed, 225 insertions, 0 deletions
diff --git a/src/quick/doc/snippets/pointerHandlers/dragReleaseMenu.qml b/src/quick/doc/snippets/pointerHandlers/dragReleaseMenu.qml new file mode 100644 index 0000000000..e6d2266408 --- /dev/null +++ b/src/quick/doc/snippets/pointerHandlers/dragReleaseMenu.qml @@ -0,0 +1,72 @@ +// Copyright (C) 2023 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause + +//![0] +import QtQuick + +Rectangle { + id: rect + width: 140; height: 100 + + //![1] + TapHandler { + id: menuPopupHandler + gesturePolicy: TapHandler.DragWithinBounds + onPressedChanged: + if (pressed) { + menu.x = point.position.x - menu.width / 2 + menu.y = point.position.y - menu.height / 2 + } else { + feedback.text = menu.highlightedMenuItem + selectFlash.start() + } + onCanceled: feedback.text = "canceled" + } + //![1] + + Column { + id: menu + visible: menuPopupHandler.pressed + opacity: Math.min(1, menuPopupHandler.timeHeld) + property string highlightedMenuItem: "" + Repeater { + model: [ "top", "middle", "bottom" ] + delegate: Rectangle { + property bool highlighted: menuPopupHandler.pressed && + contains(mapFromItem(rect, menuPopupHandler.point.position)) + onHighlightedChanged: { + if (highlighted) + menu.highlightedMenuItem = menuItemText.text + else if (menu.highlightedMenuItem === menuItemText.text) + menu.highlightedMenuItem = "" + } + width: 100 + height: 20 + color: highlighted ? "lightsteelblue" : "aliceblue" + Text { + id: menuItemText + anchors.centerIn: parent + text: modelData + } + } + } + } + + Text { + id: feedback + y: 6; anchors.horizontalCenter: parent.horizontalCenter + textFormat: Text.MarkdownText + text: "hold for context menu" + + SequentialAnimation on font.weight { + id: selectFlash + running: false + loops: 3 + PropertyAction { value: Font.Black } + PauseAnimation { duration: 100 } + PropertyAction { value: Font.Normal } + PauseAnimation { duration: 100 } + } + } +} +//![0] diff --git a/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonReleaseWithinBounds.qml b/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonReleaseWithinBounds.qml new file mode 100644 index 0000000000..3e8634a605 --- /dev/null +++ b/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonReleaseWithinBounds.qml @@ -0,0 +1,51 @@ +// Copyright (C) 2023 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause +//![0] +import QtQuick + +Item { + width: 120; height: 80 + + component Button : Rectangle { + id: button + signal clicked + property alias text: buttonLabel.text + + width: 80 + height: 40 + radius: 3 + property color dark: Qt.darker(palette.button, 1.3) + gradient: Gradient { + GradientStop { position: 0.0; color: tapHandler.pressed ? dark : palette.button } + GradientStop { position: 1.0; color: dark } + } + + SequentialAnimation on border.width { + id: tapFlash + running: false + loops: 3 + PropertyAction { value: 2 } + PauseAnimation { duration: 100 } + PropertyAction { value: 0 } + PauseAnimation { duration: 100 } + } + + //![1] + TapHandler { + id: tapHandler + gesturePolicy: TapHandler.ReleaseWithinBounds + onTapped: tapFlash.start() + } + //![1] + + Text { + id: buttonLabel + text: "Click Me" + color: palette.buttonText + anchors.centerIn: parent + } + } + + Button { x: 10; y: 10 } +} +//![0] diff --git a/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonWithinBounds.qml b/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonWithinBounds.qml new file mode 100644 index 0000000000..4563b44014 --- /dev/null +++ b/src/quick/doc/snippets/pointerHandlers/tapHandlerButtonWithinBounds.qml @@ -0,0 +1,51 @@ +// Copyright (C) 2023 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause +//![0] +import QtQuick + +Item { + width: 120; height: 80 + + component Button : Rectangle { + id: button + signal clicked + property alias text: buttonLabel.text + + width: 80 + height: 40 + radius: 3 + property color dark: Qt.darker(palette.button, 1.3) + gradient: Gradient { + GradientStop { position: 0.0; color: tapHandler.pressed ? dark : palette.button } + GradientStop { position: 1.0; color: dark } + } + + SequentialAnimation on border.width { + id: tapFlash + running: false + loops: 3 + PropertyAction { value: 2 } + PauseAnimation { duration: 100 } + PropertyAction { value: 0 } + PauseAnimation { duration: 100 } + } + + //![1] + TapHandler { + id: tapHandler + gesturePolicy: TapHandler.WithinBounds + onTapped: tapFlash.start() + } + //![1] + + Text { + id: buttonLabel + text: "Click Me" + color: palette.buttonText + anchors.centerIn: parent + } + } + + Button { x: 10; y: 10 } +} +//![0] diff --git a/src/quick/doc/snippets/pointerHandlers/tapHandlerOverlappingButtons.qml b/src/quick/doc/snippets/pointerHandlers/tapHandlerOverlappingButtons.qml new file mode 100644 index 0000000000..917c863e53 --- /dev/null +++ b/src/quick/doc/snippets/pointerHandlers/tapHandlerOverlappingButtons.qml @@ -0,0 +1,51 @@ +// Copyright (C) 2023 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause +//![0] +import QtQuick + +Item { + width: 120; height: 80 + + component Button : Rectangle { + signal clicked + property alias text: buttonLabel.text + + width: 80 + height: 40 + radius: 3 + property color dark: Qt.darker(palette.button, 1.3) + gradient: Gradient { + GradientStop { position: 0.0; color: tapHandler.pressed ? dark : palette.button } + GradientStop { position: 1.0; color: dark } + } + + SequentialAnimation on border.width { + id: tapFlash + running: false + loops: 3 + PropertyAction { value: 2 } + PauseAnimation { duration: 100 } + PropertyAction { value: 0 } + PauseAnimation { duration: 100 } + } + + //![1] + TapHandler { + id: tapHandler + gesturePolicy: TapHandler.DragThreshold // the default + onTapped: tapFlash.start() + } + //![1] + + Text { + id: buttonLabel + text: "Click Me" + color: palette.buttonText + anchors.centerIn: parent + } + } + + Button { x: 10; y: 10 } + Button { x: 30; y: 30 } +} +//![0] |