日期:2014-05-16  浏览次数:20340 次

ExtJs4.0颜色控件

收藏代码

  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. });??

??