使用模板顯示列表項目

Question

我正在使用sencha touch 2.2.1。我想以這樣的方式顯示列表項目，即項目的標題顯示在左側，其值顯示在右側。爲此，我正在使用itemTpl，其中使用'table'標記。但是列的寬度根據列的內容而改變，而與給列的寬度無關。

請在下面找到我的代碼：

{ 
      xtype: 'list', 
      flex: 1, 
      ui: 'round', 
      data:[ 
       { title:'Descriptions', text: 'Change MP3 System'}, 
       { title:'Priority', text: 'Very High'}, 
       { title: 'Change Coord', text: 'Eudes Canuto'}, 
       { title: 'Target Data', text: '20.08.2013'}, 
       { title: 'LOB', text: 'Electronice'}, 
       { title: 'Major Change', text: 'Yes'}, 
       { title:'Risk', text: 'High'} 
      ], 
      itemTpl: new Ext.XTemplate(
        '<table style="border:1px solid black; border-spacing: 10px;">', 
         '<tpl for=".">', 
          '<tr>', 
           '<td style="border:1px solid black;padding: 30px;">{title}</td>', 
           '<td style="border:1px solid black;padding: 30px;">{text}</td>', 
          '</tr>', 
         '</tpl>', 
        '</table>'      
      ) 
     } 

是否有任何其他的方式來指定列的寬度，這樣的內容將與間距相等，不論其內容也會隨之調整，列裏面？

Answer 1

在模板中使用表不是一個好主意。用div格式化你的項目要容易得多。表格用於表格數據（即像電子表格），而不是佈局。