Qt快速控制ScrollView

时间:2014-02-14 22:36:46

标签: qt qml qtquick2

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

没有ScrollView

without ScrollView

使用ScrollView with 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
            }

        }
    }

}

1 个答案:

答案 0 :(得分:0)

您是否尝试让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
    }
}

如果您像上面一样设置inspectorwidth,这会导致您的height显示滚动条。