You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

QML SplitView窗口缩小时内容无法正常调整大小问题求助

问题原因
  • 仅上方topRectangle配置了SplitView.fillHeight: true,底部bottomRectangle未设置该属性,窗口缩小时SplitView默认不会主动调整底部子项高度,导致底部元素高度溢出窗口,锚定在底部的蓝色矩形被遮挡在可视区域外。
  • SplitView的布局计算存在缓存,窗口缩放时没有触发全量布局重算,只有拖动分隔柄时才会强制刷新布局,因此拖动后布局会恢复正常。
修复方案

修改两处代码即可解决问题:

  1. 给bottomRectangle添加SplitView.fillHeight: true属性,让两个子项共同参与高度动态分配。
  2. 监听窗口高度变化,触发SplitView强制重排布局,避免缓存导致的布局异常。

修改后的完整代码如下:

import QtQuick.Controls 2.15
import QtQuick.Window 2.15

ApplicationWindow {
    id: root

    title: testSplitView
    visible: true
    x: 100; y: 100
    width: 1300; minimumWidth: 900
    height: 900; minimumHeight: 550

    // 监听窗口高度变化,强制SplitView重排布局
    onHeightChanged: verticalSplitView.forceLayout()

    Rectangle{
        id: rectangle
        anchors.fill: parent
        color: "darkGrey"

        SplitView{
            id: verticalSplitView
            anchors.fill: parent
            orientation: Qt.Vertical

            Rectangle{
                id: topRectangle
                SplitView.fillHeight: true
                SplitView.minimumHeight: 200
                color: "red"
            }

            Rectangle{
                id: bottomRectangle
                SplitView.fillHeight: true // 新增属性,让底部元素参与高度填充
                SplitView.minimumHeight:200
                color: "green"
                Rectangle{
                    anchors.bottom: parent.bottom
                    height: 50
                    width: parent.width
                    color: "blue"
                }
            }
        }
    }
}
验证说明

修改后按照之前的步骤复现:先拖动分隔柄向上,再从底部缩小窗口,底部蓝色矩形会始终固定在窗口底部不会消失,无需额外拖动分隔柄即可保持正常布局。

内容的提问来源于stack exchange,提问作者Nicolas GOURDIER

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.25 08:54:07