[QML List View] Implicit width

mistralegna

Hi,

I would like to know if it is possible to create a ListView component with a width that will be automatically computed from its children width.

For instance:

    SplitView {
        id: splitView
        x: 0
        y: 0
        anchors.fill: parent

        ListView {
            id: listView
            // width: implicitWidth ?
            // implicitWidth: childrenRect.width?
            height: parent.height

            model: ListModel {
                ListElement {
                    name: "Grey"
                    colorCode: "grey"
                }

                ListElement {
                    name: "Red"
                    colorCode: "red"
                }

                ListElement {
                    name: "Blue"
                    colorCode: "blue"
                }

                ListElement {
                    name: "Green"
                    colorCode: "green"
                }
            }
            delegate: Item {
                x: 5
                // Which width here ?
                // width: implicitWidth
                height: 40 // This may not always be 40
                Row {
                    id: row1
                    Rectangle {
                        width: 40 // This may not always be 40
                        height: 40 // Same as above
                        color: colorCode
                    }

                    Text {
                        text: name
                        font.bold: true
                        anchors.verticalCenter: parent.verticalCenter
                    }
                    spacing: 10
                }
            }
        }

        Rectangle {
            id: rect
            color: "blue"
            anchors.left: listView.right
            anchors.right: parent.right
        }
    }

Thank you in advance for your answers !

qnope

Using Listview.contentWidth is not enough?

mistralegna

Likle this:

        ListView {
            id: listView
            width: ListView.contentWidth
            height: ListView.contentHeight
            ...
      }