Question

我想要一个垂直显示两个列表的面板。以下代码：

Ext.define('CD.abc.Profile', {
extend: 'Ext.Panel',
layout: 'fit',
fullscreen: true,
config: {
   layout:     'vbox',
    items:      [
        {
            xtype: 'mylist1'
        },
        {
            xtype: 'mylist2'
        }
    ]
}

}）;

但是项目没有显示，页面显示为空白。我可以在dom结构中找到元素，但它们在视图中保持不可见。任何人都可以帮我解决这个问题吗？

Answer 1

试试这个。它为我工作。

        Ext.define('CD.abc.Profile', {
        extend: 'Ext.Panel',
        config: {
           layout:'vbox',
            items:      [
                {
                    xtype: 'mylist1', // x-type of your list1 view
                    flex:1
                },
                {
                    xtype: 'mylist2', // x-type of your list2 view
                    flex:1
                }
            ]
        }
        });

Answer 2

将flex属性传递为1

flex：1

Answer 3

为我尝试这项工作：

Ext.define('Sencha.view.Blog', {
extend: 'Ext.Panel',
xtype:'blogpage',

config:{
    layout:'fit',
    width:'100%',
    height:'100%',
    title: 'Blog',
    iconCls: 'star',
    style:'background-color: red;',

    items:[
            { 
                xtype:'list',
                id:'thelist',
                style:'background-color: blue;',
                height:'100%', width:'20%',left:0,
                        store: {
            fields: ['name', 'number'],
            sorters: 'name',
            data: [
                {name: 'Shawshank Redemption', number: 5},
                {name: 'SuperBad', number: 3},
                {name: 'God Father', number: 5},
                {name: 'Forest Gump', number: 4.5},
                {name: 'A Beautiful Mind', number: 5},
            ]
        },

        itemTpl: '{name}'
            },
            { 
                xtype:'list',
                id:'thelist1',
                style:'background-color: blue;',
                height:'100%', width:'20%',right:0,
                        store: {
            fields: ['name', 'number'],
            sorters: 'name',
            data: [
                {name: 'Shawshank Redemption', number: 5},
                {name: 'SuperBad', number: 3},
                {name: 'God Father', number: 5},
                {name: 'Forest Gump', number: 4.5},
                {name: 'A Beautiful Mind', number: 5},
            ]
            },
            itemTpl: '{name}'
            }
        ]
}});

Sencha Touch 2垂直添加两个列表？

3 个答案: