显示下面列出sencha touch的面板

时间:2011-11-25 03:57:17

标签: list sencha-touch panel

我想在列表下方放置一个面板,但似乎面板始终位于列表顶部。我不想在列表上设置一个高度,因为它可能没有记录或20,所以高度变化。

我只是希望我的面板显示在我的列表下方。另请注意,我已禁用滚动。

 Rad.views.testList = Ext.extend(Ext.List, {
        fullscreen: true,
        layout: 'hbox',
        scroll: false,
        align: 'top',

        store: Rad.stores.test,

        itemTpl: Rad.views.testTemplate(),


    });


   topPanel = new Ext.Panel({
        fullscreen: true,
        scroll: true,
        layout: {
           type: 'vbox',
           pack: "start",
           align: "start"
        },
        defaults: {
           width: '100%',
        },
        items: [
            {
                layout: 'hbox',
                items: [testList]

            },
            {
                html: 'This will be on the list not below!'
        ]


   }); 

    Ext.apply(this, {
        layout: {
            type: 'vbox',
            pack : 'top',
        }, 
        dockedItems: [titlebar],
        items : [ topPanel]
    });

1 个答案:

答案 0 :(得分:0)

我本来应该使用Panels with Data View。

var tpl = new Ext.XTemplate(
    '<tpl for=".">',
        '<div class="photosLocation">{pic}{name}',
        '</div>',
    '</tpl>'
);

var panel = new Ext.Panel({
    width:535,
    autoHeight:true,
    layout:'hbox',
    title:'Simple DataView',

    listeners: {
        click: {
            element: 'el', //bind to the underlying el property on the panel
            fn: function(){ alert('click'); }
        }
    },
    items: new Ext.DataView({
        store: Rad.stores.deals,
        tpl: tpl,
        autoHeight:true,
        itemSelector:'div.photosLocation',

    })
});