Icon in TableView

beecksche

Hello,
i'm trying to set an icon depending on its value as a delegate in a table view.
I can draw the icon but, i have no clue how to change it depending on its value.

        TableView {
            id: tableView
            anchor.fill: parent

            TableViewColumn {
                role: "type"
                title: "Typ"
                width: 100

                delegate: Image {
                    fillMode: Image.PreserveAspectFit
                    source:  "qrc:/images/exclamation.png"
                    }
            }
        }

The doc says:

In the delegate you have access to the following special properties: styleData.value - the value or text for this item

But how can i combine it with the icon?

Thanks!

Julien B

Hello @beecksche,

What is the test you want to do on styleData.value to change your icon?

beecksche

@Julien-B

In that role an enum / int is stored. So i would set the source of the image depending on the value:

switch (styleData.value){
case Type.Info: image.source = "qrc:/images/info.png"; break;
case Type.Warning: image.source = "qrc:/images/warning.png"; break;
case Type.Error: image.source = "qrc:/images/error.png"; break;
}

Julien B

@beecksche

I think you can create a function (for example defined in tableView)

function provideIcon(int enumValue) {
    switch (enumValue) {
        case Type.Info: return "qrc:/images/info.png";
        case Type.Warning: return "qrc:/images/warning.png";
        case Type.Error: return "qrc:/images/error.png";
    }
}

and use it in your delegate:

 delegate: Image {
    fillMode: Image.PreserveAspectFit
    source: tableView.provideIcon(styleData.value)
}

beecksche

@Julien-B
It's that simple. Thanks a lot. Works perfectly!