aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorShawn Rutledge <shawn.rutledge@qt.io>2023-06-29 12:51:23 +0200
committerShawn Rutledge <shawn.rutledge@qt.io>2023-07-02 21:43:46 +0200
commit1fc968c51350b509ea016fbf539978f8f3889a25 (patch)
treecea79e00d7a6a77b299ed3fe49bdf0e298fdf5e0
parent794b6a6ab761f797b16aedfe26157b02cedc22e4 (diff)
Move touchinteraction examples to pointerhandlers and manual test
These are getting long in the tooth, but multiflame and corkboards seem worthwhile to update to use Pointer Handlers (as we could have done sometime during the last 5 years or so). The qrc prefix seems to have changed: let's get the qmake build working again. The multiflame example is mostly rewritten: - all in one file, which can run standalone - only one ParticleSystem instance (which hopefully is more efficient) - using an inline component - less boilerplate per component instance (only one property for ColoredEmitter, which is both its color and its group name) - less-extreme, more fire-like colors The version of corkboards in Qt Quick 3D was already updated (and then removed for unrelated reasons); now we have the fixes from 0227fcdf3ea82efee3005d99fd1019410a7f5789 BearWhack has nice graphics, but doesn't seem like a very nice use of multi-touch, so it's demoted to the touch manual test for now. The simple Flickable use cases seem underwhelming nowadays too, and we have snippets as simple as those. Replace mentions of touchinteraction for testing with pointerhandlers. Pick-to: 6.6 Change-Id: I4667e13e961ca6f84d3336505b3c673790babfa5 Reviewed-by: Shawn Rutledge <shawn.rutledge@qt.io> Reviewed-by: Qt CI Bot <qt_ci_bot@qt-project.org>
-rw-r--r--examples/quick/CMakeLists.txt2
-rw-r--r--examples/quick/pointerhandlers/CMakeLists.txt7
-rw-r--r--examples/quick/pointerhandlers/components/CorkPanel.qml118
-rw-r--r--examples/quick/pointerhandlers/components/images/cork.jpg (renamed from examples/quick/touchinteraction/flickable/cork.jpg)bin149337 -> 149337 bytes
-rw-r--r--examples/quick/pointerhandlers/components/images/note-yellow.png (renamed from examples/quick/touchinteraction/flickable/note-yellow.png)bin54283 -> 54283 bytes
-rw-r--r--examples/quick/pointerhandlers/components/images/tack.png (renamed from examples/quick/touchinteraction/flickable/tack.png)bin7282 -> 7282 bytes
-rw-r--r--examples/quick/pointerhandlers/corkboards.qml (renamed from examples/quick/touchinteraction/flickable/corkboards.qml)6
-rw-r--r--examples/quick/pointerhandlers/images/blur-circle.png (renamed from examples/quick/touchinteraction/multipointtouch/blur-circle.png)bin4279 -> 4279 bytes
-rw-r--r--examples/quick/pointerhandlers/multiflame.qml69
-rw-r--r--examples/quick/pointerhandlers/pointerhandlers.qml2
-rw-r--r--examples/quick/pointerhandlers/qml.qrc9
-rw-r--r--examples/quick/quick.pro2
-rw-r--r--examples/quick/touchinteraction/CMakeLists.txt69
-rw-r--r--examples/quick/touchinteraction/doc/images/qml-touchinteraction-example.pngbin35860 -> 0 bytes
-rw-r--r--examples/quick/touchinteraction/doc/src/touchinteraction.qdoc55
-rw-r--r--examples/quick/touchinteraction/flickable/Panel.qml113
-rw-r--r--examples/quick/touchinteraction/main.cpp4
-rw-r--r--examples/quick/touchinteraction/multipointtouch/ParticleFlame.qml33
-rw-r--r--examples/quick/touchinteraction/multipointtouch/multiflame.qml57
-rw-r--r--examples/quick/touchinteraction/touchinteraction.pro10
-rw-r--r--examples/quick/touchinteraction/touchinteraction.qml21
-rw-r--r--examples/quick/touchinteraction/touchinteraction.qmlproject17
-rw-r--r--examples/quick/touchinteraction/touchinteraction.qrc27
-rw-r--r--tests/auto/guiapplauncher/examples.txt1
-rw-r--r--tests/auto/quick/examples/tst_examples.cpp3
-rw-r--r--tests/manual/touch/CMakeLists.txt19
-rw-r--r--tests/manual/touch/basic-flickable.qml (renamed from examples/quick/touchinteraction/flickable/basic-flickable.qml)0
-rw-r--r--tests/manual/touch/bearwhack/AugmentedTouchPoint.qml (renamed from examples/quick/touchinteraction/multipointtouch/AugmentedTouchPoint.qml)0
-rw-r--r--tests/manual/touch/bearwhack/Bear0.png (renamed from examples/quick/touchinteraction/multipointtouch/Bear0.png)bin14359 -> 14359 bytes
-rw-r--r--tests/manual/touch/bearwhack/Bear1.png (renamed from examples/quick/touchinteraction/multipointtouch/Bear1.png)bin99378 -> 99378 bytes
-rw-r--r--tests/manual/touch/bearwhack/Bear2.png (renamed from examples/quick/touchinteraction/multipointtouch/Bear2.png)bin80759 -> 80759 bytes
-rw-r--r--tests/manual/touch/bearwhack/Bear3.png (renamed from examples/quick/touchinteraction/multipointtouch/Bear3.png)bin21122 -> 21122 bytes
-rw-r--r--tests/manual/touch/bearwhack/BearB.png (renamed from examples/quick/touchinteraction/multipointtouch/BearB.png)bin16505 -> 16505 bytes
-rw-r--r--tests/manual/touch/bearwhack/BearWhackParticleSystem.qml (renamed from examples/quick/touchinteraction/multipointtouch/BearWhackParticleSystem.qml)0
-rw-r--r--tests/manual/touch/bearwhack/bearwhack.qml (renamed from examples/quick/touchinteraction/multipointtouch/bearwhack.qml)0
-rw-r--r--tests/manual/touch/bearwhack/blur-circle.pngbin0 -> 4279 bytes
-rw-r--r--tests/manual/touch/bearwhack/blur-circle3.png (renamed from examples/quick/touchinteraction/multipointtouch/blur-circle3.png)bin5148 -> 5148 bytes
-rw-r--r--tests/manual/touch/bearwhack/heart-blur.png (renamed from examples/quick/touchinteraction/multipointtouch/heart-blur.png)bin5406 -> 5406 bytes
-rw-r--r--tests/manual/touch/bearwhack/title.png (renamed from examples/quick/touchinteraction/multipointtouch/title.png)bin76389 -> 76389 bytes
-rw-r--r--tests/manual/touch/flickresize.qml (renamed from examples/quick/touchinteraction/pincharea/flickresize.qml)0
-rw-r--r--tests/manual/touch/main.qml2
-rw-r--r--tests/manual/touch/qt-logo.jpg (renamed from examples/quick/touchinteraction/pincharea/qt-logo.jpg)bin40886 -> 40886 bytes
42 files changed, 226 insertions, 420 deletions
diff --git a/examples/quick/CMakeLists.txt b/examples/quick/CMakeLists.txt
index bfeb47f898..ad31083163 100644
--- a/examples/quick/CMakeLists.txt
+++ b/examples/quick/CMakeLists.txt
@@ -21,7 +21,6 @@ add_subdirectory(scenegraph)
qt_internal_add_example(shadereffects)
qt_internal_add_example(text)
qt_internal_add_example(threading)
-qt_internal_add_example(touchinteraction)
add_subdirectory(tutorials)
add_subdirectory(customitems)
qt_internal_add_example(imageprovider)
@@ -52,7 +51,6 @@ set(reused_dir_targets
righttoleft_shared
text_shared
threading_shared
- touchinteraction_shared
window_shared
shapes_shared
imageelements_shared
diff --git a/examples/quick/pointerhandlers/CMakeLists.txt b/examples/quick/pointerhandlers/CMakeLists.txt
index 1f79a4b4ae..376d0e379d 100644
--- a/examples/quick/pointerhandlers/CMakeLists.txt
+++ b/examples/quick/pointerhandlers/CMakeLists.txt
@@ -33,6 +33,7 @@ qt_add_qml_module(pointerhandlersexample
QML_FILES
"components/Button.qml"
"components/CheckBox.qml"
+ "components/CorkPanel.qml"
"components/FakeFlickable.qml"
"components/FlashAnimation.qml"
"components/LeftDrawer.qml"
@@ -42,12 +43,14 @@ qt_add_qml_module(pointerhandlersexample
"components/ScrollBar.qml"
"components/Slider.qml"
"components/TouchpointFeedbackSprite.qml"
+ "corkboards.qml"
"fakeFlickable.qml"
"flingAnimation.qml"
"joystick.qml"
"map.qml"
"mixer.qml"
"multibuttons.qml"
+ "multiflame.qml"
"pieMenu.qml"
"pinchHandler.qml"
"pointerhandlers.qml"
@@ -57,6 +60,7 @@ qt_add_qml_module(pointerhandlersexample
"tapHandler.qml"
RESOURCES
"components/images/checkmark.png"
+ "components/images/cork.jpg"
"components/images/fingersprite.png"
"components/images/mixer-knob.png"
"components/images/mouse.png"
@@ -64,8 +68,11 @@ qt_add_qml_module(pointerhandlersexample
"components/images/mouse_middle.png"
"components/images/mouse_right.png"
"components/images/mouse_wheel_ridges.png"
+ "components/images/note-yellow.png"
+ "components/images/tack.png"
"images/arrowhead.png"
"images/balloon.png"
+ "images/blur-circle.png"
"images/cursor-airbrush.png"
"images/cursor-eraser.png"
"images/cursor-felt-marker.png"
diff --git a/examples/quick/pointerhandlers/components/CorkPanel.qml b/examples/quick/pointerhandlers/components/CorkPanel.qml
new file mode 100644
index 0000000000..4aec2b5c7c
--- /dev/null
+++ b/examples/quick/pointerhandlers/components/CorkPanel.qml
@@ -0,0 +1,118 @@
+// Copyright (C) 2021 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+
+Image {
+ id: corkPanel
+ source: Qt.resolvedUrl("images/cork.jpg")
+ width: ListView.view.width
+ height: ListView.view.height
+ fillMode: Image.PreserveAspectCrop
+
+ required property string name
+ required property var notes
+
+ TapHandler {
+ objectName: corkPanel.name
+ onTapped: corkPanel.Window.activeFocusItem.focus = false
+ }
+
+ Text {
+ text: corkPanel.name
+ x: 15
+ y: 8
+ height: 40
+ width: 370
+ font.pixelSize: 18
+ font.bold: true
+ color: "white"
+ style: Text.Outline
+ styleColor: "black"
+ wrapMode: Text.Wrap
+ }
+
+ Repeater {
+ model: corkPanel.notes
+ Item {
+ id: fulcrum
+
+ x: 100 + Math.random() * (corkPanel.width - 0.5 * paper.width)
+ y: 50 + Math.random() * (corkPanel.height - 0.5 * paper.height)
+
+ Item {
+ id: note
+ scale: 0.7
+
+ Image {
+ id: paper
+ x: 8 + -width * 0.6 / 2
+ y: -20
+ source: "images/note-yellow.png"
+ scale: 0.6
+ transformOrigin: Item.TopLeft
+ antialiasing: true
+
+ DragHandler {
+ target: fulcrum
+ xAxis.minimum: 100
+ xAxis.maximum: corkPanel.width - 80
+ yAxis.minimum: 0
+ yAxis.maximum: corkPanel.height - 80
+ }
+ }
+
+ TextEdit {
+ id: text
+ x: -104
+ y: 36
+ width: 215
+ height: 24
+ font.pixelSize: 24
+ readOnly: false
+ selectByMouse: activeFocus
+ rotation: -8
+ text: noteText
+ wrapMode: Text.Wrap
+ }
+
+ rotation: -flickable.horizontalVelocity / 100
+ Behavior on rotation {
+ SpringAnimation {
+ spring: 2.0
+ damping: 0.15
+ }
+ }
+ }
+
+ Image {
+ x: -width / 2
+ y: -height * 0.5 / 2
+ source: "images/tack.png"
+ scale: 0.7
+ transformOrigin: Item.TopLeft
+ }
+
+ states: State {
+ name: "pressed"
+ when: text.activeFocus
+ PropertyChanges {
+ target: note
+ rotation: 8
+ scale: 1
+ }
+ PropertyChanges {
+ target: fulcrum
+ z: 8
+ }
+ }
+
+ transitions: Transition {
+ NumberAnimation {
+ properties: "rotation,scale"
+ duration: 200
+ }
+ }
+ }
+ }
+}
diff --git a/examples/quick/touchinteraction/flickable/cork.jpg b/examples/quick/pointerhandlers/components/images/cork.jpg
index 160bc002bf..160bc002bf 100644
--- a/examples/quick/touchinteraction/flickable/cork.jpg
+++ b/examples/quick/pointerhandlers/components/images/cork.jpg
Binary files differ
diff --git a/examples/quick/touchinteraction/flickable/note-yellow.png b/examples/quick/pointerhandlers/components/images/note-yellow.png
index 3195952ad2..3195952ad2 100644
--- a/examples/quick/touchinteraction/flickable/note-yellow.png
+++ b/examples/quick/pointerhandlers/components/images/note-yellow.png
Binary files differ
diff --git a/examples/quick/touchinteraction/flickable/tack.png b/examples/quick/pointerhandlers/components/images/tack.png
index cef2d1cd23..cef2d1cd23 100644
--- a/examples/quick/touchinteraction/flickable/tack.png
+++ b/examples/quick/pointerhandlers/components/images/tack.png
Binary files differ
diff --git a/examples/quick/touchinteraction/flickable/corkboards.qml b/examples/quick/pointerhandlers/corkboards.qml
index a8b9032dfd..76928f1b8c 100644
--- a/examples/quick/touchinteraction/flickable/corkboards.qml
+++ b/examples/quick/pointerhandlers/corkboards.qml
@@ -2,6 +2,7 @@
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
+import "components"
Rectangle {
width: 320; height: 480
@@ -44,8 +45,7 @@ Rectangle {
orientation: ListView.Horizontal
snapMode: ListView.SnapOneItem
model: list
- delegate: Panel {
- horizontalVelocity: flickable.horizontalVelocity
- }
+ delegate: CorkPanel { objectName: name }
}
}
+
diff --git a/examples/quick/touchinteraction/multipointtouch/blur-circle.png b/examples/quick/pointerhandlers/images/blur-circle.png
index 1b03cd0b2c..1b03cd0b2c 100644
--- a/examples/quick/touchinteraction/multipointtouch/blur-circle.png
+++ b/examples/quick/pointerhandlers/images/blur-circle.png
Binary files differ
diff --git a/examples/quick/pointerhandlers/multiflame.qml b/examples/quick/pointerhandlers/multiflame.qml
new file mode 100644
index 0000000000..7793e52ad6
--- /dev/null
+++ b/examples/quick/pointerhandlers/multiflame.qml
@@ -0,0 +1,69 @@
+// Copyright (C) 2023 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+import QtQuick
+import QtQuick.Particles
+
+Rectangle {
+ id: root
+ width: 360
+ height: 480
+ color: "black"
+
+ component ColoredEmitter: Emitter {
+ id: emitter
+ property string color
+ group: color
+ velocityFromMovement: 10
+ emitRate: 80
+ lifeSpan: 1500
+ velocity: PointDirection {
+ y: -90
+ yVariation: 50
+ }
+ acceleration: PointDirection {
+ xVariation: 100
+ yVariation: 90
+ }
+ size: 51
+ sizeVariation: 53
+ endSize: 64
+ enabled: handler.active
+ x: handler.point.position.x
+ y: handler.point.position.y
+
+ PointHandler {
+ id: handler
+ parent: root
+ }
+
+ ImageParticle {
+ id: img
+ groups: [emitter.color]
+ source: "images/blur-circle.png"
+ colorVariation: 0.1
+ color: emitter.color
+ alpha: 0
+ system: sys
+ }
+ }
+
+ ParticleSystem {
+ id: sys
+ ColoredEmitter {
+ color: "indianred"
+ }
+ ColoredEmitter {
+ color: "greenyellow"
+ }
+ ColoredEmitter {
+ color: "yellow"
+ }
+ ColoredEmitter {
+ color: "darkorange"
+ }
+ ColoredEmitter {
+ color: "violet"
+ }
+ }
+}
diff --git a/examples/quick/pointerhandlers/pointerhandlers.qml b/examples/quick/pointerhandlers/pointerhandlers.qml
index 447e3a8158..049182fa8a 100644
--- a/examples/quick/pointerhandlers/pointerhandlers.qml
+++ b/examples/quick/pointerhandlers/pointerhandlers.qml
@@ -20,12 +20,14 @@ Rectangle {
addExample("multibuttons", "TapHandler: gesturePolicy (99 red balloons)", Qt.resolvedUrl("multibuttons.qml"))
addExample("pieMenu", "TapHandler: pie menu", Qt.resolvedUrl("pieMenu.qml"))
addExample("single point handler", "PointHandler: properties such as seat, device, modifiers, velocity, pressure", Qt.resolvedUrl("singlePointHandlerProperties.qml"))
+ addExample("multiflame", "PointHandler: particle flames around touchpoints", Qt.resolvedUrl("multiflame.qml"))
addExample("hover sidebar", "HoverHandler: a hierarchy of items sharing the hover state", Qt.resolvedUrl("sidebar.qml"))
addExample("joystick", "DragHandler: move one item inside another with any pointing device", Qt.resolvedUrl("joystick.qml"))
addExample("mixer", "DragHandler: drag multiple sliders with multiple fingers", Qt.resolvedUrl("mixer.qml"))
addExample("fling animation", "DragHandler: after dragging, use an animation to simulate momentum", Qt.resolvedUrl("flingAnimation.qml"))
addExample("pinch", "PinchHandler: scale, rotate and drag", Qt.resolvedUrl("pinchHandler.qml"))
addExample("map", "scale, pan, re-render at different resolutions", Qt.resolvedUrl("map.qml"))
+ addExample("corkboards", "editable, movable sticky notes in a ListView", Qt.resolvedUrl("corkboards.qml"))
addExample("fake Flickable", "implementation of a simplified Flickable using only Items, DragHandler and MomentumAnimation", Qt.resolvedUrl("fakeFlickable.qml"))
addExample("tablet canvas", "PointHandler and HoverHandler with a tablet: detect the stylus, and draw", Qt.resolvedUrl("tabletCanvasDrawing.qml"))
}
diff --git a/examples/quick/pointerhandlers/qml.qrc b/examples/quick/pointerhandlers/qml.qrc
index e9a39bc50c..237eb8eae0 100644
--- a/examples/quick/pointerhandlers/qml.qrc
+++ b/examples/quick/pointerhandlers/qml.qrc
@@ -1,11 +1,13 @@
<RCC>
- <qresource prefix="/pointerhandlers">
+ <qresource prefix="/qt/qml/pointerhandlers">
+ <file>corkboards.qml</file>
<file>flingAnimation.qml</file>
<file>fakeFlickable.qml</file>
<file>joystick.qml</file>
<file>map.qml</file>
<file>mixer.qml</file>
<file>multibuttons.qml</file>
+ <file>multiflame.qml</file>
<file>pieMenu.qml</file>
<file>pinchHandler.qml</file>
<file>pointerhandlers.qml</file>
@@ -15,6 +17,7 @@
<file>tapHandler.qml</file>
<file>components/Button.qml</file>
<file>components/CheckBox.qml</file>
+ <file>components/CorkPanel.qml</file>
<file>components/FakeFlickable.qml</file>
<file>components/FlashAnimation.qml</file>
<file>components/LeftDrawer.qml</file>
@@ -27,6 +30,10 @@
<file>images/arrowhead.png</file>
<file>images/balloon.png</file>
<file>components/images/checkmark.png</file>
+ <file>components/images/cork.jpg</file>
+ <file>components/images/note-yellow.png</file>
+ <file>components/images/tack.png</file>
+ <file>images/blur-circle.png</file>
<file>images/cursor-airbrush.png</file>
<file>images/cursor-eraser.png</file>
<file>images/cursor-felt-marker.png</file>
diff --git a/examples/quick/quick.pro b/examples/quick/quick.pro
index 9ae68ed8c8..d1a3c6db24 100644
--- a/examples/quick/quick.pro
+++ b/examples/quick/quick.pro
@@ -13,13 +13,13 @@ SUBDIRS = quick-accessibility \
views \
tableview \
mousearea \
+ pointerhandlers \
positioners \
righttoleft \
scenegraph \
shadereffects \
text \
threading \
- touchinteraction \
tutorials \
customitems \
imageprovider \
diff --git a/examples/quick/touchinteraction/CMakeLists.txt b/examples/quick/touchinteraction/CMakeLists.txt
deleted file mode 100644
index 6b27f3828b..0000000000
--- a/examples/quick/touchinteraction/CMakeLists.txt
+++ /dev/null
@@ -1,69 +0,0 @@
-# Copyright (C) 2022 The Qt Company Ltd.
-# SPDX-License-Identifier: BSD-3-Clause
-
-cmake_minimum_required(VERSION 3.16)
-project(touchinteraction LANGUAGES CXX)
-
-if(NOT DEFINED INSTALL_EXAMPLESDIR)
- set(INSTALL_EXAMPLESDIR "examples")
-endif()
-
-set(INSTALL_EXAMPLEDIR "${INSTALL_EXAMPLESDIR}/quick/touchinteraction")
-
-find_package(Qt6 REQUIRED COMPONENTS Core Gui Qml Quick)
-
-qt_standard_project_setup(REQUIRES 6.5)
-
-add_subdirectory("../shared" "shared")
-
-qt_add_executable(touchinteractionexample
- WIN32
- MACOSX_BUNDLE
- main.cpp
-)
-
-target_link_libraries(touchinteractionexample PRIVATE
- Qt6::Core
- Qt6::Gui
- Qt6::Qml
- Qt6::Quick
-)
-
-add_dependencies(touchinteractionexample touchinteraction_shared)
-
-qt_add_qml_module(touchinteractionexample
- URI touchinteraction
- QML_FILES
- "flickable/Panel.qml"
- "flickable/basic-flickable.qml"
- "flickable/corkboards.qml"
- "multipointtouch/AugmentedTouchPoint.qml"
- "multipointtouch/BearWhackParticleSystem.qml"
- "multipointtouch/ParticleFlame.qml"
- "multipointtouch/bearwhack.qml"
- "multipointtouch/multiflame.qml"
- "pincharea/flickresize.qml"
- "touchinteraction.qml"
- RESOURCES
- "flickable/cork.jpg"
- "flickable/note-yellow.png"
- "flickable/tack.png"
- "multipointtouch/Bear0.png"
- "multipointtouch/Bear1.png"
- "multipointtouch/Bear2.png"
- "multipointtouch/Bear3.png"
- "multipointtouch/BearB.png"
- "multipointtouch/blur-circle.png"
- "multipointtouch/blur-circle3.png"
- "multipointtouch/heart-blur.png"
- "multipointtouch/title.png"
- "pincharea/qt-logo.jpg"
-)
-
-install(TARGETS touchinteractionexample
- RUNTIME DESTINATION "${INSTALL_EXAMPLEDIR}"
- BUNDLE DESTINATION "${INSTALL_EXAMPLEDIR}"
- LIBRARY DESTINATION "${INSTALL_EXAMPLEDIR}"
-)
-
-bundle_shared(touchinteractionexample)
diff --git a/examples/quick/touchinteraction/doc/images/qml-touchinteraction-example.png b/examples/quick/touchinteraction/doc/images/qml-touchinteraction-example.png
deleted file mode 100644
index d4f0cab201..0000000000
--- a/examples/quick/touchinteraction/doc/images/qml-touchinteraction-example.png
+++ /dev/null
Binary files differ
diff --git a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc b/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
deleted file mode 100644
index 519e79e741..0000000000
--- a/examples/quick/touchinteraction/doc/src/touchinteraction.qdoc
+++ /dev/null
@@ -1,55 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
-/*!
- \title Qt Quick Examples - Touch Interaction
- \example touchinteraction
- \brief A collection of QML Touch Interaction examples.
- \image qml-touchinteraction-example.png
-
- \e{Touch Interaction} is a collection of small QML examples relating to
- touch interaction methods. For more information, visit
- \l{Important Concepts In Qt Quick - User Input}.
-
- \include examples-run.qdocinc
-
- \section1 Multipoint Flames Example
-
- \e{Multipoint Flames} demonstrates distinguishing different fingers in a
- \l MultiPointTouchArea, by assigning a different colored flame to each touch
- point.
-
- The MultipointTouchArea sets up multiple touch points:
- \snippet touchinteraction/multipointtouch/multiflame.qml 0
-
- The flames are then simply bound to the coordinates of the touch point, and
- whether it is currently pressed, as follows:
- \snippet touchinteraction/multipointtouch/multiflame.qml 1
-
- \section1 Bear-Whack Example
-
- \e{Bear-Whack} demonstrates using \l MultiPointTouchArea to add multiple
- finger support to a simple game. The interaction with the game
- is done through a SpriteGoal that follows the TouchPoint. The TouchPoints
- added to the MultiPointTouchArea are a component with the relevant logic
- embedded into it:
- \snippet touchinteraction/multipointtouch/AugmentedTouchPoint.qml 0
-
- \section1 Flick Resize Example
-
- \e{Flick Resize} uses a \l PinchArea to implement a \e{pinch-to-resize}
- behavior. This is easily achieved by listening to the PinchArea signals and
- responding to user input.
- \snippet touchinteraction/pincharea/flickresize.qml 0
-
- \section1 Flickable Example
-
- \e Flickable is a simple example demonstrating the \l Flickable type.
- \snippet touchinteraction/flickable/basic-flickable.qml 0
-
- \section1 Corkboards Example
-
- \e Corkboards shows another use for \l Flickable, with QML types within the
- flickable object that respond to mouse and keyboard interaction. This
- behavior does not require special code as the Qt Quick types already
- cooperate with the Flickable type for accepting touch events.
-*/
diff --git a/examples/quick/touchinteraction/flickable/Panel.qml b/examples/quick/touchinteraction/flickable/Panel.qml
deleted file mode 100644
index 25c864799e..0000000000
--- a/examples/quick/touchinteraction/flickable/Panel.qml
+++ /dev/null
@@ -1,113 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-
-import QtQuick
-
-Item {
- required property string name
- required property var notes
-
- 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: page.name; x: 15; y: 8; height: 40; width: 370
- font.pixelSize: 18; font.bold: true; color: "white"
- style: Text.Outline; styleColor: "black"
- }
-
- Repeater {
- model: page.notes
- Item {
- id: stickyPage
- required property string noteText
-
- 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
-
- x: randomX; y: randomY
-
- rotation: -page.horizontalVelocity / 100
- Behavior on rotation {
- SpringAnimation { spring: 2.0; damping: 0.15 }
- }
-
- 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
- }
-
- TextEdit {
- id: myText
- x: -104; y: 36; width: 215; height: 200
- font.pixelSize: 24
- readOnly: false
- rotation: -8
- text: stickyPage.noteText
- }
-
- 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 {
- sticky {
- rotation: 8
- scale: 1
- }
- page.z: 8
- }
- }
-
- transitions: Transition {
- NumberAnimation { properties: "rotation,scale"; duration: 200 }
- }
- }
- }
-}
diff --git a/examples/quick/touchinteraction/main.cpp b/examples/quick/touchinteraction/main.cpp
deleted file mode 100644
index e268ff0391..0000000000
--- a/examples/quick/touchinteraction/main.cpp
+++ /dev/null
@@ -1,4 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-#include "../shared/shared.h"
-DECLARATIVE_EXAMPLE_MAIN(touchinteraction/touchinteraction)
diff --git a/examples/quick/touchinteraction/multipointtouch/ParticleFlame.qml b/examples/quick/touchinteraction/multipointtouch/ParticleFlame.qml
deleted file mode 100644
index 66907b1f0d..0000000000
--- a/examples/quick/touchinteraction/multipointtouch/ParticleFlame.qml
+++ /dev/null
@@ -1,33 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-
-import QtQuick
-import QtQuick.Particles
-
-ParticleSystem {
- anchors.fill: parent
-
- property alias emitterX: emitter.x
- property alias emitterY: emitter.y
-
- property alias color: img.color
- property alias emitting: emitter.enabled
- ImageParticle {
- id: img
- source: "blur-circle.png"
- colorVariation: 0.1
- color: "#ff521d"
- alpha: 0
- }
- Emitter {
- id: emitter
- velocityFromMovement: 10
- emitRate: 80
- lifeSpan: 1500
- velocity: PointDirection{ y: -90; yVariation: 50; }
- acceleration: PointDirection{ xVariation: 100; yVariation: 90; }
- size: 51
- sizeVariation: 53
- endSize: 64
- }
-}
diff --git a/examples/quick/touchinteraction/multipointtouch/multiflame.qml b/examples/quick/touchinteraction/multipointtouch/multiflame.qml
deleted file mode 100644
index 3e03bf2815..0000000000
--- a/examples/quick/touchinteraction/multipointtouch/multiflame.qml
+++ /dev/null
@@ -1,57 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-import QtQuick
-
-Rectangle {
- width: 360
- height: 480
- color: "black"
-
-//! [0]
- MultiPointTouchArea {
- anchors.fill: parent
- minimumTouchPoints: 1
- maximumTouchPoints: 5
- touchPoints: [
- TouchPoint { id: touch1 },
- TouchPoint { id: touch2 },
- TouchPoint { id: touch11 },
- TouchPoint { id: touch21 },
- TouchPoint { id: touch31 }
- ]
- }
-//! [0]
-
-//! [1]
- ParticleFlame {
- color: "red"
- emitterX: touch1.x
- emitterY: touch1.y
- emitting: touch1.pressed
- }
-//! [1]
- ParticleFlame {
- color: "green"
- emitterX: touch2.x
- emitterY: touch2.y
- emitting: touch2.pressed
- }
- ParticleFlame {
- color: "yellow"
- emitterX: touch11.x
- emitterY: touch11.y
- emitting: touch11.pressed
- }
- ParticleFlame {
- color: "blue"
- emitterX: touch21.x
- emitterY: touch21.y
- emitting: touch21.pressed
- }
- ParticleFlame {
- color: "violet"
- emitterX: touch31.x
- emitterY: touch31.y
- emitting: touch31.pressed
- }
-}
diff --git a/examples/quick/touchinteraction/touchinteraction.pro b/examples/quick/touchinteraction/touchinteraction.pro
deleted file mode 100644
index 0ae0a41cce..0000000000
--- a/examples/quick/touchinteraction/touchinteraction.pro
+++ /dev/null
@@ -1,10 +0,0 @@
-TEMPLATE = app
-
-QT += quick qml
-SOURCES += main.cpp
-RESOURCES += \
- touchinteraction.qrc \
- ../shared/shared.qrc
-
-target.path = $$[QT_INSTALL_EXAMPLES]/quick/touchinteraction
-INSTALLS += target
diff --git a/examples/quick/touchinteraction/touchinteraction.qml b/examples/quick/touchinteraction/touchinteraction.qml
deleted file mode 100644
index 6961e48fd4..0000000000
--- a/examples/quick/touchinteraction/touchinteraction.qml
+++ /dev/null
@@ -1,21 +0,0 @@
-// Copyright (C) 2017 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
-
-import QtQuick
-import shared
-
-Item {
- height: 480
- width: 320
- LauncherList {
- id: ll
- anchors.fill: parent
- Component.onCompleted: {
- addExample("Multipoint Flames", "Create multiple flames with multiple fingers", Qt.resolvedUrl("multipointtouch/multiflame.qml"));
- addExample("Bear-Whack", "Use multiple touches to knock all the bears down", Qt.resolvedUrl("multipointtouch/bearwhack.qml"));
- addExample("Flick Resize", "Manipulate images using pinch gestures", Qt.resolvedUrl("pincharea/flickresize.qml"));
- addExample("Flickable", "A viewport you can move with touch gestures", Qt.resolvedUrl("flickable/basic-flickable.qml"));
- addExample("Corkboards", "Uses touch input on items inside a Flickable", Qt.resolvedUrl("flickable/corkboards.qml"));
- }
- }
-}
diff --git a/examples/quick/touchinteraction/touchinteraction.qmlproject b/examples/quick/touchinteraction/touchinteraction.qmlproject
deleted file mode 100644
index 50254f287f..0000000000
--- a/examples/quick/touchinteraction/touchinteraction.qmlproject
+++ /dev/null
@@ -1,17 +0,0 @@
-import QmlProject 1.1
-
-Project {
- mainFile: "touchinteraction.qml"
- importPaths: [ "../" ]
-
- /* Include .qml, .js, and image files from current directory and subdirectories */
- QmlFiles {
- directory: "."
- }
- JavaScriptFiles {
- directory: "."
- }
- ImageFiles {
- directory: "."
- }
-}
diff --git a/examples/quick/touchinteraction/touchinteraction.qrc b/examples/quick/touchinteraction/touchinteraction.qrc
deleted file mode 100644
index 6d0427b053..0000000000
--- a/examples/quick/touchinteraction/touchinteraction.qrc
+++ /dev/null
@@ -1,27 +0,0 @@
-<RCC>
- <qresource prefix="/qt/qml/touchinteraction">
- <file>touchinteraction.qml</file>
- <file>flickable/basic-flickable.qml</file>
- <file>flickable/corkboards.qml</file>
- <file>flickable/cork.jpg</file>
- <file>flickable/note-yellow.png</file>
- <file>flickable/Panel.qml</file>
- <file>flickable/tack.png</file>
- <file>multipointtouch/bearwhack.qml</file>
- <file>multipointtouch/multiflame.qml</file>
- <file>multipointtouch/AugmentedTouchPoint.qml</file>
- <file>multipointtouch/Bear0.png</file>
- <file>multipointtouch/Bear1.png</file>
- <file>multipointtouch/Bear2.png</file>
- <file>multipointtouch/Bear3.png</file>
- <file>multipointtouch/BearB.png</file>
- <file>multipointtouch/BearWhackParticleSystem.qml</file>
- <file>multipointtouch/blur-circle.png</file>
- <file>multipointtouch/blur-circle3.png</file>
- <file>multipointtouch/heart-blur.png</file>
- <file>multipointtouch/ParticleFlame.qml</file>
- <file>multipointtouch/title.png</file>
- <file>pincharea/flickresize.qml</file>
- <file>pincharea/qt-logo.jpg</file>
- </qresource>
-</RCC>
diff --git a/tests/auto/guiapplauncher/examples.txt b/tests/auto/guiapplauncher/examples.txt
index 03ad71e7e2..820c0cedad 100644
--- a/tests/auto/guiapplauncher/examples.txt
+++ b/tests/auto/guiapplauncher/examples.txt
@@ -30,7 +30,6 @@
"quick/positioners Example", "examples/quick/positioners", "positioners", 0, -1
"quick/shadereffects Example", "examples/quick/shadereffects", "shadereffects", 0, -1
"quick/mousearea Example", "examples/quick/mousearea", "mousearea", 0, -1
-"quick/touchinteraction Example", "examples/quick/touchinteraction", "touchinteraction", 0, -1
"quick/canvas Example", "examples/quick/canvas", "canvas", 0, -1
"quick/text Example", "examples/quick/text", "text", 0, -1
"quick/quickwidgets/qquickviewcomparison Example", "examples/quick/quickwidgets/qquickviewcomparison", "qquickviewcomparison", 0, -1
diff --git a/tests/auto/quick/examples/tst_examples.cpp b/tests/auto/quick/examples/tst_examples.cpp
index 76b67f9a04..3d4bc51d66 100644
--- a/tests/auto/quick/examples/tst_examples.cpp
+++ b/tests/auto/quick/examples/tst_examples.cpp
@@ -71,8 +71,7 @@ tst_examples::tst_examples()
excludedFiles << "examples/qml/dynamicscene/dynamicscene.qml";
excludedFiles << "examples/quick/animation/basics/color-animation.qml";
excludedFiles << "examples/quick/particles/affectors/content/age.qml";
- excludedFiles << "examples/quick/touchinteraction/multipointtouch/bearwhack.qml";
- excludedFiles << "examples/quick/touchinteraction/multipointtouch/multiflame.qml";
+ excludedFiles << "examples/quick/pointerhandlers/multiflame.qml";
excludedDirs << "examples/quick/particles";
// No Support for ShaderEffect
excludedFiles << "src/quick/doc/snippets/qml/animators.qml";
diff --git a/tests/manual/touch/CMakeLists.txt b/tests/manual/touch/CMakeLists.txt
index 835a593732..a843eb2248 100644
--- a/tests/manual/touch/CMakeLists.txt
+++ b/tests/manual/touch/CMakeLists.txt
@@ -19,9 +19,24 @@ qt_internal_add_manual_test(tst_manual_touch
# Resources:
set(qml_resource_files
+ "basic-flickable.qml"
+ "flickresize.qml"
"flicktext.qml"
"main.qml"
"mpta-crosshairs.qml"
+ "qt-logo.jpg"
+ "bearwhack/heart-blur.png"
+ "bearwhack/Bear0.png"
+ "bearwhack/BearWhackParticleSystem.qml"
+ "bearwhack/blur-circle.png"
+ "bearwhack/Bear1.png"
+ "bearwhack/bearwhack.qml"
+ "bearwhack/Bear2.png"
+ "bearwhack/title.png"
+ "bearwhack/blur-circle3.png"
+ "bearwhack/Bear3.png"
+ "bearwhack/AugmentedTouchPoint.qml"
+ "bearwhack/BearB.png"
)
qt_internal_add_resource(tst_manual_touch "qml"
@@ -53,7 +68,3 @@ qt_internal_add_resource(tst_manual_touch "quick_shared"
FILES
${quick_shared_resource_files}
)
-
-
-#### Keys ignored in scope 1:.:.:touch.pro:<TRUE>:
-# TEMPLATE = "app"
diff --git a/examples/quick/touchinteraction/flickable/basic-flickable.qml b/tests/manual/touch/basic-flickable.qml
index d529f0bec2..d529f0bec2 100644
--- a/examples/quick/touchinteraction/flickable/basic-flickable.qml
+++ b/tests/manual/touch/basic-flickable.qml
diff --git a/examples/quick/touchinteraction/multipointtouch/AugmentedTouchPoint.qml b/tests/manual/touch/bearwhack/AugmentedTouchPoint.qml
index b1d162bbd3..b1d162bbd3 100644
--- a/examples/quick/touchinteraction/multipointtouch/AugmentedTouchPoint.qml
+++ b/tests/manual/touch/bearwhack/AugmentedTouchPoint.qml
diff --git a/examples/quick/touchinteraction/multipointtouch/Bear0.png b/tests/manual/touch/bearwhack/Bear0.png
index f520cc1f1b..f520cc1f1b 100644
--- a/examples/quick/touchinteraction/multipointtouch/Bear0.png
+++ b/tests/manual/touch/bearwhack/Bear0.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/Bear1.png b/tests/manual/touch/bearwhack/Bear1.png
index 3b88f3b32e..3b88f3b32e 100644
--- a/examples/quick/touchinteraction/multipointtouch/Bear1.png
+++ b/tests/manual/touch/bearwhack/Bear1.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/Bear2.png b/tests/manual/touch/bearwhack/Bear2.png
index 337b636070..337b636070 100644
--- a/examples/quick/touchinteraction/multipointtouch/Bear2.png
+++ b/tests/manual/touch/bearwhack/Bear2.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/Bear3.png b/tests/manual/touch/bearwhack/Bear3.png
index f0e68590f4..f0e68590f4 100644
--- a/examples/quick/touchinteraction/multipointtouch/Bear3.png
+++ b/tests/manual/touch/bearwhack/Bear3.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/BearB.png b/tests/manual/touch/bearwhack/BearB.png
index 60be2b32c6..60be2b32c6 100644
--- a/examples/quick/touchinteraction/multipointtouch/BearB.png
+++ b/tests/manual/touch/bearwhack/BearB.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/BearWhackParticleSystem.qml b/tests/manual/touch/bearwhack/BearWhackParticleSystem.qml
index 6537f37087..6537f37087 100644
--- a/examples/quick/touchinteraction/multipointtouch/BearWhackParticleSystem.qml
+++ b/tests/manual/touch/bearwhack/BearWhackParticleSystem.qml
diff --git a/examples/quick/touchinteraction/multipointtouch/bearwhack.qml b/tests/manual/touch/bearwhack/bearwhack.qml
index c5f7dc585c..c5f7dc585c 100644
--- a/examples/quick/touchinteraction/multipointtouch/bearwhack.qml
+++ b/tests/manual/touch/bearwhack/bearwhack.qml
diff --git a/tests/manual/touch/bearwhack/blur-circle.png b/tests/manual/touch/bearwhack/blur-circle.png
new file mode 100644
index 0000000000..1b03cd0b2c
--- /dev/null
+++ b/tests/manual/touch/bearwhack/blur-circle.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/blur-circle3.png b/tests/manual/touch/bearwhack/blur-circle3.png
index dbc39cb16e..dbc39cb16e 100644
--- a/examples/quick/touchinteraction/multipointtouch/blur-circle3.png
+++ b/tests/manual/touch/bearwhack/blur-circle3.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/heart-blur.png b/tests/manual/touch/bearwhack/heart-blur.png
index dbc38804ee..dbc38804ee 100644
--- a/examples/quick/touchinteraction/multipointtouch/heart-blur.png
+++ b/tests/manual/touch/bearwhack/heart-blur.png
Binary files differ
diff --git a/examples/quick/touchinteraction/multipointtouch/title.png b/tests/manual/touch/bearwhack/title.png
index 01893a247d..01893a247d 100644
--- a/examples/quick/touchinteraction/multipointtouch/title.png
+++ b/tests/manual/touch/bearwhack/title.png
Binary files differ
diff --git a/examples/quick/touchinteraction/pincharea/flickresize.qml b/tests/manual/touch/flickresize.qml
index 16108be1a7..16108be1a7 100644
--- a/examples/quick/touchinteraction/pincharea/flickresize.qml
+++ b/tests/manual/touch/flickresize.qml
diff --git a/tests/manual/touch/main.qml b/tests/manual/touch/main.qml
index ca40140271..6a51e02aa0 100644
--- a/tests/manual/touch/main.qml
+++ b/tests/manual/touch/main.qml
@@ -14,6 +14,8 @@ Window {
anchors.fill: parent
Component.onCompleted: {
addExample("crosshairs", "crosshairs and velocity vectors at finger positions", Qt.resolvedUrl("mpta-crosshairs.qml"))
+ addExample("flickable", "flick a bigger Rectangle", Qt.resolvedUrl("basic-flickable.qml"))
+ addExample("flick and resize", "flick and resize an image (old-school PinchArea)", Qt.resolvedUrl("flickresize.qml"))
addExample("flick text", "flick a text document", Qt.resolvedUrl("flicktext.qml"))
}
}
diff --git a/examples/quick/touchinteraction/pincharea/qt-logo.jpg b/tests/manual/touch/qt-logo.jpg
index 4014b4659c..4014b4659c 100644
--- a/examples/quick/touchinteraction/pincharea/qt-logo.jpg
+++ b/tests/manual/touch/qt-logo.jpg
Binary files differ