sencha touch:: 如何创建 hbox-items 列表

Question

我想从商店中生成数据列表。 每个数据项都有一个标题和一个 boolean。 现在我想要一个项目列表，每个项目都包含标题和标题右侧的切换字段（显示布尔值）。

我怎么能那样做？

谢谢！

Answer 1

从 Sencha Touch 文档中，List 是“一种使用列表布局模板显示数据的机制”，即 html 模板。 如果你想要一个组件的“列表”，你必须自己扩展 DataView （我认为）。

一种解决方法是在您的 itemTpl 中放置一个 html 复选框。 类似的东西（警告 - 未经测试）：

itemTpl: '<p>{title}: <input type="checkbox" name="BoolCheckbox" class="boolcheckbox"'
    + "{[(values.bool? 'checked="checked"' : '')]}"
    + '></input></p>'

要在 XTemplate 中运行您自己的代码，请将其括在 {[]} 中。 在此 scope 中，您可以访问包含记录数据的变量“值”。

要检测事件，您需要在列表中添加一个侦听器：

itemtap: function (dataView, index, item, e) {
    if (e.getTarget().getClass().toString() == "boolcheckbox") {
        // do something
    }
}

关于模板的一些资源：

http://dev.sencha.com/deploy/touch/docs/

http://www.sencha.com/learn/xtemplates-part-i/

http://www.sencha.com/learn/xtemplates-part-ii/