Qt 快速控件 ScrollView答案

【问题标题】：Qt quick controls ScrollViewQt 快速控件 ScrollView
【发布时间】：2014-02-14 22:36:46
【问题描述】：

我没有找到任何好的资源如何使用这个组件，它仍然无法布局我的应用程序（检查正确的属性检查器）。我做错了什么？

没有 ScrollView

带有滚动视图

请向下滚动该代码，滚动视图是最后定义的

import QtQuick 2.1
import QtQuick.Controls 1.0
import QtQuick.Layouts 1.1

ApplicationWindow {
    title: qsTr("Hello World")
    width: 1400
    height: 800
    color: "#414141"

    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }

    ColumnLayout {

        anchors.fill: parent

        Rectangle {
            color: "#414141"
            Layout.fillWidth: true
            Layout.preferredHeight: 50
            MyLabel {
                text: "Toolbar"
            }
        }

        SplitView {

            Layout.fillHeight: true
            Layout.fillWidth: true
            orientation: Qt.Horizontal
            handleDelegate: MyVSlider {}

            SplitView {

                Layout.fillHeight: true
                Layout.fillWidth: true
                orientation: Qt.Vertical
                handleDelegate: MyHSlider {}

                SplitView {
                    handleDelegate: MyVSlider {}
                    Layout.fillHeight: true
                    Layout.fillWidth: true
                    orientation: Qt.Horizontal

                    Rectangle {
                        color: "#565656"
                        Layout.fillHeight: true
                        Layout.preferredWidth: 200
                        Layout.minimumWidth: 200
                        MyLabel {
                            text: "Tree view"
                        }
                    }

                    Rectangle {
                        color: "#565656"
                        Layout.fillHeight: true
                        Layout.fillWidth: true
                        Layout.minimumWidth: 500
                        Layout.preferredHeight: 300
                        MyLabel {
                            text: "Scene view"
                        }
                    }
                }

                Rectangle {
                    color: "#565656"
                    Layout.fillWidth: true
                    Layout.preferredHeight: 200
                    Layout.minimumHeight: 200
                    MyLabel {
                        text: "Console output"
                    }
                }
            }

            Rectangle {
                id: inspector
                color: "#565656"
                Layout.fillHeight: true
                Layout.preferredWidth: 200
                Layout.minimumWidth: 200
                MyLabel {
                    text: "Properties inspector"
                }
            }


            ScrollView {
                contentItem: inspector
            }

        }
    }

}

【问题讨论】：

标签： qt qml qtquick2

【解决方案1】：

您是否想让您的inspector 元素可滚动？您需要将要滚动的元素放在 ScrollView 中。

即

ScrollView {
    Rectangle {
            id: inspector
            color: "#565656"
            Layout.fillHeight: true
            Layout.preferredWidth: 200
            Layout.minimumWidth: 200
            MyLabel {
                text: "Properties inspector"
            }

            // Make the thing really big.
            width: 1000
            height: 1000
    }
}

如果您像上面那样设置width 和height，这将导致您的inspector 显示滚动条。

【讨论】：