我有一个示例应用程序,我使用itemtpl将商店数据绑定到列表,当我动态绑定时,我对如何更改前两个列表项的颜色和大小几乎没有什么困惑要从商店列出的数据。
这是我的示例代码:
Ext.define('Sample.view.SearchResultView', {
extend: 'Ext.Panel',
requires: [
'Ext.List',
'Ext.form.FieldSet',
'Ext.field.Text',
'Ext.Toolbar',
'Ext.TitleBar'
],
alias: "widget.searchresultpage",
config: {
scrollable: true,
items: [
{
xtype: 'list',
layout:'fit',
height:500,
title: 'Search Results',
store: 'MySearchStore',
itemTpl: '<table><td><tr height=10%>{BlockNo}</tr><tr height=90%><p>{ShortDescription}</p></tr></td></table>'
)
}
]
},
});
答案 0 :(得分:6)
您需要在列表中添加cls
属性,例如:
cls:'myList'
然后在CSS文件中添加:
.myList .x-list-item:nth-child(1),
.myList .x-list-item:nth-child(2) {
color: #CCC;
font-size:14px;
}
希望这有帮助
答案 1 :(得分:5)
您可以在itemTpl
本身设置字体和颜色。
itemTpl: '<table><td><tr height=10%><font size="12" color="#990000">{BlockNo}</font></tr>
<tr height=90%><p><font size="8" color="#990000">{ShortDescription}</font></p></tr></td>
</table>'