web-dev-qa-db-ja.com

QML：スクロールバーをListViewにアタッチ

ListViewに問題があります。 ListViewが長すぎ、その一部がウィンドウの外に表示されますが、スクロールバーを接続できません。いろいろな組み合わせを試しました。問題は高さパラメータにあると思いますが、削除すると、ListViewは最初のエントリのみを表示します。

Column{
    anchors.fill: parent
    Row{
        id: buttonsRow
            Button{
                text: "Open dump file"
                onClicked: fileDialog.visible = true
            }
            Button{
                text: "Copy raw data to clipboard"
            }
    }
    ListView{
        id: listView
        anchors.top: buttonsRow.bottom
        height: contentHeight
        //clip: true
        flickableDirection: Flickable.VerticalFlick
        boundsBehavior: Flickable.StopAtBounds
        interactive: true
        model: ListModel{
            id: listModel
        }
        delegate: MDelegate{}
    }
}

スクロール可能にする方法はありますか？

qtlistviewqml
7
Marzanna

heightをcontentHeightに設定することがおそらく問題です。これにより、ListViewはアイテムのすべての高さを合わせた高さになります。スクロールバーは、ビューの高さがそのコンテンツの高さよりも低い場合にのみ機能します。

代わりにレイアウトを使用するアプローチは次のとおりです。

import QtQuick 2.8
import QtQuick.Controls 2.1
import QtQuick.Layouts 1.3

ApplicationWindow {
    width: 400
    height: 300
    visible: true

    ColumnLayout {
        anchors.fill: parent

        RowLayout {
            id: buttonsRow
            Button {
                text: "Open dump file"
            }
            Button {
                text: "Copy raw data to clipboard"
            }
        }

        ListView {
            id: listView
            flickableDirection: Flickable.VerticalFlick
            boundsBehavior: Flickable.StopAtBounds
            model: 100
            clip: true
            delegate: ItemDelegate {
                text: modelData
            }

            Layout.fillWidth: true
            Layout.fillHeight: true

            ScrollBar.vertical: ScrollBar {}
        }
    }
}
6
Mitch

あなたが投稿したコードのどこにスクロールバーを付けたのか、私にはわかりません。次のように、実際にScrollBarコンポーネントをListViewに含める必要があります。

    ListView { 
        id: listView
        ScrollBar.vertical: ScrollBar {
        active: true
        }
    }

https://doc.qt.io/qt-5/qml-qtquick-controls2-scrollbar.html にある「Flickableへのスクロールバーのアタッチ」を参照してください

6
WaltPurvis