adding a color value to a ListElement

mzimmers

Hi all -

I have and use a model as follows:

ListModel {
  id: bottleModel_19
  ListElement {
  // position 1
  bottleColor: 0xff0000
  }
  
  ListElement {
  // position 2
  ...

Repeater {
  id: bottleRepeater
  model: bottleModel_19
  Bottle {
    cellColor: bottleColor
    ...

But the desired colors aren't displaying (I just get black, which is overriding the default value in the Bottle object).

For brevity, I've edited out several other items in the model, all of which work, so I know the model is being read. Is there something about colors that need special handling? I've tried defining the values as ints and as strings...no luck.

Thanks...

oria66

@mzimmers Hi. The only way I can get it to work is with strings. For example:

The model:

ListModel{
      id: elementModel
      ListElement{ theText:qsTr("Geofence"); theColor: "#FA6800"; active: true}
      ListElement{ theText:qsTr("Fields"); theColor: "aqua"; active: true}
      ListElement{ theText:qsTr("Grids"); theColor: "gray"; active: true}
      ListElement{ theText:qsTr("Machines");  theColor: "orange"; active: true}
      ListElement{ theText:qsTr("Interest points");  theColor: "magenta"; active: true}
      ListElement{ theText:qsTr("Sprinkles"); theColor: "white"; active: true}
      ListElement{ theText:qsTr("People"); theColor: "red"; active: true}
      ListElement{ theText:qsTr("Design"); theColor: "gray"; active: false}
      ListElement{ theText:qsTr("Pattern"); theColor: "gray"; active: false}
}

The delegate extract:

ItemDelegate{
...
    RowLayout{
        spacing: 10
        anchors.fill: parent
        Label{ id: labelButton; text: "\uE09D"; color: model.theColor; font.family: "fontello"}
        Label{ id: label; Layout.fillWidth: true; text: model.theText ;font.pointSize: 10}
    }
...
}

Result:

mzimmers

Right you are (I'm not sure what I did to make it work, but it's working now). Thanks!

So, for extra credit...here's what I'd like to do:

  property string colorForWash: "#373a36"
  property string colorForAGTP: "#be3a34"
  property string colorForA: "#ffc658"
  property string colorForP: "#26d07c"
  property string colorForS: "#005eb8"

  ListModel {
    id: bottleModel_19
    property int rackWidth: 515
    ListElement {
      // position 1
      x: 407
      y: 18
      height: 78
      width: 78
      bottleLabel: "ETH"
      bottleColor: colorForWash
    }

This crashes...something to do with my use of "colorForWash." Can you see anything wrong with my syntax? The editor's not giving me any warning.

EDIT:

Oh, I think I see the problem...as someone reminded me recently, ListElements don't have properties, only roles. Hmm...not sure how to work around this one...

oria66

@mzimmers Right, ListElements are a collection of roles. If you want to set "dynamically" those roles, you should play with the javascript functions of ListModel, and implement some kind of mechanism (depends on your use case) to update it.