带有列表的煎茶水平滚动答案

【问题标题】：sencha horizontal scroll with a list带有列表的煎茶水平滚动
【发布时间】：2014-11-15 20:44:37
【问题描述】：

我正在尝试遵循 Sencha 给出的列表水平示例。我收到一条消息说（DataView 的基本布局必须始终是 Fit 布局）在示例中，它不是一个合适的布局。有人可以告诉我我在这里缺少什么。谢谢吉姆

  Ext.define( 'Styles.view.Beginning', { 
    extend: 'Ext.List',
    xtype: 'beginninglist',

    config: {
     title:'Beginning',
     iconCls: 'star',


 layout:{
     type:'vbox',
     pack: 'center'
 },
   items:[

    {

      //give it an xtype of list for the list component
                xtype: 'dataview',
                height: 250,


                scrollable: 'horizontal',
                directionLock: true,
                inline: {
                    wrap: false
                },


                //set the itemtpl to show the fields for the store
                itemTpl: '{name} {image}',


                //bind the store to this list
                 store: 'Beginning'

    }

     ]

   }
  });

【问题讨论】：

你为什么要用Ext.List扩展视图。由于您使用的是 dataview，您应该扩展 Ext.dataview.DataView，您会看到错误不会出现。

标签： list sencha-touch sencha-touch-2 sencha-touch-2.3

【解决方案1】：

首先，你需要学习煎茶布局。你可以参考here。您正在创建一个List，然后尝试将Dataview 放入其中。所以如果你需要Dataview，直接扩展Dataview如下：

Ext.define('Styles.view.Beginning', {
        extend: 'Ext.dataview.DataView',
        xtype: 'beginninglist',
        config: {
            inline: {
                wrap: false
            },
            scrollable: {
                direction: 'horizontal'
            },

            //set the itemtpl to show the fields for the store
            itemTpl: '{name} {image}',

            //bind the store to this list
            store: 'Beginning'
        }
    });

【讨论】：