如何在Sencha touch的每一行中制作多列的列表？

我想要在每一行中有多列的列表。该行也可以组成图像。我能够从商店获得价值。但无法以适当的方式显示它们。我需要的视图象下面这样：如何在Sencha touch的每一行中制作多列的列表？

enter image description here

请帮助。在此先感谢

2012-07-09 Arindam Mukherjee

以下是我该怎么做。为列表创建一个视图，如下所示。不知道你是如何创建你的意见，所以添加额外的代码，如果你仍然有麻烦。

Ext.define('AppName.view.CustomList', { 
    extend: 'Ext.List', 
    xtype: 'customlist', 
    config: { 
    store: 'StoreName', 
    itemTpl: Ext.create('Ext.XTemplate', 
       '<div style="float:left; width: 50%">{Column1Name}</div>', 
       '<div style="float:left; width: 50%">{Column2Name}</div>', 
       '<div style="clear:both"></div>' 
     ) 
    } 
});

编辑：以下是将是您可以使用的布局的更新。它应该很接近，你可能需要清除：另一个地方，我相信这可能会更清洁，但我只是给你一些工作。

itemTpl: Ext.create('Ext.XTemplate', 
      '<div>', 
       '<div style="float:left; width: 30%">{firstName}</div>', 
       '<div style="float:left; width: 40%">{feedbackHeading}</div>', 
       '<div style="float:left; width: 30%">{date}</div>', 
      '</div>', 
      '<div>', 
       '<div style="float:left; width: 30%">{lastName}</div>', 
       '<div style="float:left; width: 40%">{feedbackSummary}</div>', 
       '<div style="float:left; width: 30%">{location}</div>', 
      '</div>', 
      '<div style="clear:both"></div>' 
    )

来源

2012-07-09 20:16:33

我试图用下面的代码：itemTpl：Ext.create（ 'Ext.XTemplate'， \t \t \t '

{firstName}

{lastName}

{heading}

' \t \t \t \t \t \t \t \t \t \t \t），但字段来了一个垂直接连一次 – 2012-07-10 10:37:25

当然会。 Divs占用父级的宽度。更何况，
是一个换行符，这也会导致更多的空间。你需要使用类似于我上面的东西来使其正常工作。尝试像下面这样的小东西 '

{firstName}

{lastName}

' 如果您使用div，我所拥有的style标签是必不可少的。尝试查找一些基本的HTML。最后Sencha只不过是html，css和javascript。 – 2012-07-10 14:26:12

查看上面的例子 - 我用更多的信息更新了它。 – 2012-07-10 14:48:51

尝试使用div结构意味着根据您的数据div内的div。

来源

2012-07-10 20:51:52 Ayesha

如何在Sencha touch的每一行中制作多列的列表？

回答

相关问题