QML ColumnLayout内按钮重叠，ListView无法正常排布问题咨询

核心原因 #

ColumnLayout 依赖子项的 Layout.* 系列属性计算、分配空间，你的 ListView 未设置任何布局相关属性，默认尺寸为 0x0，因此完全不可见。

取消注释 anchors.fill: parent 后，ListView 直接绑定父布局尺寸，这违背了 Layout 组件的布局逻辑——Layout 子项不应使用 anchors 属性，会触发未定义行为；同时 ListView 会占满整个 ColumnLayout 空间，自然覆盖上方按钮。

修复代码 #

给 ListView 添加布局属性，让 ColumnLayout 正确识别它的尺寸需求：

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

ApplicationWindow {
    id: applicationWindow

    visible: true
    title: "API control panel"

    Connections {
        target: __ApiObj
    }
    Connections {
        target: __VideotestObj
    }
    Connections {
        target: __ButtonListObj
    }

    ColumnLayout {
        // 让布局占满窗口可用空间
        anchors.fill: parent

        Button {
            id: apiEnabler
            text: "Button 0"
            onClicked: __ApiObj.set_enable_api(!__ApiObj.is_running_prop)
        }
        Button {
            id: videotestPipeline
            text: "Button 1"
            onClicked: __VideotestObj.set_enable_pipeline(!__VideotestObj.is_running_prop)
        }
        Button {
            id: playgroundPipeline
            text: "Button 2"
            onClicked: __PlaygroundObj.set_enable_pipeline(!__PlaygroundObj.is_running_prop)
        }
        ListView {
            id: buttonList
            clip: true
            model: __ButtonListObj.model
            // 关键布局属性
            Layout.fillWidth: true // 宽度填满布局
            Layout.fillHeight: true // 占据按钮下方剩余垂直空间
            // 若需要固定高度，可替换为：Layout.preferredHeight: 200

            delegate: Button {
                text: "ListView Button"
                onClicked: model.modelData.set_enable_pipeline(!model.modelData.is_running_prop)
            }
        }
    }
}

补充说明 #

• 要让 ColumnLayout 合理填充窗口，需给它加上 anchors.fill: parent，否则布局会仅根据子项最小尺寸收缩。
• Layout.fillHeight: true 会让 ListView 占据按钮下方所有剩余空间；如果需要固定高度，改用 Layout.preferredHeight 即可。

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