[Solved]ListView: Changing Background color of a row from the model

hpollak

Hallo!

I am new in QML programming (i am using QML2) and I now I am playing with the ListView.

I like to change the background of a row in my list by giving the model an additional Property.

Here is my code ( at the moment ):

@Rectangle {
id: messageList

width: 900
height: 360

ListModel {
    id: myModel
    ListElement {
        msgId: 1
        timeStamp: "14-Sep-2012 12:01:12"
        basicText: "Test"
        type:      "Alarm"

        // the background color of the Line in the List
        bgColor:     "red"
    }

    ListElement {
        msgId: 2
        timeStamp: "14-Sep-2012 12:10:12"
        basicText: "Test123213213"
        type:      "Warning"
        bgColor:     "red"
    }
    ListElement {
        msgId: 3
        timeStamp: "14-Sep-2012 12:10:12"
        basicText: "Test"
        type:      "Technical"
        bgColor:     "blue"
    }
}

Component {
    id: msgRow

    Item {
        id: topLayout
        width: messageList.width
        height: 20
        
        // generate the background
        Rectangle {
            id: background
            x: 2; y: 2; width: parent.width - x*2; height: parent.height - y*2
            border.color: "orange"
            radius: 5
            color: "lightgrey"
        }

        Row {
            property real offset: 2

            x: topLayout.x+5

            anchors.verticalCenter: parent.verticalCenter

            Text { text: msgId; width: (messageList.width/100*10)}
            Text { text: timeStamp; width: (messageList.width/100*20)}
            Text { text: basicText; width: (messageList.width/100*70)}
        }
    }

}

ListView {
    model: myModel
    delegate: msgRow

}

}
@

Has anybody a hint for me how to do this?

best regards
Harry

jys0224

how about binding bgColor to background's color property ?

hpollak

Yes, now this works now.
I have tried this before, but before i didn't used bgColor as name of the property i used color, then it's not working - it's clear!
Thank you!

jys0224

yes,, as you stated, when name is 'color' rather than 'bgColor',,,

@
color: color
@

will make binding loop, in this case, to avoid this situation,
you can write down 'model.color', without changing list model.

@
color: model.color
@