sencha touch ::列表未向右滚动

如何解决sencha touch ::列表未向右滚动

| 以下代码似乎不完整，或者我做错了什么？ 问题是列表无法向右滚动。

Ext.ns(\'simfla.ux.plugins.demo\');

Ext.regModel(\'Contact\',{
    fields: [\'firstName\',\'lastName\']
});

simfla.ux.plugins.demo.store = new Ext.data.Store({
    model: \'Contact\',sorters: \'firstName\',data: [
        {firstName: \'Tommy\',lastName: \'Maintz\'},{firstName: \'Ed\',lastName: \'Spencer\'},{firstName: \'Jamie\',lastName: \'Avins\'},{firstName: \'Aaron\',lastName: \'Conran\'},{firstName: \'Dave\',lastName: \'Kaneda\'},{firstName: \'Michael\',lastName: \'Mullany\'},{firstName: \'Abraham\',lastName: \'Elias\'},{firstName: \'Tommy\',{firstName: \'Jay\',lastName: \'Robinson\'}
    ]
})

Ext.setup({
    tabletStartupScreen: \'tablet_startup.png\',phonestartupScreen: \'phone_startup.png\',icon: \'icon.png\',glossOnIcon: false,onReady : function() {
        var app =  new Ext.Panel({
            fullscreen: true,layout: \'fit\',dockedItems:[{
                xtype: \'toolbar\',title: \'EditableList Plugin\',}],items: [
            {
                xtype: \'panel\',title:\'topPanel\',items:{
                    xtype:\'button\',cls: \'editChildBtn\',text: \'Einstellungen\',width: 150,handler: function(){}
                }
            },{
                xtype: \'list\',style: \'background-color: Transparent;\',id: \'MyList\',allowdeselect: true,clearSelectionOnDeactivate: true,//layout: \'fit\',store: simfla.ux.plugins.demo.store,itemTpl: \'{firstName} <strong>{lastName}</strong>\',grouped: false,indexBar: false,singleSelect: true,}]
            });

    }
});

感谢thanx！ 编辑：不向右滚动表示放开手柄时，它会翻转回到初始位置...     

解决方法

我认为问题在于，父容器将无法确定列表应具有的高度，因为有两个子容器，因此“ fit”实际上没有含义。如果您将父项的布局从“适合”更改为vbox，请为“'topPanel \'”设置一个固定的高度，并将列表的flex设置为1，这两个子项应填满屏幕。

var app =  new Ext.Panel({
        fullscreen: true,layout: {
           type: \'vbox\',align: \'stretch\'
        },dockedItems:[{
            xtype: \'toolbar\',title: \'EditableList Plugin\',}],items: [
        {
            xtype: \'panel\',title:\'topPanel\',height: 50,items:{
                xtype:\'button\',cls: \'editChildBtn\',text: \'Einstellungen\',width: 150,handler: function(){}
            }
        },{
            xtype: \'list\',flex: 1,style: \'background-color: Transparent;\',id: \'MyList\',allowDeselect: true,clearSelectionOnDeactivate: true,//layout: \'fit\',store: simfla.ux.plugins.demo.store,itemTpl: \'{firstName} <strong>{lastName}</strong>\',grouped: false,indexBar: false,singleSelect: true,}]
        });

    ,给包围两个面板的面板设置“ 2”样式。 就我而言，“ 100px”是最好的。

    Ext.setup({
    tabletStartupScreen: \'tablet_startup.png\',phoneStartupScreen: \'phone_startup.png\',icon: \'icon.png\',glossOnIcon: false,onReady : function() {
        var app =  new Ext.Panel({
            fullscreen: true,layout: \'fit\',style: \'padding-bottom:100px;\',dockedItems:[{
                xtype: \'toolbar\',items: [
            {
                xtype: \'panel\',items:{
                    xtype:\'button\',handler: function(){}
                }
            },{
                xtype: \'list\',}]
            });

    }
});