ExtJs4.0颜色控件

1. /**
2.  * @class Ext.app.ColorPicker
3.  * @extends Ext.container.Container
4.  * 定义颜色选取类
5.  */
7. Ext.define (‘Ext.app.ColorPicker’,
8. {
9.     extend: ’Ext.container.Container’,
10.     alias: ’widget.smmcolorpicker’,
11.     layout: ’hbox’,
12.     initComponent:function()
13.     {
14.         var mefieldLabel = this.fieldLabel;
15.         var mename = this.name;
16.         var meheight = this.height;
17.         var meid = this.id;
18.         this.items =
19.         [
20.             {
21.                 xtype: 'textfield',
22.                 height: meheight,
23.                 id:meid+'x',
24.                 fieldLabel:mefieldLabel,
25.                 name: mename,
26.                 flex: 1,
27.                 listeners:
28.                 {
29.                     change:function(me, newValue, oldValue)
30.                     {
31.                         me.bodyEl.down('input').setStyle('background-image', 'none');
32.                         me.bodyEl.down('input').setStyle('background-color', newValue);
33.                     }
34.                 }
35.             },
36.             {
37.                 xtype:'button',
38.                 width:18,
39.                 height: meheight,
40.                 menu:
41.                 {
42.                     xtype:'colormenu',
43.                     listeners:
44.                     {
45.                         select: function(picker, color)
46.                         {
47.                             var amclr = Ext.getCmp(meid+'x');
48.                             amclr.setValue('#'+color);
49.                         }
50.                     }
51.                 }
52.             }
53.         ];
55.         Ext.app.ColorPicker.superclass.initComponent.call(this);
56.     }
57. });