通过实例看VCL组件开发全过程（四）

四、组件属性编辑器和组件编辑器：

通过上面的努力我们的组件似乎已经比较完美了，可我们也忽略了一些重要的细节和一些有趣的事情，这一篇我们将研究两个很有用的组件特性：

在之前开发组件核心功能时我们曾设置了两个属性BeginTime和WakeTime， 他们都是字符串型的属性，然而他们所要表示的却是时间类型，这样就很有可能使组件使用者错误的编辑属性并导致转化字符串到时间时出错（当然这里只是为了文 章的讲解，我们故意把它设置为了字符串类型），虽然通过浏览原代码你知道我们也做了一些代码级别的防出错处理，使当输入错误时属性自动变成‘00:00:00’，然而这对组件使用者来讲仍然显的很不友好，所以我们需要为这两个属性定制编辑器，我们的编辑器将弹出一个窗口里面有一个TdateTimePicker用来选择时间。在delphi中有许多这样的例子，例如大家都知道的lines属性，当你单击它右放的省略号时为自动弹出一个文本编辑器来编辑lines，这大大降低了组件使用者范错误的可能性。

在定制完属性编辑器以后，我们将为组件本身加入一写有趣的元素——组件编辑器，这也是在delphi中 经常出现的，例如有些组件当你双击它时，它并不会进入代码编写状态，而是弹出它自己的编辑器。虽然我们的组件似乎并不需要这种特性，但为了演示它，我们也 将它考虑近来，我们给我们的组件编写了一个版权信息和一个关于对话框，当组件使用者双击它时弹出关于信息（当然，这仅仅是种演示）。上面提到的两种特性由 于它们只是会在设计时起作用，所以你完全可以在新的组件包中编写并注册它们，并将这个组件包设置为Designtime Only，为了方便起见我们就直接把它们和组件的单元编写在一起。注意：以下出现的一些类和方法都需要引用单元DesignEditors（delphi7）或DsgnIntf（delphi5），与前面说的一样，它们都属于delphi的open tools api所以，如果你没有这写单元请按照前文的方法安装它们。

首先来编写属性编辑器，由于BeginTime和WakeTime是字符串类型，所以我们必须从默认的字符串属性编辑器类TstringProperty继承并覆盖它的一写方法（这里只介绍几个重要的方法，事实上所有的属性编辑器都从TpropertyEditor继承而来，然而我们不用直接继承这个基类）。其中一个重要的方法是GetAttributes，他将返回一些代表编辑器功能的值，这些值将会在代码的注释中说明（如果你的属性编辑器还需要一个下拉列表，你还需要另外一个重要的方法GetValues具体请查看delphi帮助）另外为了使属性编辑器为弹出的对话框我们需要覆盖Edit方法。为了可以以可视化的方式设计对话框，我们可以建立一个普通工程，在设计好后将窗体的类声明复制到我们的组件单元，并将窗体的dfm文件拷贝到我们的组件包目录，并在代码中加入编译器开关{$R *.dfm}。以下是窗体的类声明，这个窗体没有任何的代码需要编写：

TTimeEditFrm = class(TForm)

DateTimePicker1: TDateTimePicker;

Button1: TButton;

Button2: TButton;

private

{ Private declarations }

public

{ Public declarations }

end;

以下是属性编辑器的代码：

TClockProperty=class(TStringProperty)

public

function GetAttributes:TPropertyAttributes;override;

procedure Edit;override;

end;

实现部分：

procedure TClockProperty.Edit;

var

TimeEditFrm:TTimeEditFrm;

begin

TimeEditFrm:=TTimeEditFrm.Create(Application);

try

TimeEditFrm.DateTimePicker1.Time:=StrToTime(GetValue);

if TimeEditFrm.ShowModal=mrOK then

SetValue(TimeToStr(TimeEditFrm.DateTimePicker1.Time));

//GetValue和SetValue是TStringProperty的基类方法，他直接读取和设置字符串的值

finally

TimeEditFrm.Free;

end;

end;

function TClockProperty.GetAttributes: TPropertyAttributes;

begin

result:=[paDialog,paMultiselect];

//paDialog表示属性编辑器将显示一个对话框，paMulitiselect允许多个组件选择属性

//除此之外如果你想让属性编辑器显示下拉列表，你还需要paValueList具体请查看帮助

end;

最后我们用RegisterPropertyEditor方法注册属性编辑器:

procedure Register;

begin

……

RegisterPropertyEditor(TypeInfo(string),TClock,'BeginTime',TClockProperty);

RegisterPropertyEditor(TypeInfo(string),TClock,'WakeTime',TClockProperty);

end;

重新编译更新组件后我们就可以测试了，可以看到组件编辑器工作的很好：

<shapetype coordsize="21600,21600" o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f" id="_x0000_t75"><stroke joinstyle="miter"></stroke><formulas><f eqn="if lineDrawn pixelLineWidth 0"></f><f eqn="sum @0 1 0"></f><f eqn="sum 0 0 @1"></f><f eqn="prod @2 1 2"></f><f eqn="prod @3 21600 pixelWidth"></f><f eqn="prod @3 21600 pixelHeight"></f><f eqn="sum @0 0 1"></f><f eqn="prod @6 1 2"></f><f eqn="prod @7 21600 pixelWidth"></f><f eqn="sum @8 21600 0"></f><f eqn="prod @7 21600 pixelHeight"></f><f eqn="sum @10 21600 0"></f></formulas><path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"></path><lock v:ext="edit" aspectratio="t"></lock></shapetype><shape type="#_x0000_t75" style="width: 324pt; height: 96pt;" id="_x0000_i1025"><img o:title="PE" src="http://www.evget.com/zh-CN/article/articlePic/Dev_Image_2003-8-51748050%5B1%5D.jpg" alt=""></shape>

接下来我们来实现组件编辑器：

组件编辑器需要继承TcomponentEditor并覆盖一些重要的方法,GetVerbCount返回设计时组件右键自定义菜单的数目，GetVerb为每一个自定义菜单添加文字，ExecuteVerb为每一个菜单项添加事件，Edit为组件的缺省操作指定事件（即在设计时双击组件），以下是代码：

TClockEditor=class(TComponentEditor)

public

function GetVerbCount:integer;override;

function GetVerb(index:integer):string;override;

procedure ExecuteVerb(index:integer);override;

procedure Edit;override;

end;

实现部分：

procedure TClockEditor.Edit;

begin

ExecuteVerb(1); //默认显示关于

end;

procedure TClockEditor.ExecuteVerb(index: integer);

begin

case index of

//第一个显示名字的菜单什么都不做显示

1:showmessage('hk.barton@2003');

end;

end;

function TClockEditor.GetVerb(index: integer): string;

begin

case index of

0:result:='hk.barton';

1:result:='About Clock';

end;

end;

function TClockEditor.GetVerbCount: integer;

begin

result:=2;//我们显示两条菜单，一个我的名字，一个关于

end;

同样最后我们注册组件编辑器：

procedure Register;

begin

……

RegisterComponentEditor(TClock,TClockEditor);

end;

同样可以看到组件编辑器的测试情况：

<shape type="#_x0000_t75" style="width: 146.25pt; height: 223.5pt;" id="_x0000_i1026"><img o:title="CE1" src="http://www.evget.com/zh-CN/article/articlePic/Dev_Image_2003-8-51748052%5B1%5D.jpg" alt=""></shape> <shape type="#_x0000_t75" style="width: 101.25pt; height: 99.75pt;" id="_x0000_i1027"><img o:title="CE2" src="http://www.evget.com/zh-CN/article/articlePic/Dev_Image_2003-8-51748054%5B1%5D.jpg" alt=""></shape>

文章写到这里也该结束了，虽然写了那么多，然而在组件开发中这仍是一小部分内容，本文只是抛砖引玉的作用，希望对正要进入组件开发的朋友一些启示。为了方便你阅读本文，如果你想要本文所开发的这个组件的全部原文件，请和我联系：

E-mail:[e-mail] [e-mail] QQ：6813489

（全文完）

参考文献：

Marco Cantu 《Mastering Delphi》