使用模板显示列表项

问题描述 投票:0回答:1

我正在使用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>'                      
            )
        }

有没有其他方法来指定列的宽度,以便内容将在列内部以相等的间距调整,而不管其内容如何?

css css3 html-table sencha-touch sencha-touch-2
1个回答
1
投票

在模板中使用表格不是一个好主意。使用div格式化项目要容易得多。表格用于表格数据(即电子表格),而不是布局。

© www.soinside.com 2019 - 2024. All rights reserved.