Extjs4 自定义组件

    Ext.onReady (function () {
 
     
    Ext.define ('MydesktopIcon', {
            /* Begin Definitions */
            alias: 'widget.desktopIcon',
            extend: 'Ext.Component',
             
             76,
            //height: 84,
            overCls: 'x-view-over',
            renderTpl:
                '<div class="ux-desktop-shortcut" id="{module}-shortcut">' +
                '<div class="ux-desktop-shortcut-icon">' + 
                    '<img src="{iconName}" title="{name}">' +'sssssssssss'+'{name}'+
                '</div>' +
                '<span class="ux-desktop-shortcut-text">{name}</span>' +
                '</div>' +
                '<div class="x-clear"></div>',
             
            // private
            onRender: function(ct, position) {
                // classNames for the button
                var me = this;
                 // Render internal structure
                me.callParent(arguments);
                //添加单击事件
                alert('dddddd');
                alert(me.name);
                me.mon(me.el, 'click', me.onClick, me);
            },
            getTemplateArgs: function () {
                var me = this;
                return {
                   name: me.name || ' ',
                   module: me.module || ' ',
                   iconName: me.iconName || Ext.BLANK_IMAGE_URL,
                }
            },
            onClick: function(e) {
                    var me = this;
                    me.ownerCt.fireEvent ('itemClick', this);
                },
 
            // inherit docs
                initComponent: function() {
                    alert('dd');
                    var me = this;
                    Ext.applyIf(me.renderData, me.getTemplateArgs());
                   // me.callParent(arguments);
                 
            },
        });
 
 
    Ext.create ('Ext.panel.Panel', {
            title:'test',
            frame: true,
            height:800,
            renderTo: Ext.getBody(),
            items: [{
                        xtype: 'desktopIcon',
                        name:'首页',
                        module:'firstPage',
                        iconName: '../SDOJ/images/problems.png'
                    },{
                        xtype: 'desktopIcon',
                        name:'个人信息',
                        module:'firstPage',
                        iconName: '../SDOJ/images/myself.png'
                },{
                        xtype: 'desktopIcon',
                        name:'首页',
                        module:'firstPage',
                        iconName: '../SDOJ/images/firstpage.png'
                    },{
                        xtype: 'desktopIcon',
                        name:'首页',
                        module:'firstPage',
                        iconName: '../SDOJ/images/contest.png'
                },
                {
                        xtype: 'desktopIcon',
                        name:'首页',
                        module:'firstPage',
                        iconName: '../SDOJ/images/college.png'
                    },{
                        xtype: 'desktopIcon',
                        name:'首页',
                        module:'firstPage',
                        iconName: '../SDOJ/images/letter.png'
                }],
            listeners: {
                itemClick: function (item) {
                    alert (item.name)
                }
            }
                 
        });
 
 
});