§ 5. Создание приложений

5.5. Создание приложения «Графический редактор»

Программа должна давать возможность открыть и сохранить файл, выбрать цвет линии и цвет фона, установить толщину линии. Рисование производится выбранным цветом линии при нажатой левой клавише мыши. При нажатии правой клавиши мыши происходит перекраска цветом фона ограниченной области.

Сначала спроектируем форму, разместив на ней следующие компоненты (пример 5.20):

  • область для рисования — Image1;
  • палитру основных 16 цветов — ColorGrid1 (панель компонентов Samples);
  • компоненты, отображающие выбранный цвет для рисования и цвет фона — Panel1, Panel2;
  • компонент выбора цвета — ColorDialog1;
  • компонент для выбора толщины линии — SpinEdit1 (панель компонентов Samples);
  • главное меню — MainMenu1 и компоненты для работы с файлами — OpenPictureDialog1, SavePictureDialog1.

У свойства GridOrdening для компонента ColorGrid1 установить значение go8x2, которое позволит разместить компонент горизонтально.

На этапе конструирования установить значение свойства Color у компонентов Panel1 и Panel2 — clBlack и clWhite соответственно.

У свойств Value и MinValue для компонента SpinEdit1 установить значение 1.

Структура меню показана в примере 5.21. Обработчики событий приведены в примере 5.22.

Для того, чтобы программа загружалась с видимой областью для рисования нужно при создании формы выполнить какое-либо обращение к Image1, например, закрасить белым цветом пиксел с координатами (0; 0).

Для проверки нажатой клавиши мыши опишем обработчик события OnMouseDown для компонента Image1. Параметр Button у этого обработчика может принимать значения mbLeft или mbRight в зависимости от нажатой левой или правой клавиши мыши.

Для отслеживания траектории движения мыши по компоненту Image1 создаем обработчик события OnMouseMove. Параметр Shift у обработчика позволяет определить, какая из клавиш мыши была нажата, а параметры x, y возвращают координаты точки, в которой произошло нажатие кнопки.

Для перемещения мыши нужно использовать методы Canvas: LineTo(x, y) — перемещение со следом и MoveTo(x, y) — перемещение без следа.

Обработчик события OnChange для компонента ColorGrid1 позволит определить выбранный цвет. Свойства ForegroundColor и BackgroundColor у этого компонента, отвечающие за основной и фоновый цвета, изменяются при нажатии левой и правой кнопок соответственно. Параллельно изменяется цвет панелей.

Толщина линии определяется значением свойства Value для компонента SpinEdit1. Обработчик события — OnChange.

Обработчики событий для компонентов OpenPictureDialog1, SavePictureDialog1, вызываются из соответствующих пунктов меню и аналогичны обработчикам, описанным для программы Блокнот. Для сохранения и загрузки файлов нужно описать глобальную строковую переменную FileName. Приложение может сохранять и загружать файлы формата bmp.

С помощью компонента ColorDialog1 можно выбрать цвет линии или заливки, отсутствующие на панели ColorGrid1. Пункты меню Цвет, позволяют выбрать цвет линии или заливки соответственно.

Создание рисунка и загрузка файла в приложение приведены в примере 5.23.

Пример 5.20. Форма на этапе конструирования:

Пример 5.21. Структура меню:

Пример 5.22. Обработчики событий:

procedure TForm1.FormCreate(Sender: TObject);

begin

  Image1.Canvas.Pixels[0,0] := clWhite;

end;

 

procedure TForm1.Image1MouseDown (Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer);

begin

  //нажата левая клавиша мыши

  if Button = mbLeft then

    Image1.Canvas.MoveTo(x,y);

  //нажата правая клавиша мыши

  if Button = mbRight then

    Image1.Canvas.FloodFill(x, y, Image1.Canvas.pixels[x,y],fsSurface);

end;

 

procedure TForm1.Image1MouseMove (Sender: TObject; Shift: TShiftState; X, Y: Integer);

begin

  //перемещение с нажатой левой

  //кнопкой мыши

  if ssLeft in Shift then

    Image1.Canvas.LineTo(x,y);

end;

 

procedure TForm1.ColorGrid1Change(Sender: TObject);

begin

  //выбор основного цвета

  //левой клавишей мыши

  Image1.Canvas.Pen.Color := ColorGrid1.ForegroundColor;

  Panel1.Color := ColorGrid1.ForegroundColor;

  //выбор фонового цвета

  //правой клавишей мыши

  Image1.Canvas.Brush.Color := ColorGrid1.BackgroundColor;

  Panel2.Color := ColorGrid1.BackgroundColor;

end;

 

procedure TForm1.SpinEdit1Change(Sender: TObject);

begin

  Image1.Canvas.Pen.Width := SpinEdit1.Value;
end;

procedure TForm1.N2Click(Sender: TObject);

begin

  Image1.Picture := Nil;

  Image1.Canvas.Pixels[0,0] := clWhite;

end;

 

procedure TForm1.N3Click(Sender: TObject);

begin

  if OpenPictureDialog1.Execute then

  begin

    FileName:=OpenPictureDialog1.FileName;

    Image1.Picture.LoadFromFile(FileName);

    Form1.Caption:='MyPaint '+FileName;

  end;

end;

 

procedure TForm1.N4Click(Sender: TObject);

begin

  if SavePictureDialog1.Execute then

  begin

    FileName:=SavePictureDialog1.FileName;

    Image1.Picture.SaveToFile(FileName);

    Form1.Caption:='myPaint '+FileName;

  end;

end;

 

procedure TForm1.N6Click(Sender: TObject);

begin

  Form1.Close;

end;

 

procedure TForm1.N8Click(Sender: TObject);

begin

  if ColorDialog1.Execute then

  begin

    Panel1.Color:=ColorDialog1.Color;

    Image1.Canvas.Pen.Color := ColorDialog1.Color;
  end;
end;

 

procedure TForm1.N9Click(Sender: TObject);

begin

  if ColorDialog1.Execute then

  begin

    Panel2.Color:=ColorDialog1.Color;

    Image1.Canvas.Brush.Color := ColorDialog1.Color;

  end;

end;

Пример 5.23. Работающее приложение: