首页 文章

如何在QML中为ListView项设置备用颜色

提问于
浏览 次
12

是否可以为QML中的备用ListView项目分配2种颜色？我想将第1个列表项目涂成黑色，然后将第2个列表项目涂成蓝色，然后将第3个项目涂成黑色，然后将第4个项目涂成蓝色，依此类推......

如何在qml中实现这个功能？请分享你的想法 . 谢谢 .

qt qml

4 回答

  • 35

    您可以使用委托的 index 属性来确定此委托元素是偶数还是奇数，并使用它来更改委托的颜色 .

    ListView {
  anchors.fill: parent
  model: 3

  delegate:
    Rectangle {
        width: 20
        height: 30
        color: index % 2 == 0 ? "blue" : "black"
    }
}
    回复于
  • 0

    我在我的代码中尝试了类似下面的内容 . 因为我需要在代码中的不同位置使用相同的样式 . 所以我刚刚创建了一个函数 .

    ListView {
      anchors.fill: parent
      model: 3

      delegate:
        Item{
           function altColor(i) {
              var colors = [ "#E4DDE8", "#00000000" ];
              return colors[i];
           }
           Rectangle {
              width: 20
              height: 30
              color: altColor(index % 2)
           }
      }
}
    回复于
  • 0

    我建议你使用“model.index” - 它完全相同，但让你的代码更容易理解 . 顺便说一句，因此

    var colors = [“＃E4DDE8”，“＃00000000”];

    每次调用“altColor”时，都会创建新数组 . 非常低效 . 将数组声明移动到列表视图：

    property var colors: ["#E4DDE8", "#00000000"]
    回复于
  • 1

    虽然问题已经回答，但您仍然可以为Listmodel定义一个保留颜色的属性

    ListModel {
    id: fruitModel

    ListElement {
        name: "Apple"
        cost: 2.45
        elementColor: "red"
    }
    ListElement {
        name: "Orange"
        cost: 2.45
        elementColor: "black"
    }
    ListElement {
        name: "Banana"
        cost: 2.45
        elementColor: "gray"
    }
}

    并在代表中显示：

    Rectangle{
    anchors.fillIn:parent
    color: elementColor
}
    回复于

相关问题