Sencha Touch 2 添加图标到嵌套列表答案

【问题标题】：Sencha Touch 2 add icons to nestedlistSencha Touch 2 添加图标到嵌套列表
【发布时间】：2012-06-13 21:02:40
【问题描述】：

我正在尝试使用 NestedList 的 getItemTextTpl 方法将图像添加到嵌套列表。你能看看下面的代码，让我知道如何修复它吗？这是使用 Sencha Architect 开发的。感谢您的帮助。

Ext.define('myapp.view.ListContainer', {
    extend: 'Ext.Container',
    alias: 'widget.listcontainer',

    config: {
        layout: {
            type: 'fit'
        },
        tpl: [
            ''
        ],
        items: [
            {
                xtype: 'nestedlist',
                id: 'myList',
                itemId: 'mynestedlist4',
                detailCard: {
                    xtype: 'mytabs'
                },
                store: 'myStore',
                toolbar: {
                    xtype: 'titlebar',
                    docked: 'bottom',
                    ui: 'dark'
                }
            }
        ],
        listeners: [
            {
                fn: 'getItemTextTpl',
                event: 'getItemTextTpl',
                delegate: '#myList'
            }
        ]
    },

    getItemTextTpl: function(node) {
        return '<img class="eventIcon" src="http://localhost/images/test.png">';

    }

});

【问题讨论】：

'请看下面的代码，让我知道如何修复它？'... 什么要修复，什么不起作用？
@TDeBailleul 你说得对，我的问题很弱，应该包含适当的细节。原来我必须将我的 NestedList 提升为顶级组件，然后向它添加一个基本函数以实现 getItemTextTpl

标签： sencha-touch-2 sencha-architect

【解决方案1】：

Ext.define('myapp.view.myList', {
    extend: 'Ext.dataview.NestedList',
    alias: 'widget.mynestedlist',

    config: {
        id: 'myList',
        detailCard: {
            xtype: 'mytabs'
        },
        displayField: 'text',
        store: 'myStore'
    },

    getItemTextTpl: function(recordnode) {
        return '<img class="eventIcon" src="http://localhost/images/test.png">'; 
    }

});

【讨论】：

你能解释一下你是如何在“煎茶建筑师”中做到这一点的吗？
好的，我自己找到了答案。为此，您必须将嵌套列表提升为类（右键单击嵌套列表并选择Promote To class）。然后您将可以访问自定义函数（对象检查器中的 Functions 部分）。

【解决方案2】：

只是一个快速提示。 FontAwesome 是一种为您的应用程序轻松添加漂亮图标的好方法。

【讨论】：