SenchaTouch 2如何在每个列表行上设置不同的颜色

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

SenchaTouch小提琴例如：

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

2012-04-04 os ip

你可以的 “的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-04 16:51:42

第一：颜色不影响所有项目区，第二：煎茶颜色风格想不只是一个正常的颜色 [http://www.senchafiddle.com/#MfLkR#wqVi1#eqWct#7esLr](http:// www.senchafiddle.com/#MfLkR#wqVi1#eqWct#7esLr） – 2012-04-05 11:35:51

你可以特定的颜色添加到每个一行css like

.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-04 21:13:26 fuzzyLikeSheep

不工作请访问 [http://www.senchafiddle.com/#MfLkR#wqVi1#eqWct#iXuvG](http://www.senchafiddle。 com /＃MfLkR＃wqVi1＃eqWct＃iXuvG） – 2012-04-05 12:00:51

感谢它在添加“resources/css/apple.css”之后工作，现在如何应用包含渐变的sencha色彩风格。 – 2012-04-07 08:47:55

更改背景颜色后滚动列表的滚动性能太低。 – 2012-04-07 10:38:12

@bork

变化的“X-列表项标签”，以便它是0附有CSS填充

然后创建一个新的div，这将是一种新的容器对于您的模板中的项目，更改此div的背景颜色。

来源

2012-08-23 13:15:47

SenchaTouch 2如何在每个列表行上设置不同的颜色

回答

相关问题