2013-04-11 83 views
1

我基本上在制作2个水平面板来分割ipad屏幕。在sencha触摸面板中显示列表

我想显示左侧面板中的列表和右侧面板中的详细视图,但任何我没有得到列表。

下面

是我使用的视图:

Ext.define("Sencha.view.Main", { 
extend: 'Ext.Container',  
config: { 

layout: 'hbox', 

    items: [ 
    { 
     xtype: 'panel', 
     width: 300, 
     items: [ 

       { 
        xtype: "list", 
        id:'contactlist', 
        store:'Items', 
       } 
       ], 
    }, 
    { 
     xtype: 'panel', 
     html: 'Message Detail view goes here ....' 

    } 
] 
} 

});

下面是我使用的店:

Ext.define('Sencha.store.Items', { 
extend: 'Ext.data.Store', 

config: { 
    model: 'Sencha.model.Item', 
    defaultRootProperty: 'items', 
    root: { 
     items: [ 
      { 
       text: 'Drinks', 

      }, 
      { 
       text: 'Snacks', 

      } 
     ] 
    } 
} 

});

+0

您可能需要指定'height',因为这不是'fit'布局,容器也没有指定任何高度。 – ThinkFloyd 2013-04-12 08:40:04

回答

1

我想你可能会丢失在列表中的柔性配置选项,在煎茶文档和itemTpl

{ 
     xtype: "list", 
     id:'contactlist', 
     flex: 1, 
     itemTpl: {text}, 
     store:'Items', 
} 

文档指出: “此项目的弯曲,如果这个项目项目是一个分机内.layout.HBox或Ext.layout.VBox布局。“

也没有为商店设置storeId。 storeId:'Items',