今天你写控件了吗？ASP.net控件开发系列(六)

UITypeEdit

“我要红桃”

 假如，你现在在做一个“扑克”控件，扑克牌有个属性－－花色，你想在用户选择花色这个属性后，属性窗口呈现的不仅仅是文字，还有一个小小的花色图标来表示花色，“红桃”就有个小“红桃”图标在前面显示，“黑桃”就有个“黑桃”图标在前面显示，就像你选择其它控件的BackColor时，颜色前还有个小方色块来表示选定的颜色，多体贴人的设计啊。
 现在，我们就来做这件事：

public class Squeezer
{
 .
 
 public CardTypes CardType
 {
  
 }
}
[Editor(typeof(CardTypesEditor), typeof(System.Drawing.Design.UITypeEditor))]
public class CardTypes
{
 ..
}

 public class CardTypesEditor : UITypeEditor
 {
  public override bool GetPaintValueSupported(ITypeDescriptorContext context) 
  {
   return true;//支持画小图
  }

  public override void PaintValue(PaintValueEventArgs pe) //定义根据值画小图的逻辑
  {
   string bmpName = null;
   CardTypes C = (CardTyes)pe.Value;
   switch(C.Value)
   {
    case CarderTypes.HongTao:
     bmpName = "红桃.bmp";//图片必须是嵌入的资源，大小为16*16，类型为BMP
     break;
    
   }

   Bitmap b = new Bitmap(typeof(GradeEditor), bmpName);

   pe.Graphics.DrawImage(b, pe.Bounds);

   b.Dispose();   
  }
 }

在上面的代码中，我们通过EditorAttribute来使花色类和一个Editor关联，再通过这个Editor来实现画示意小图的功能。

好了，现在你的创造力可能又在鼓动你思考一个新问题了，我不想让让用户仅仅通过一个简单的只呈现值的下拉列表（通过EnumConverter实现的）来选择属性的值，我想实现像BackColor、Dock这样的非常友善的交互给用户使用，好吧，我们来进入下一步。
首先我们要制做一个合适的小窗口(CardTypesEditorControl)来定制交互时的界面，这个窗体继承自System.Window.Forms.UserControl或System.Window.Forms.From，总之它就是一个WinFrom窗体，这个窗体怎么做，我这里就不展开论述了，只是你要在这个窗体类中聚合（不是组合，这里是引用，由Editor传过来）一个IWindowsFormsEditorService，已便更好的交互，并且，能控件何时关闭打开的这个下列式的窗口，比如说在鼠标按钮的Up事件中edSvc.CloseDropDown()，这样用户点击鼠标进行了选择之后就能关闭窗体，返回值。
好，我们来看我们的Editor怎么扩充：

  CardTypes target;
  CardTypesEditorControl ui;
  
  public CardTypesUIEditor(CardTypes target)
  {
   this.target = target;
  }
  //通过Editor能到用户操作的值的逻辑实现
  public override object EditValue(ITypeDescriptorContext context, IServiceProvider sp, object value) 
  {
   // 得到IDE的交互服务
   IWindowsFormsEditorService edSvc = (IWindowsFormsEditorService)sp.GetService(typeof(IWindowsFormsEditorService));

   if (edSvc == null) 
   {
    return value;
   }

   if (ui == null) 
   {
    ui = new CardTypesEditorControl();//建立属性操作窗体实例
   }
   
   ui.SelectedCardTypes = (CardTypes)value;//原始值，SelectedCardTypes属性只是一个例子，你可以用任意实现自己的逻辑。
   ui.EditorService = edSvc;//传服务过去，见代码上面的说明
   ui.Target = (CardTypes)context.Instance;//得到连接对象的实例
   edSvc.DropDownControl(ui);//把窗体显示为一个下接式窗体，可选的值还有edSvc.ShowDialog(ui)，
      //这样的话以一个弹出窗体的形式显示窗体，也许你更喜欢这种方式。
  
   return ui.SelectedCardTypes;//我们在窗体逻辑中更改SelectedCardTypes值，在操作窗体关闭时得到这个值。
  }
  //窗口出现样式，可选值还有Modal，在属性后出出现一个省略号，点击弹出模式窗体或有窗口的对话框，就像CollectionEditor，
  //None，不出现任何操UI，老老实实填值
  public override System.Drawing.Design.UITypeEditorEditStyle GetEditStyle(ITypeDescriptorContext context) 
  {
   return System.Drawing.Design.UITypeEditorEditStyle.DropDown;
  }

呵呵，是不是现在有得花样给你玩了？
在EditValue方法中用一句return UrlBuilder.BuildUrl( (IComponent) context.Instance, null, (string) value, Caption, Filter,Options)你就可以做出一个URL编辑器;用ColorEditor.ColorUI colorUI = new ColorEditor.ColorUI(this);colorUI.Start(edSvc, value);edSvc.DropDownControl(colorUI);这样的几句话就能实现一个颜色选择交互界面。（注意代码没有处理null等异常情况）