sencha-touch - Sencha touch グループヘッダーを削除してギャップを増やす

Question

Sencha touch グループ化リストのヘッダーを削除してギャップを増やすにはどうすればよいですか。

Answer 1

リストのカスタム クラスを定義し、そのクラスの css を css ファイルに追加します。もちろん、ストアを使用し、グループ化する必要のあるフィールド名を追加する場合は、グループ化された構成オプションを true に設定します。

意見：

Ext.define('app.view.Temp', {
        extend : 'Ext.List',
        xtype : 'temp',

        config : {
            title : 'Temp',
            cls : 'x-contacts',
            disableSelection: true,
            grouped : true,
            store : 'YourStore',
            ui : 'round',
            cls:'modifiedHeader',
            //custom css classname
            itemTpl : ['<span>{field_name}</span>'].join('')
        }
    });

---

店：

Ext.define('app.store.YourStore', {
        extend : 'Ext.data.Store',

        config : {
            model : 'app.model.Temp',
            autoLoad : true,
            storeId:'YourStore',
             groupField: 'field_name',

            proxy : {
                type : 'ajax',
                url : 'link/to/api'
            }
        }
    });

---

app.css

.modifiedHeader .x-list-header {
//your desired css here
display:none;//If you want to hide the header
}