mardi 21 avril 2015

How do I create a QtWidgets ListView equivalent in Qt Quick Controls?

This question is a little specific, but I've been unable to find someone with the same problem or a clean solution to the problem.

I'm creating a Qt Quick program, and I want to use a QListView as it appears in QtWidgets. This QtWidgets program has three such views, with checkable items (which is optional: not all QListViews have checkable items).

Because Qt Quick Components doesn't appear to have a QListView equivalent, I set out to make my own from existing components. And the result is ... meh. It looks like this and doesn't exactly behave in the same fashion. Clicking on the text/whitespace of an item checks the item, instead of highlighting it. And the border is just ugly, and doesn't appear in GTK-themed environments. It also doesn't obey custom desktop themes, because the background of the items will always be white.

The code for this custom component is fairly brief, and looks like this:

import QtQuick 2.4
import QtQuick.Controls 1.3

// GroupBox creates a border... most of the time. Not in GTK envs
GroupBox {
    id: root
    property var model: null

    // This wraps the ListView up with a scrollbar
    ScrollView {
        anchors.fill: parent

        ListView {  // This is the view component
            anchors.fill: parent

            model: root.model

            // This is the white box that the CheckBox is drawn on
            delegate: Rectangle {
                width: parent.width
                height: box.height

                // This is the actual item
                CheckBox {
                    id: box
                    anchors.fill: parent
                    text: thing  // `thing` is just a placeholder value from the model
                }
            }
        }
    }
}

Aucun commentaire:

Enregistrer un commentaire