Hide QML ListView sections dynamically when items filtered

Question

I have a ListView (parent) that uses a ListView (children) as delegate, so each parent is a listView of some items.

To use a typical example, parent list could be a list of sizes (L, M and S), and each child list would be a list of animals of a given size (L animals, M animals, S animals).

Both lists use a custom model that inherits from QAbstractListModel. But the model of children lists used in the view is a custom model that inherits from QSortFilterProxyModel, to have filtering functionalities.

The items of parent list work as "sizes" for children's, so they are used as sections. View is displayed as:

LARGE: - large_animal_1 - large_animal_2

MEDIUM: - medium_animal_1 - ...

What I need is that, in case a given section has no items after filtering, section must NOT be shown. With the current view, when there are no "animals" after filtering, section header appears:

LARGE:

MEDIUM: - medium_animal_1 - ...

QML code is:

ListView {
        id: headers
        anchors.fill: parent
        clip: true
        boundsBehavior: Flickable.StopAtBounds

        model: _headersModel

        delegate: 
            Item {
                width: parent.width
                height: some_value

                ListView {
                    id: items_of_same_category
                    anchors.fill: parent
                    spacing: 5
                    clip: true
                    interactive: false

                    model: proxy_model

                    delegate: component_delegate
                }
            }

        section.property: "category_value"
                    section.criteria: ViewSection.FullString
                    section.delegate: header_delegate
                    section.labelPositioning: ViewSection.InlineLabels | ViewSection.CurrentLabelAtStart            
    }

have you considered using a visible = false and height: 0 when the model.count < 1 or proxy_model.length < 1 ? — Ldweller

Skonitsa Skonitsa · Accepted Answer · 2020-04-11T10:59:16

Why don't you connect the two models in cpp via signals and whenever you have no items for the second delegate, filter out from the first model the item that is responsible for the delegate in the second model. Meaning, if there are no Large_animal_*s, filter out the Large value from your first model.

In other words, try to solve your problem from the cpp side and let QML show the model as it is supposed to do.

Hide QML ListView sections dynamically when items filtered

1 Answers