Question

我对Sencha touch很新，发现很难创建一个水平列表。我可以成功地创建我的列表垂直传递一些内联数据，但似乎无法弄清楚水平呈现我的数据的方式。我试过通过论坛搜索仍然似乎无法解决。有人可以帮我解决这个简单但非常令人沮丧的问题。

到目前为止我的步骤：

1创建数据模型

    Ext.regModel('Alphabet', {
     fields: ['Letter']
     });

2 //创建数据存储

App.ListStore = new Ext.data.Store({
        model: 'Alphabet',
        data: [
            {Letter: 'A'},
            {Letter: 'b'},
            {Letter: 'c'},
            {Letter: 'd'},
            {Letter: 'e'},
            ]
    });

3创建列表

    App.ListPanel = new Ext.List ({
    store: App.ListStore,
    itemTpl: '<div class = "Alphabet">{Letter}</div>'
    });

4 //将列表绑定到面板

    App.ListContainer = new Ext.Panel({
    layout:{
        type: 'hbox',
        pack: 'center',
        align: 'center'
        },
    items: [App.ListPanel]
    });

5 //将面板停靠到根面板

先谢谢

Answer 1

将此添加到App.ListContainer

scroll: {direction: 'horizontal',useIndicators: false}

<强>更新：

尝试将其停靠到根面板

App.ListPanel = new Ext.Toolbar ({
      defaults:{ ui: 'plain'},
          items: [
                {text: 'ItemList_A'},
                {text: 'ItemList_b'},
                {text: 'ItemList_c'},
                {text: 'ItemList_d'},
                {text: 'ItemList_e'},
                {text: 'ItemList_A'},
                {text: 'ItemList_b'},
        ],
      dock: 'bottom',
      scroll: {
          direction: 'horizontal',
          useIndicators: false
      },
      layout: {
        pack: 'center'
      }
      });

Answer 2

我的问题的解决方案是使用hbox布局将项目添加到新面板。

我认为EXT.LIST的设计并不能解决我的问题。

在Sencha中创建基本水平列表

2 个答案: