0

我正在使用 SenchaTouch 2 如何在每个列表行上设置不同的颜色。

SenchaTouch 小提琴示例：

http://www.senchafiddle.com/#MfLkR#wqVi1#eqWct

4

3 回答 3

2

您可以使用 css 为每一行添加特定颜色

.x-list-item:nth-child(1n){
/* First Row */
background-color: Green;

}
.x-list-item:nth-child(2n){
/* Second Row */
background-color: Blue;

}
.x-list-item:nth-child(3n){
/* third Row */
background-color: Yellow;

}

创建一个css文件，随意命名。将我的答案中的代码粘贴到该 css 文件中。在 index.html 中引用该 css 文件。或者您可以将样式标签放在 css 代码周围，并将其直接放在 index.html 的头部。

<link rel="stylesheet" type="text/css" href="touch2/resources/css/apple.css">
<link rel="stylesheet" type="text/css" href="newCssCode.css">
于 2012-04-04T21:13:26.397 回答
0

@bork

更改“x-list-item-label”的填充，使其使用 css 为 0

然后创建一个新的 div，它将成为模板中项目的一种新容器，更改此 div 的背景颜色。

于 2012-08-23T13:15:47.057 回答
0

您可以在数据中添加“bgcolor”字段并更改 itemTpl：

 items: [ {
   xtype: 'list',
   itemTpl: '<div style="height:35px; background: {bgcolor};">{title}</div>',
      data: [
         { title: 'Red BackGround', bgcolor : 'red' } // same thing for all the other items
于 2012-04-04T16:51:42.407 回答