如何在sencha touch 2中更改列表中分组标题的背景颜色？

Question

我有一个包含 2 个组的列表。我想覆盖列表中给定组的标题的默认背景颜色。如何在sencha touch 2中更改List中分组标题的背景颜色？

Answer 1

您可以通过将自己的类添加到列表中并使用 chrome 开发者工具查找定义标题样式的类名来轻松做到这一点。

将 cls 添加到列表中

{
    xtype: 'list',
    itemTpl: '<div class="contact2"><strong>{firstName}</strong> {lastName}</div>',
    disclosure: true,
    grouped: true,           
    cls:'customHeader',
    store: store
}

添加如下css样式

.customHeader .x-list-header {
    background-color: red;
    background-image: none;
    border-color: red;
    color: beige;
}

要根据模型值更改标题颜色，Sencha Fiddle、JSFiddle 可能会给你一个想法。