html - Sencha touchの各行に複数の列があるリストを作成するにはどうすればよいですか？

Question

各行に複数の列があるリストが必要です。行は画像で構成することもできます。ストアから値を取得できます。しかし、それらを適切な方法で表示することはできません。以下のようなビューが必要です：

助けてください。前もって感謝します

Answer 1

以下は私がそれを行う方法です。以下に示すように、リストのビューを作成します。ビューをどのように作成しているかわからないため、まだ問題が発生する場合はコードを追加してください。

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>'
    )

Answer 2

div構造でやろうとすると、データに応じてdiv内のdivを意味します。