qml 通过鼠标拖动调整rectangle边框的水平位置

在QtQuick中，特别是使用QML（Qt Meta Language）开发时，你可以使用`MouseArea`组件配合`Rectangle`组件来实现鼠标拖动调整矩形的位置。以下是基本步骤：

1. 创建一个`MouseArea`组件并绑定到`Rectangle`上，这将监听矩形区域的鼠标事件：

MouseArea {
    anchors.fill: parent
    dragMoveables: Rectangle { id: myRect; ... }
}

这里，`dragMoveables`属性告诉`MouseArea`只对指定的矩形(`myRect`)进行拖动。

2. 在`Rectangle`组件中，定义它的几何信息，包括初始位置：

Rectangle {
    id: myRect
    x: 50 // 初始水平位置
    y: 50
    width: 100
    height: 100
    color: "blue"
    onPositionChanged: {
        // 当矩形位置改变时，可以在这里处理更新逻辑
    }
}

`onPositionChanged`信号会在矩形的位置发生变化时触发。

3. 实现鼠标按下（down）和移动（move）事件，用于开始和跟踪拖动过程：

MouseArea.onPressed: {
    myRect.setAcceptedMouseButtons(Qt.NoButton); // 接受左键
}

MouseArea.onMoved: {
    myRect.x = mouseX; // 更新矩形的新x坐标（水平位置）
}

当你在矩形上按住鼠标左键并移动时，`onMoved`事件会更新矩形的`x`值，从而改变其水平位置。