Графические коллекции. Создание панелей инструментов

Приведем правила создания панелей инструментов проектов с использованием элементов ToolBar и imageList. Компонент imageList служит для создания коллекций рисунков – иконок, которые потом применяются для установки на другие компоненты. Установим на форме компоненты Toolbar1 и ImageList1. Для установки кнопок на компонент toolBar1 достаточно выделить его и вызвать контекстное меню.

Для добавления кнопок в контекстном меню выбираем пункт New Button, а для разделения группы кнопок – New Separator. Для добавленной кнопки рисунок автоматически выберется из компонента Imagelist1, если для панели инструментов через свойство images выбран Imagelist1.

На одной форме можно установить как несколько панелей инструментов, так и несколько коллекций графики imageList.

Приведем алгоритм создания панели (панелей) инструментов с графическими изображениями.

1. Установить на форме элемент ImageList и собрать в нем рисунки для кнопок(см. рис.62.)

Рис.62.

Кнопка E x port позволяет сохранить в виде графических файлов коллекции созданных коллекций изображений для кнопок, что позволяет многократное их использование в других проектах.

2. Устанавливаем на форме компонент Toolbar и связываем его с объектом imagelist1. После этого устанавливаем кнопки через контекстное меню (см. рис.63.).

Рис.63.

3. Программирование кнопок панели инструментов.

Теперь остановимся на таблицах для коллекций цветов. В закладке Samples имеется таблица ColorGrid. Мы с вами рассмотрели использование диалога ColorDialog для выбора палитры цветов. При выборе цвета в текстовом процессоре MsWord мы встречались с вами с таблицей цветов для установки цвета символов. Рассматриваемая нами таблица цветов аналогична таблице цветов офисных программ.

Приведем отличительные свойства этого компонента.

Таблица 2.19.

Свойства	Назначение	Свойства	Назначение
GridOrdering	go16x1 – таблица из 16 ячеек в одну строку	BackGroundEnabled	Доступ к цвету фона ячейки
go1x16 – таблица из 16 ячеек в один столбец	ForeGroundEnabled	Доступ к цвету переднего плана
go2x8 – таблица из 8 строк по 2 ячейки в одну строку
go4x4 – таблица из 4 строк по 4 ячейки в одну строку	ClickEnabledColor	Выбор цвета щелчком
go8x2 – таблица из 2 строк по 8 ячеек в одну строку

Рассмотрим пример. Установим на форме элемент Сolordialog1 и 16 элементов Shape. Установим значение свойства GridOrdering равным Go1x16.

Приведем код модуля.

unit Unit1;

interface

uses

Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs, ComCtrls, ToolWin, ImgList, ColorGrd, ExtCtrls, Grids, StdCtrls, Buttons;

type

TForm1 = class(TForm)

ColorGrid1: TColorGrid;

Shape1: TShape;

Shape2: TShape;

Shape3: TShape;

Shape4: TShape;

Shape5: TShape;

Shape6: TShape;

Shape7: TShape;

Shape8: TShape;

Shape9: TShape;

Shape10: TShape;

Shape11: TShape;

Shape12: TShape;

Shape13: TShape;

Shape14: TShape;

Shape15: TShape;

Shape16: TShape;

procedure ColorGrid1Change(Sender: TObject);

private

{Private declarations }

public

{Public declarations }

end;

var

Form1: TForm1;

i:byte;

implementation

{$R *.DFM}

procedure TForm1.ColorGrid1Change(Sender: TObject);

begin

i:=i+1;

case i of

1:shape1.Brush.Color:=colorgrid1.ForegroundColor;

2:shape2.Brush.Color:=colorgrid1.ForegroundColor;

3:shape3.Brush.Color:=colorgrid1.ForegroundColor;

4:shape4.Brush.Color:=colorgrid1.ForegroundColor;

5:shape5.Brush.Color:=colorgrid1.ForegroundColor;

6:shape6.Brush.Color:=colorgrid1.ForegroundColor;

7:shape7.Brush.Color:=colorgrid1.ForegroundColor;

8:shape8.Brush.Color:=colorgrid1.ForegroundColor;

9:shape9.Brush.Color:=colorgrid1.ForegroundColor;

10:shape10.Brush.Color:=colorgrid1.ForegroundColor;

11:shape11.Brush.Color:=colorgrid1.ForegroundColor;

12:shape12.Brush.Color:=colorgrid1.ForegroundColor;

13:shape13.Brush.Color:=colorgrid1.ForegroundColor;

14:shape14.Brush.Color:=colorgrid1.ForegroundColor;

15:shape15.Brush.Color:=colorgrid1.ForegroundColor;

16:shape16.Brush.Color:=colorgrid1.ForegroundColor;

end;

if i>16 then i:=0;

end;

end.

В результате мы имеем следующую картину (см. рис.64.).

Рис.64.

Теперь перечислим основные способы анимации графики:

– очистка и перерисовки графических объектов;

– поочередная визуализация объекта в разных кадрах(в разных страницах);

– использование видеопрограмм.

Наиболее часто используемым способом в невизуальных языках программирования является первый способ, Pascal позволял нам использовать видеостраницы в графическом режиме 0(grmode:=0).

Рассмотрим задачу движения окружности по контуру эллипса. Решим вначале эту задачу первым способом. Причем для наглядности не будем удалять нарисованные окружности. Установим на форму timer1.Определим величину интервала таймера в 100 миллисекунд.

Приведем код модуля.

unit Unit1;

interface

uses

Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,

StdCtrls, ExtCtrls;

type

TForm1 = class(TForm)

Timer1: TTimer;

procedure Timer1Timer(Sender: TObject);

private

{Private declarations }

public

{Public declarations }

end;

var

Form1: TForm1;

x,y,r:longint;

fi:real;

x1,y1,x2,y2,x3,y3:longint;

implementation

{$R *.DFM}

procedure TForm1.Timer1Timer(Sender: TObject);

begin

fi:=fi+0.1;

x:=form1.width div 2 +round(140*cos(fi));

y:=form1.height div 2 +round(70*sin(fi));

x1:=form1.width div 2 +round(100*cos(fi));

y1:=form1.height div 2 +round(120*sin(fi));

x2:=form1.width div 2 +round(100*cos(fi));

y2:=form1.height div 2 +round(50*sin(fi));

x3:=form1.width div 2 +round(10*cos(fi));

y3:=form1.height div 2 +round(50*sin(fi));

form1.Canvas.Brush.Style:=bssolid;

form1.Canvas.Brush.Color:=rgb(0,250,0);

form1.Canvas.Pen.Color:=rgb(250,0,0);

form1.Canvas.Ellipse(x-8,y-8,x+8,y+8);

form1.Canvas.Pen.Color:=rgb(50,0,0);

form1.Canvas.Brush.Color:=rgb(100,0,200);

form1.Canvas.Ellipse(x1-6,y1-6,x1+6,y1+6);

form1.Canvas.Brush.Color:=rgb(200,0,0);

form1.Canvas.Ellipse(x2-4,y2-4,x2+4,y2+4);

form1.Canvas.Brush.Color:=rgb(120,0,100);

form1.Canvas.Pen.Color:=rgb(150,0,0);

form1.Canvas.Ellipse(x3-4,y3-4,x3+4,y3+4);

end;

end.

В результате мы имеем 4 окружности, двигающиеся по 4 эллиптическим орбитам (см. рис.65.).

Очень часто возникает необходимость размещения фигур в конкретные области формы и их последовательный показ. Для этого используется кадры, сформированные с помощью компонент Image.

Рассмотрим пример имитации вращения окружности. Установим на форме 7 элементов Shape и элемент timer1.

Рис.65. Рис.66.

Приведем код модуля.

unit Unit1;

interface

uses

Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,

ExtCtrls;

type

TForm1 = class(TForm)

Shape1: TShape; Shape2: TShape;

Shape3: TShape;Shape4: TShape;

Shape5: TShape;Shape6: TShape;

Shape7: TShape;

Timer1: TTimer;

procedure Timer1Timer(Sender: TObject);

private

{Private declarations }

public

{Public declarations }

end;

var

Form1: TForm1;

i:byte;

implementation

{$R *.DFM}

procedure TForm1.Timer1Timer(Sender: TObject);

begin

i:=i+1;

if i>7 then i:=0;

case i of

1: begin

shape1.Visible:=true;shape2.visible:=false;

shape3.visible:=false;shape4.visible:=false;

shape5.visible:=false;shape6.visible:=false;

shape7.visible:=false;

end;

2: begin

shape1.Visible:=false;shape2.visible:=true;

shape3.visible:=false;shape4.visible:=false;

shape5.visible:=false;shape6.visible:=false;

shape7.visible:=false;

end;

3: begin

shape1.Visible:=false;shape2.visible:=false;

shape3.visible:=true; shape4.visible:=false;

shape5.visible:=false;shape6.visible:=false;

shape7.visible:=false;

end;

4: begin

shape1.Visible:=false;shape2.visible:=false;

shape3.visible:=false;shape4.visible:=true;

shape5.visible:=false;shape6.visible:=false;

shape7.visible:=false;

end;

5: begin

shape1.Visible:=false;shape2.visible:=false;

shape3.visible:=false;shape4.visible:=false;

shape5.visible:=true; shape6.visible:=false;

shape7.visible:=false;

end;

6: begin

shape1.Visible:=false;shape2.visible:=false;

shape3.visible:=false;shape4.visible:=false;

shape5.visible:=false;shape6.visible:=true;

shape7.visible:=false;

end;

7: begin

shape1.Visible:=false;shape2.visible:=false;

shape3.visible:=false;shape4.visible:=false;

shape5.visible:=false;shape6.visible:=false;

shape7.visible:=true;

end;end;

end;

end.

При запуске программы мы увидим движение окружности около точки.

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

Дата добавления: 2014-01-05