ListView Footer内容边距设置无效及窗口双击后左侧按钮间距异常求助

解决左侧按钮双击窗口后出现大量空白的问题 #

• 不要在RowLayout内部控件混用anchors和y属性，改用Layout.topMargin控制顶部间距，避免布局计算混乱
• 给ListView设置contentHeight: childrenRect.height，让内容高度刚好适配所有按钮，防止窗口大小变化时按钮被分散拉开

解决底部footer按钮无法与左侧按钮列对齐的问题 #

• 移除footer的RowLayout固定宽度width:500，设置Layout.fillWidth: true让它填满页面宽度
• 给footer的RowLayout添加Layout.leftMargin: 20，和左侧ListView的左外边距保持一致

修改后的完整代码 #

import QtQuick 2
import QtQuick.Controls 2.15
import QtQuick.Controls.Material 2.15
import QtQuick.Layouts

ApplicationWindow {
    id: applicationWindow
    property string displayedButton: ""
    width: 800
    height: 380
    visible: true

    Page {
        anchors.fill: parent
        id:page

        RowLayout {
            id:rec
            anchors.fill: parent

            ListView {
                id: leftMenuBar
                Layout.preferredWidth: 90
                Layout.fillHeight: true
                Layout.topMargin: 30 // 替换原y:10和anchors.topMargin:20
                Layout.leftMargin: 20
                clip: true
                spacing: 10
                contentHeight: childrenRect.height // 让内容高度适配按钮总高度

                Repeater {
                    model: 3
                    delegate: Button{
                        implicitHeight: 90
                        implicitWidth: 90
                        text: "Button " + (index + 1)
                        onClicked: displayedButton = text

                        Layout.alignment: Qt.AlignHCenter
                    }
                }

                Layout.alignment: Qt.AlignLeft
            }

            Item {
                Layout.fillWidth: true
                Layout.fillHeight: true

                Rectangle {
                    anchors.fill: parent
                    anchors.margins: 12
                    border.width: 2
                    border.color: "lightgray"
                    radius: 35

                    Text {
                        anchors.centerIn: parent
                        text: "Selected Button: " + displayedButton
                        font.pixelSize: 20
                    }
                }
            }
        }

        footer: RowLayout {
            Layout.fillWidth: true // 填满页面宽度
            Layout.leftMargin: 20 // 和左侧按钮列对齐的左外边距

            Repeater {
                model: 8
                delegate: Button{
                    implicitHeight: 90
                    implicitWidth: 90
                    text: "Button " + (index + 1)
                    onClicked: displayedButton = text

                    Layout.alignment: Qt.AlignHCenter
                }
            }
        }
    }
}

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