Qt Quick 示例 - 鼠标区域

这是 QML 中MouseArea 类型的示例。

MouseArea示例展示了如何通过MouseArea 来响应点击和拖动。更多信息,请访问Important Concepts InQt Quick - User Input

运行示例

运行示例 Qt Creator,打开Welcome 模式,然后从Examples 中选择示例。更多信息,请参阅Qt Creator: 教程:构建并运行

鼠标区域行为

当您在红色方块内点击时,Text 类型会列出 QML 可用的点击属性。当鼠标按下并停留在MouseArea 内时,红色方块的不透明度会降低。

当点击或其他离散操作发生时,MouseArea 会发出信号。

onPressAndHold: btn.text = qsTr('Press and hold')
onClicked: (mouse) => { btn.text = qsTr('Clicked (wasHeld=') + mouse.wasHeld + ')' }
onDoubleClicked: btn.text = qsTr('Double clicked')

MouseArea 拖动属性也可用于拖动项目。通过设置 drag 属性的参数,如果用户开始在鼠标区域边界内拖动,目标项目就会被拖动。

drag.target: blueSquare
drag.axis: Drag.XAndYAxis
drag.minimumX: 0
drag.maximumX: box.width - parent.width
drag.minimumY: 0
drag.maximumY: box.height - parent.width

示例项目 @ 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.