QML SplitView - manually resize childs

Question

I have a QtQuick Controls 1.3 SplitView(as I am on QT 5.11), which contains 3 rectangles in vertical orientation. It displays fine, and I can drag-resize the childs as intended.

Now I want to add a button which allows the user to completely hide the bottom most rectangle, effectively collapsing it. However, nothing I am trying to resize the rect works:

import QtQuick.Controls 1.3 as C1

[...]
    C1.SplitView  {
        id: splitView
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        width: parent.width - flightSelector.width - separator.width
        orientation: Qt.Vertical

        LateralChart {
            id: lateralChart
            width: parent.width
            height: mainPage.height * 0.75
            Layout.minimumHeight: 30
            Layout.maximumHeight: mainPage.height - 30 - 30
        }

        UtilityBar {
            id: utilityBar
            Layout.minimumHeight: 30
            Layout.maximumHeight: 30

            onCollapse: {
                console.log("minimize")
                flightList.height = 0                // no effect
                flightList.preferredHeight = 0       // no effect
                flightlist.Layout.maximumHeight = 0  // no effect
                flightList.shouldCollapse = true     // no effect
            }
        }

        FlightListTable {
            id: flightList
            width: parent.width
            Layout.minimumHeight: 0
            Layout.maximumHeight: mainPage.height - 60 - 30
            model: flightListFilterModel

            property bool shouldCollapse: false
            C1.SplitView.preferredHeight: shouldCollapse ? 0 : 300
        }
    }
[...]

If I just go flightList.visible = false, then the rect will be hidden, but the position of the middle rect remains, so it is positioned wrong (it should move to the bottom).

How can I resize SplitView child contents dynamically via JS code?

Answer 1

According to the docs, there must always be one (and only one) child object that has Layout.fillheight set to true. By default, it will choose the last visible child in the SplitView. In your case, it sounds like you want that to actually be the first child. So adding Layout.fillHeight: true to your LateralChart should give you the desired output.