Создание собственной кнопки в Delphi

Здравствуйте уважаемый программист! Ранее, при создании программного обеспечения на языке Delphi, Вы использовали лишь стандартный интерфейс MS Windows. Но, по всей видимости, Вам этого недостаточно и Вы хотите добавить оригинальности и уникальности в оформление своего приложения. Об том, как это сделать, я Вам и расскажу в данной статье. Статья будет посвящена созданию собственных элементов управления, а собственно кнопок, используя язык программирования Delphi.

   Приступим к делу. Допустим проект, для которого мы создаем кнопку, уже открыт. Для начала создадим новый модуль (File \ New \ Unit). Давайте сразу сохраним модуль (нажав Ctrl + Shift + S) под именем MyButtonUnit. В модуле мы видим два раздела: interface и implementation. В первом разделе мы будем описывать подключаемые модули, типы данных, процедуры, константы и переменные, а во втором будет находиться сам код.

   После interface опишем модули, которые нам понадобятся. Это выглядит так:

interface
   uses Classes, Controls, Windows, Graphics, Messages;

   После этого необходимо описать создаваемый нами новый класс (TMyButton), в основу которого будет положен класс TCustomControl.
 

type TMyButton = class(TCustomControl)
   private
   protected
   public
end;

   Вы видите три раздела нашего класса: private, protected и public. В первом описываются переменные и процедуры, которые будут доступны для использования только в пределах данного класса. В разделе protected описываются методы, реализованные в родительском классе. И наконец, третий раздел содержит описание свойств и процедур, которые будут доступны за пределами данного класса.

   Начнем с раздела public.
   Опишем конструктор: constructor Create(AOwner: TComponent);
   Перейдем в раздел implementation и напишем код, который будет выполняться при создании кнопки.

constructor TMyButton.Create(AOwner: TComponent);
begin
 inherited Create(AOwner);
 Parent := AOwner as TWinControl;
 Width := 100;
 Height := 25;
end;
 

   Я привел обязательную часть кода. Вы же можете дополнить его при необходимости.

   Сейчас самое время подумать о том, как будет работать кнопка. Наша кнопка должна изменять изображение при наведении на нее. Она обязательно должна содержать надпись. Это минимум! Раз кнопка будет изменять внешний вид при наведении на нее, то в разделе private опишем переменную FSelected : Boolean; для хранения состояния кнопки. Отрисовкой кнопки займемся позже. В том же разделе опишем переменную FCaption : String;, которая хранит надпись на кнопке. Для того, чтобы надпись можно было изменять опишем property Caption: String read FCaption write SetCaption; в разделе public. Как Вы заметили, процедуру SetCaption мы еще не создали. Опишем ее в разделе private:

procedure SetCaption(Val: String);
 

и конечно же создадим сам код:

procedure TMyButton.SetCaption(Val: string);
begin
 FCaption := Val;
 paint;
end;

   Процедура paint это и есть отрисовка кнопки, которой мы сейчас и займемся. Ее мы опишем в разделе protected - procedure Paint; override;.
   Сразу же напишем код:

procedure TMyButton.Paint;
begin
 If not FSelected
 then
  begin
   Canvas.Pen.Color := $FFFFFF;
   Canvas.Brush.Color := $FFFFFF;
  end
 else
  begin
   Canvas.Pen.Color := $EEEEEE;
   Canvas.Brush.Color := $EEEEEE;
  end;

 Canvas.Rectangle(0,0,Width,Height);
 Canvas.TextOut((Width - Canvas.TextWidth(FCaption))div 2,(Height - Canvas.TextHeight(FCaption)) div 2,FCaption);
end;

   Обратите внимание на условие. Мы предусматриваем различные варианты оформления при выделенной и невыделенной кнопке. Как работать с графикой Вы, я думаю, знаете, поэтому сможете очень легко настроить внешний вид по-своему.

   А теперь самое интересное: как сделать так, чтобы кнопка меняла внешний вид при наведении?

   Опишем две процедуры в разделе private:

procedure MEnter(var Mes: TMessage); message CM_MOUSEENTER;
procedure MLeave(var Mes: TMessage); message CM_MOUSELEAVE;

   Процедуры реагируют на сообщения ввода и вывода мыши в область кнопки. Первая - на сообщение ввода, а вторая - на сообщение вывода. А вот собственно и код, который они вызывают.

procedure TMyButton.MEnter(var Mes: TMessage);
begin
 FSelected := True;
 Paint;
end;

procedure TMyButton.MLeave(var Mes: TMessage);
begin
 FSelected := False;
 Paint;
end;

   Как видите, мы просто указываем, выделена или не выделена кнопка и перерисовываем ее.

   Прекрасно, мы выполнили задачу, но как внедрить кнопку в приложение? Очень просто! Вам необходимо описать созданный нами модуль в нужном вам месте, а чтобы создать кнопку опишите ее как переменную (var B : TMyButton;), создайте (B := TMyButton.Create(self);) и откорректируйте поля (B.Caption := 'Button';).
   В целом:
 

procedure TForm3.FormCreate(Sender: TObject);
var
 B : TMyButton;
begin
 B := TMyButton.Create(self);
 B.Caption := 'Button';
end;

   Теперь Вы умеете создавать свои элементы управления и можете поработать над дизайном своей программы. Удачи!
 

Исходный код модуля:

unit MyButtonUnit;

interface
  uses Classes, Controls, Windows, Graphics, Messages;

type TMyButton = class(TCustomControl)
  private
   FSelected: Boolean;
   FCaption: String;
   procedure SetCaption(Val: String);
   procedure MEnter(var Mes: TMessage); message CM_MOUSEENTER;
   procedure MLeave(var Mes: TMessage); message CM_MOUSELEAVE;
  protected
   procedure Paint; override;
  public
   constructor Create(AOwner: TComponent);
   property Caption: String read FCaption write SetCaption;
 end;

implementation

constructor TMyButton.Create(AOwner: TComponent);
begin
 inherited Create(AOwner);
 Parent := AOwner as TWinControl;
 Width := 100;
 Height := 25;
end;

procedure TMyButton.SetCaption(Val: string);
begin
 FCaption := Val;
 paint;
end;

procedure TMyButton.Paint;
begin
 If not FSelected
 then
  begin
   Canvas.Pen.Color := $FFFFFF;
   Canvas.Brush.Color := $FFFFFF;
  end
 else
  begin
   Canvas.Pen.Color := $EEEEEE;
   Canvas.Brush.Color := $EEEEEE;
  end;

 Canvas.Rectangle(0,0,Width,Height);
 Canvas.Font.Color := 0;
 Canvas.TextOut((Width - Canvas.TextWidth(FCaption))div 2,(Height - Canvas.TextHeight(FCaption)) div 2,FCaption);
end;

procedure TMyButton.MEnter(var Mes: TMessage);
begin
 FSelected := True;
 Paint;
end;

procedure TMyButton.MLeave(var Mes: TMessage);
begin
 FSelected := False;
 Paint;
end;

end.

Ссылки по теме

• Подробнее о продуктах Embarcadero