extjs4 色彩控件自己开发的ColorPicker

/**
 * @class Ext.app.ColorPicker
 * @extends Ext.container.Container
 * 定义颜色选取类
 */
 
Ext.define ('Ext.app.ColorPicker',
{
	extend: 'Ext.container.Container',
    alias: 'widget.smmcolorpicker',
    layout: 'hbox',
	initComponent:function() 
	{
		var mefieldLabel = this.fieldLabel;
		var mename = this.name;
		var meheight = this.height;
		var meid = this.id;
		this.items = 
		[
			{
				xtype: 'textfield',
				height: meheight,
				id:meid+'x',
				fieldLabel:mefieldLabel,
				name: mename,
				flex: 1,
				listeners:
				{
					change:function(me, newValue, oldValue)
					{
						me.bodyEl.down('input').setStyle('background-image', 'none');
						me.bodyEl.down('input').setStyle('background-color', newValue);
					}
				}
			},
			{
				xtype:'button',
				width:18,
				height: meheight,
				menu:
				{
					xtype:'colormenu',
					listeners: 
					{
						select: function(picker, color) 	
						{
							var amclr = Ext.getCmp(meid+'x');
							amclr.setValue('#'+color);
						}
					}
				}
			}
		];
		
		Ext.app.ColorPicker.superclass.initComponent.call(this);
	}
});