无框QML窗口调整大小时出现卡顿问题求助

问题描述 #

实现无框QML窗口的大小调整功能时，拖动右下角红色矩形会出现卡顿现象，原代码如下：

import QtQuick
import QtQuick.Controls

ApplicationWindow {
  id: root
  visible: true
  width: 800; height: 600
  flags: Qt.FramelessWindowHint


  Item {
    id: myitem //Dummy item as mapToItem requires Item
    anchors.fill: parent

      Rectangle {
        width: 10
        height: 10
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        color: "red"

        MouseArea {
          anchors.fill: parent
          onPositionChanged: {
          root.width += mapToItem(myitem,mouseX,mouseY).x-myitem.width
          root.height += mapToItem(myitem,mouseX,mouseY).y-myitem.height
        }
      }
    }
  }
}

错误原因 #

卡顿的核心问题在于增量式的窗口大小计算逻辑错误：

• 每次触发onPositionChanged时，通过root.width += xxx的方式叠加增量，而mapToItem得到的坐标会随着窗口大小变化而动态改变，导致计算出的增量出现跳变和累积误差，窗口大小调整时频繁抖动。
• 没有记录鼠标按下时的初始窗口尺寸和鼠标位置，无法准确计算拖拽产生的偏移量。

修复方案 #

改用基于初始位置的偏移量计算，记录鼠标按下时的窗口大小和鼠标位置，拖动时根据当前鼠标位置与初始位置的差值直接更新窗口尺寸，避免增量叠加的误差：

import QtQuick
import QtQuick.Controls

ApplicationWindow {
  id: root
  visible: true
  width: 800; height: 600
  flags: Qt.FramelessWindowHint

  // 记录拖拽初始状态
  property int initialWidth: 0
  property int initialHeight: 0
  property point initialMousePos: Qt.point(0, 0)

  Item {
    id: myitem
    anchors.fill: parent

    Rectangle {
      width: 10
      height: 10
      anchors.right: parent.right
      anchors.bottom: parent.bottom
      color: "red"

      MouseArea {
        anchors.fill: parent
        // 鼠标按下时记录初始状态
        onPressed: {
          initialWidth = root.width
          initialHeight = root.height
          initialMousePos = Qt.point(mouseX, mouseY)
        }
        // 拖动时计算偏移量更新窗口大小
        onPositionChanged: {
          if (pressed) {
            const deltaX = mouseX - initialMousePos.x
            const deltaY = mouseY - initialMousePos.y
            root.width = initialWidth + deltaX
            root.height = initialHeight + deltaY
          }
        }
      }
    }
  }
}

关键改动说明 #

• 新增initialWidth、initialHeight、initialMousePos三个属性，用于存储鼠标按下时的窗口初始尺寸和鼠标在矩形内的初始位置。
• 在onPressed事件中记录初始状态，确保拖拽的基准值固定。
• onPositionChanged仅在鼠标按下时触发计算，通过当前鼠标位置与初始位置的差值deltaX、deltaY直接更新窗口宽高，避免了动态坐标带来的计算误差，消除卡顿。

内容的提问来源于stack exchange，提问作者Jepessen