QML SplitView窗口缩小时内容无法正常调整大小问题求助
问题原因
- 仅上方
topRectangle配置了SplitView.fillHeight: true,底部bottomRectangle未设置该属性,窗口缩小时SplitView默认不会主动调整底部子项高度,导致底部元素高度溢出窗口,锚定在底部的蓝色矩形被遮挡在可视区域外。 - SplitView的布局计算存在缓存,窗口缩放时没有触发全量布局重算,只有拖动分隔柄时才会强制刷新布局,因此拖动后布局会恢复正常。
修复方案
修改两处代码即可解决问题:
- 给
bottomRectangle添加SplitView.fillHeight: true属性,让两个子项共同参与高度动态分配。 - 监听窗口高度变化,触发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
相关产品推荐
相关产品推荐

