Qt quick controls ListView size issue

Question

I have some problem with popup window size behavior using Qt Quick Controls 2. When I'm putting ListView as contentItem for Popup window, Popup window size is zero. Some sample code that reproduce issue:

import QtQuick 2.4
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3

ApplicationWindow {
    id: window
    visible: true
    width: 800
    height: 600

    Button {
        text: "open popup"
        onClicked: popup.open()
    }

    Popup {
        id: popup
        x: (window.width - width) / 2
        y: window.height / 6
        width: contentWidth
        height: contentHeight

        contentItem: ListView {
            width: contentWidth
            height: contentHeight
            model: ListModel {
                ListElement {
                    name: "Apple"
                    cost: 2.45
                }
                ListElement {
                    name: "Orange"
                    cost: 3.25
                }
                ListElement {
                    name: "Banana"
                    cost: 1.95
                }
            }

            delegate: RowLayout {
                Label {
                    text: name
                }
                Label {
                    text: cost
                }
            }
        }
    }
}

How to make popup adopt to the size of ListView?

According to the documentation: "This property holds the content width. It is used for calculating the total implicit width of the Popup." — Kamil Zaripov
If you want your popup window will be with same size as contentItem just do nothing. According to the docs: If only a single item is used within a Popup, it will resize to fit the implicit size of its contained item — folibis
In your example that doesn't make sense. You set popup size to contentItem size (by setting width: contentWidth; height: contentHeight) and simultaneously set the size of contentItem to that. — folibis
I've tried to remove width: contentWidth height: contentHeight both for Popup and ListView still has zero size. contentWidth contentHeight parameters for Popup and ListView isn't the same. contentWidth contentHeight parameters for ListView is the size of delegates, for Popup it is size of ListView. — Kamil Zaripov

jpnurmi jpnurmi · Accepted Answer · 2016-12-28T17:18:21

A vertical ListView does not provide content width. It is always -1. You'll have to specify something, for example:

Popup {
    id: popup
    x: (window.width - width) / 2
    y: window.height / 6

    contentItem: ListView {
        implicitWidth: 200 // <==
        implicitHeight: contentHeight
        //...
    }
}

Qt quick controls ListView size issue

1 Answers