定义颜色选取类

1. /**  
2.  * @class Ext.app.ColorPicker  
3.  * @extends Ext.container.Container  
4.  * 定义颜色选取类  
5.  */  
6.    
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.         ];  
54.           
55.         Ext.app.ColorPicker.superclass.initComponent.call(this);  
56.     }  
57. });