determining remaining space in a View?

mzimmers

Hi all -

This is a stub of my main.qml:

ApplicationWindow {
    visible: true
    width: Qt.platform.os === "android" ? Screen.width : 800
    height: Qt.platform.os === "android" ? Screen.desktopAvailableHeight : 480
    Column {
        spacing: 0
        MainTabBar { id: navBar }
        ServiceMode { id: serviceModePane }
        RadialFilledRect { id: iqBar }
        StatusBar { id: statusBar }
        Maincontent { id: mainContent } // StackLayout that points to Pane below.
    }
}

And the file opened by the StackLayout in Maincontent:

Pane {
    id: equipmentScreenPane
    Layout.fillHeight: true
    Layout.fillWidth: true
    padding: 0
    ColumnLayout {
        anchors.fill: parent
        ListView { id: spaceRow}
        GridView {
            Layout.preferredHeight: mainWindow.height
                                    - navBar.height
                                    - serviceModePane.height
                                    - iqBar.height
                                    - statusBar.height
                                    - spaceRow.height

Is there an easier way to derive the remaining height? I tried Layout.fillHeight: true, but that didn't work right, and I tried using equipmentScreenPane.availableHeight as a starting point, but that led to a Polish loop.

Is there a more automatic way of doing this?

Thanks...

sierdzio

@mzimmers perhaps Layout.fillHeight would work better if you also used layouts in main.qml?

Also, make sure you provide preferredHeight for your ListView, because only then GridView will know how much space it has left and how much it can expand to.

mzimmers

@sierdzio I agree that a ColumnLayout is preferable to a mere Column.

This problem is a bit trickier than I originally indicated. One of my items has conditional height:

ServiceMode {
    id: serviceModePane
    visible: systemModel.systemMode === SystemNS.SERVICE_MODE
    Layout.preferredHeight: visible ? 56 : 0
}

And I have a drawer whose height is based on the height of serviceModePane:

Drawer {
    id: drawer
    height: mainWindow.height - navBar.height - serviceModePane.height

The calculation seems to use the visible height (56) even when the pane isn't visible. Any idea why this is happening?

EDIT:

A workaround for this is:

Drawer {
    height: serviceModePane.visible ? mainWindow.height - navBar.height - serviceModePane.height
                                    : mainWindow.height - navBar.height

And I don't mind doing this; I just don't understand why this is necessary.

Thanks...