Qt Quick 示例 - 指针处理程序

演示如何在交互式组件中使用Qt Quick 输入处理程序

Qt Quick Controls虽然《程序手册》中包含的预制组件足以满足多种用户界面的需要,但有时您可能会发现需要 "从头开始 "编写此类组件。在这种情况下,您需要大量使用指针处理程序。这是一个小型示例集,展示了如何实现一些常见和不太常见的交互模式。

如果将示例作为可执行文件构建,则可以从顶级ListView 中选择页面。TouchpointFeedbackSpriteMouseFeedbackSprite 组件展示了如何使用PointHandler 来反馈用户使用指向设备所做的操作:这些组件在整个示例中始终可见,不会干扰其他地方的交互。如果需要对用户界面进行视频或现场演示,这些组件可以方便地重复使用。

另外,也可使用qml 工具在命令行上运行一些单独的 QML 文件,以快速了解如何构建特定类型的组件。

轻点处理程序

点击 "页面展示了如何检测触摸屏点击、长按和鼠标点击不同的按钮。您还可以尝试使用不同的gesturePolicy 值。

多点按钮

该页面上有三个自定义的Button 组件,它们具有不同的gesturePolicy 值:其中一个按钮要求从按下到松开的整个过程中手指或鼠标都要保持在按钮内;另一个即使在按钮外拖动也会执行,然后在松开前再拖回按钮内;还有一个如果拖动稍稍超过system-wide drag threshold ,就会退出按下状态。如果在触摸屏上尝试这个示例,应该可以同时用不同的手指与所有三个按钮进行交互。

饼形菜单

本页展示了如何编写一个触摸屏友好型饼状菜单,该菜单在长按激活时会以动画形式显示。你可以通过从中心位置拖动到其中一个扇形上并松开来选择菜单项。如果在菜单外拖动,或在菜单中间松开,则什么都不会被选中。如果拖动到灰色视口之外,菜单将被取消。

点处理程序

在 "单点处理程序 "页面上,PointHandler 提供了一些属性的反馈,这些属性可在SinglePointHandler::pointhandlerPoint::device 中找到。如果您已将示例构建为可执行文件,您将同时看到这些反馈,以及来自主 pointerhandlers.qml 文件中 PointHandlers 的反馈。

绘图板画布 "页面使用PointHandler 来唯一检测不同的types of pointing devices ,这样如果您的电脑连接了绘图板,您就可以使用不同类型的触控笔(钢笔、喷笔或记号笔)在画布项上绘图。您可以使用触控笔橡皮擦 "擦除 "笔画(这里是在上面用背景色作画)。HoverHandlers 会反馈检测到的手写笔或橡皮擦类型。

悬停处理程序

悬停边栏 "页面展示了如何检测鼠标是否同时悬停在按钮组件及其容器上。可以通过设置HoverHandler::blocking 属性来禁用传播。你可以在这里尝试HoverHandlerMouseArea 的所有组合,比较它们是如何处理悬停检测的。还有一个HoverHandler 用于在场景坐标中显示当前鼠标位置。

您还可以验证动画 "平台 "上的HoverHandler 是否在鼠标指针下滑动时悬停。

拖动处理程序

在 "操纵杆 "页面中,DragHandler 拖动一个ImageStateAnchorChanges锚点解锁,这样就可以进行拖动;而AnchorAnimation 则为旋钮松开后返回中心位置提供动画效果。

甩动动画 "页面演示了 DragHandler::centroid::velocity 属性的一种用法,它只需在 QML 中提供QEventPoint::velocity() 的值。本例中使用的MomentumAnimation 组件展示了模拟物理(动量和摩擦力)的一种方法,而无需诉诸更重的解决方案。

捏合处理程序

捏 "页面展示了多个 PinchHandler:有些需要两个手指,有些需要三个手指,以执行通常的缩放、旋转和平移,并通过PinchHandler 的轴最小和最大属性管理约束。其中一个PinchHandler 实例用于操作不同的Rectangle 属性,而不是位置、缩放和旋转。各种PinchHandler 属性以不同方式绑定。您应该能够对每个实例进行唯一操作。某些项目还具有 DragHandlers 和 TapHandlers。

互操作性

滑块

混合器 "页面演示了在ListView 委托中使用多个处理程序的方法。您可以同时与多个Slider 组件进行交互,还可以横向滑动ListView

地图

地图 "页面演示了拖动、转换和重新缩放SVG Image 。您应该可以放大地图上的某个特定位置;如果缩放级别发生重大变化,Image::sourceSize ,要求以不同的分辨率重新渲染 SVG。用两根手指垂直拖动可激活DragHandler ,该 可操作Rotation 变换来倾斜地图。

伪造可闪烁页面

假 Flickable "页面尝试使用离散指针处理程序和动画来重现Flickable 的大部分功能。Flickable 是一个复杂的组件,但在这里您可以看到一种将其提供的单个行为分离开来的方法,以防您只想拥有部分功能而不想使用复杂的功能。

此外,还有一个滑出的 "抽屉 "组件,可容纳更多由指针处理程序驱动的控件。

示例项目 @ code.qt.io

© 2025 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.