BFon : TBitmap; // битмап для хранения фона

ЦВЕТ

 

В предыдущем примере для задания красного цвета пиксела мы использовали константу clRed. В модуле Graphics имеются следующие константы цветов:

clBlack = TColor($000000);

clMaroon = TColor($000080);

clGreen = TColor($008000);

clOlive = TColor($008080);

clNavy = TColor($800000);

clPurple = TColor($800080);

clTeal = TColor($808000);

clGray = TColor($808080);

clSilver = TColor($C0C0C0);

clRed = TColor($0000FF);

clLime = TColor($00FF00);

clYellow = TColor($00FFFF);

clBlue = TColor($FF0000);

clFuchsia = TColor($FF00FF);

clAqua = TColor($FFFF00);

clLtGray = TColor($C0C0C0);

clDkGray = TColor($808080);

clWhite = TColor($FFFFFF);

clNone = TColor($1FFFFFFF);

clDefault = TColor($20000000);

 

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

Тип TColor состоит из четырех байт (рисунок 2).

Рисунок 2 – Описание указания цветов типа TColor

 

Цвет мы задаем в соответствии с цветовой моделью RGB (указываются первые буквы цветов Red, Green и Blue). Данная цветовая модель определяет цвет по яркости трех цветовых каналов:

- Red (красный): яркость красного цвета от 0 до 255 (от 00 до FF);

- Green (зеленый): яркость зеленого цвета от 0 до 255 (от 00 до FF);

- Blue (синий): яркость синего цвета от 0 до 255 (от 00 до FF).

 

 

Также одним из способов указания цвета является использование функции:

function RGB(r, g, b: Byte): COLORREF;

 

Данная функция имеет три параметра для задания красного, зеленого и синего цветов. Рассмотрим пример задания пикселу по координатам (x,y)=(24,35) желтого цвета. Для получения желтого цвета нам необходимо будет смешать красный цвет и зеленый:

Form1.Canvas.Brush.Color:= RGB(255,255,0);

 

Следует отметить, что помимо цветовой модели RGB существует другие цветовые модели, такие как:

- CMY (Cyan,Magetta,Yellow) – голубой, пурпурный и желтый цвета;

- CMYK (Cyan,Magetta,Yellow, blacK) – голубой, пурпурный, желтый и черный цвета;

- HSB (Hue, Saturation, Brightness) – тон, насыщенность, яркость;

- Lab (модель, основанная на восприятии глазом человека);

- HSV (Hue, Saturation, Value) – тон, насыщенность, значение;

- HLS (Hue, Lightness, Saturation) – тон, яркость, насыщенность;

- HSI (Hue, Saturation, Intensity) – тон, насыщенность, интенсивность;

- и другие.

 

 

КЛАСС TFONT

 

Класс TFont предназначен для описания шрифтов Windows. Методы канвы (Canvas) модуля Graphics позволяют рисовать только горизонтально расположенные шрифты.

Пример использования класса TFont:

Form1.Canvas.Font.Name:= 'Times New Roman';

Form1.Canvas.Font.Size:= 12;

 

В данном примере мы задали для нашей канвы (Canvas) основной шрифт Times New Roman и указали размер шрифта, равный 12.

Разберем более подробно свойства данного класса (таблица 1).

Таблица 1 – Свойства класса TFont

Свойство	Описание	Пример использования
Name	Содержит наименование шрифта. Можно указывать любые названия шрифтов, которые установлены в системе	Form1.Canvas.Font.Name:=’Times New Roman’;
Style	Содержит стиль начертания символов шрифта: - жирный (fsBold); - курсив (fsItalic); - подчеркнутый (fsUnderline); - перечеркнутый (fsStrikeOut). Одновременно можно указывать несколько стилей для шрифта. В примере мы устанавливаем для шрифта курсивное и жирное начертание	Form1.Canvas.Font.Style:= [fsItalic,fsBold];
Color	Определяет цвет шрифта. В примере показан пример задания красного цвета шрифта двумя способами	Form1.Canvas.Font.Color:= clRed; Form1.Canvas.Font.Color:= RGB(255,0,0);
Charset	Определяет набор символов шрифта. Возможные значения: Описание Знач-е Назначение ANSI_CHARSET   Символы ANSI DEFAULT_CHARSET   Шрифт по умолчанию SYMBOL_CHARSET   Установленные стандартные символы MAC_CHARSET   Macintosh-символы. Не доступно на NT3.51 SHIFTJIS_CHARSET   Японские символы HANGEUL_CHARSET   Корейские символы (Wansung) JOHAB_CHARSET   Корейские символы (Johab). Не доступно на NT3.51 GB2312_CHARSET   Упрощенные китайские символы (материковый Китай) CHINESEBIG5_CHARSET   Традиционные китайские символы (Тайвань) GREEK_CHARSET   Греческие буквы. Не доступно на NT3.51 TURKISH_CHARSET   Турецкие символы. Не доступно на NT3.51 VIETNAMESE_CHARSET   Вьетнамские символы. Не доступно на NT3.51 HEBREW_CHARSET   Еврейские символы. Не доступно на NT3.51 ARABIC_CHARSET   Арабские символы. Не доступно на NT3.51 BALTIC_CHARSET   Балтийские символы. Не доступно на NT3.51 RUSSIAN_CHARSET   Символы кириллицы. Не доступно на NT3.51 THAI_CHARSET   Тайские символы. Не доступно на NT3.51 EASTEUROPE_CHARSET   Включает диакритические маркеры для восточно европейских стран. Не доступно на NT3.51 OEM_CHARSET   Зависит от кодовой страницы операционной системы   В примере справа мы установили набор символов шрифта на кириллицу двумя способами (указав константу и числовым значением). Для того, чтобы быть уверенным, что будет использоваться именно русская часть таблицы символов, рекомендуется установить ее: Form1.Canvas.Font.Charset:= RUSSIAN_CHARSET;	Form1.Canvas.Font.Charset:= RUSSIAN_CHARSET; Form1.Canvas.Font.Charset:= 204;
Pitch	Определяет ширину символов шрифта. Может иметь одно из трех значений: - fpFixed - соответствует моноширинным шрифтам; - fpVariable - соответствует шрифтам с переменной шириной символа; - fpDefault – принятие ширины символов, определенной начертанием. Равноширинных шрифтов совсем немного (MS Sans Serif и Courier). Но любой неравноширинный шрифт можно сделать равноширинным: Form1.Canvas.Font.Pitch:= fpFixed;	Form1.Canvas.Font.Pitch:= fpFixed;
Height	Определяет высоту шрифта в пикселах	Form1.Canvas.Font.Height:= 30;
PixelsPerInch	Определяет число точек на дюйм. Данное свойство желательно не изменять, так как оно используется системой для приведения изображения на экране и принтере к одному виду	Form1.Canvas.Font. PixelsPerInch:= 78;
Size	Содержит размер шрифта в пунктах. Это свойство связано со свойством Height следующим соотношением: Font.Size:= -Font.Height * 72 / Font. PixelsPerInch; Один пункт равен 1/72 дюйма.	Form1.Canvas.Font.Size:= 20;

 

ВЫВОД ТЕКСТА

 

Для вывода текста на канву используются два метода: TextOut и TextRect.

 

 

Метод TextOut

 

Рассмотрим пример вывода текста ‘ВЫВОД ТЕКСТА’ на канву по координатам (x,y)=(50,20) с помощью процедуры TextOut:

Form1.Canvas.TextOut(50,20,'ВЫВОД ТЕКСТА');

 

Данная процедура имеет три параметра: положение текста по координатам X, Y, а также третий параметр - сам текст.

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

{1} Form1.Canvas.Font.Color:= clGreen; // устанаваливаем цвет шрифта зеленым

{2} Form1.Canvas.Font.Style:= [fsBold,fsItalic]; // жирный и наклонный текст

{3} Form1.Canvas.TextOut(50,10,'Первая строка'); // выводим строку

{4} Form1.Canvas.Font.Color:= clRed; // устанаваливаем цвет шрифта красным

{5} Form1.Canvas.Font.Style:= [fsBold,fsStrikeOut];// жирный и зачеркнутый текст

{6} Form1.Canvas.TextOut(50,30,'Первая строка'); // выводим строку

 

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

Рисунок 3 – Вывод текста с помощью процедуры TextOut

 

Метод TextRect

 

Метод TextRect выводит текст с отсечением. Посмотрим на параметры процедуры:

procedure TextRect(Rect: TRect; X, Y: Integer; const Text: string);

 

Как и в TextOut, строка текста выводится с позиции (X,Y), при этом часть текста, лежащая вне пределов прямоугольника Rect, отсекается и не будет видна.

Приведем пример вывода текста, ограничивая его прямоугольником. В обработчике нажатия кнопки Button1 напишем следующий код:

procedure TForm1.Button1Click(Sender: TObject);

begin

{1} Form1.Canvas.Brush.Color:= clWhite;

{2} Form1.Canvas.TextRect(Rect(10,10,100,100),50,50,'Текстовая строка');

end;

 

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

Вторую строку разберем более подробно. Первым параметром является переменная типа TRect ограничивающего прямоугольника. Мы можем присвоить параметру заранее созданную переменную прямоугольника или создать эту переменную «налету» прямо при указании параметра (так было сделано в приведенном выше примере). В данном примере мы ограничивали текст прямоугольником с начальными координатами (x1,y1)=(10,10) и конечными координатами (x2,y2)=(100,100). Начальными координатами у прямоугольника являются координаты верхнего левого угла, а конечными – правого нижнего угла. Схематично расположение прямоугольника Rect(10,15,100,120) показано на рисунке 4.

 

Рисунок 4 – Схематичное представление прямоугольника Rect(10,15,100,120)

 

Вернемся к нашему примеру с выводом текста с помощью процедуры TextRect. Результат выполнения программы показан на рисунке 5.

Рисунок 5 – Пример использования процедуры TextRect

 

На рисунке 5 видно, что вывод текстовой строки был ограничен прямоугольником Rect(10,10,100,100). Та текстовая часть, которая не попала в рамки данного прямоугольника, была отсечена при выводе.

ОСНОВНЫЕ МЕТОДЫ, ИСПОЛЬЗУЕМЫЕ ДЛЯ РИСОВАНИЯ ПРИМИТИВОВ НА КАНВЕ

 

 

Метод LineTo(x,y)

 

Данный метод рисует линию от текущей позиции до позиции (x,y). По умолчанию начальная позиция равна (0,0). После рисования линии текущая позиция станет равной (x,y).

Приведем пример рисования двух линий в компоненте TImage. Следовательно, будем рисовать не на самой форме, а на канве компонента Image, который расположен на вкладке Additional панели компонентов. Добавим данный компонент на форму и в обработчике события нажатия кнопки Button1 напишем следующий код:

image1.Canvas.LineTo(100,90);

image1.Canvas.LineTo(120,150);

 

Линия рисуется из текущей позиции пера на канве в позицию, заданную пользователем в параметрах. При запуске приложения перо будет находиться в левом верхнем углу канвы, то есть в координатах (0,0) канвы. Таким образом первая линия рисуется из координат (0,0) в координаты (100,90). После отрисовки линии текущей позицией пера становится конечная точка первой линии. Таким образом следующая линия будет рисоваться из координат (100,90) в координаты (120,150). Пример представлен на рисунке 6.

Рисунок 6 – Рисование двух линий

 

 

Процедура MoveTo(x,y)

 

Данный метод изменяет текущую позицию на канве на позицию, заданную параметрами (x,y).

Рассмотрим пример, на котором рисуется две линии с использованием процедуры MoveTo:

image1.Canvas.MoveTo(40,40); // меняем начальную позицию на (40,40)

image1.Canvas.LineTo(100,90);

image1.Canvas.MoveTo(70,40); // меняем начальную позицию на (30,50)

image1.Canvas.LineTo(110,90);

 

Пример запуска программы показан на рисунке 7.

 

Рисунок 7 – Рисование двух линий из разных начальных точек с использованием метода MoveTo

 

 

 

Метод Rectangle(x1,y1,x2,y2)

 

Выводит на канву прямоугольник с начальными координатами (x1,y1) и конечными (x2,y2). Начальными координатами является верхний левый угол прямоугольника, а конечными – правый нижний угол (рисунок 4).

Приведем пример рисования прямоугольника на канве компонента image1:

image1.Canvas.Rectangle(10,15,100,40);

 

Результат выполнения процедуры показан на рисунке 8.

Рисунок 8 – Рисование прямоугольника с помощью метода Rectangle

 

 

Метод RoundRect(x1,y1,x2,y2,ex,ey);

 

Рисует прямоугольник по координатам (x1,y1) и (x2,y2). Углы же скругляются с помощью эллипсов с шириной ex и высотой ey.

Листинг исходного кода (результат показан на рисунке 9):

image1.Canvas.RoundRect(10,20,70,130,30,60);

 

Рисунок 9 – Рисование прямоугольника со скругленными углами

Метод Ellipse(x1,y1,x2,y2)

 

Рисует окружность или эллипс с помощью текущих параметров пера Pen. Фигура заполняется текущим значением Brush. Точки (x1,y1) и (x2,y2) определяют прямоугольник, описывающий эллипс.

Листинг исходного кода (пример показан на рисунке 10):

image1.Canvas.Ellipse(10,10,200,30);

 

Рисунок 10 – Рисование эллипса

 

Метод Arc(x1,y1,x2,y2,x3,y3,x4,y4: Integer)

 

Рисует дугу. Точки (x1,y1) и (x2,y2) определяют прямоугольник, описывающий эллипс. Начальная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x3,y3). Конечная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x4,y4). Дуга рисуется против часовой стрелки от начальной до конечной точки.

Листинг исходного кода (пример показан на рисунке 11):

Image1.Canvas.Arc(0,0, 200,200, 200,0, 0,0);

Image1.Canvas.Arc(210,0, 410,200, 210,0, 410,0);

 

Рисунок 11 – Рисование дуги

 

 

Метод Chord(x1,y1,x2,y2,x3,y3,x4,y4: Integer)

 

 

Метод Chord рисует замкнутую фигуру: дугу окружности или эллипса, замкнутую хордой, с помощью текущих параметров пера Pen. Фигура заполняется текущим значением Brush (рассмотрим чуть ниже). Точки (x1,y1) и (x2,y2) определяют прямоугольник, описывающий эллипс. Начальная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x3,y3). Конечная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x4,y4). Дуга рисуется против часовой стрелки от начальной до конечной точки. Хорда соединяет точки(x3,y3) и (x4,y4).

Листинг исходного кода (пример показан на рисунке 12):

Image1.Canvas.Chord(0,0, 200,200, 200,0, 0,0);

Image1.Canvas.Chord(210,0, 410,200, 210,0, 410,0);

 

Рисунок 12 – Рисование дуги окружности или эллипса, замкнутой хордой

 

Метод Pie (x1,y1,x2,y2,x3,y3,x4,y4:Longint);

 

Метод Pie рисует замкнутую фигуру — сектор окружности или эллипса, с помощью текущих параметров пера Pen. Фигура заполняется текущим значением Brush. Точки (x1,y1) и (x2,y2) определяют прямоугольник, описывающий эллипс. Начальная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x3,y3). Конечная точка дуги определяется пересечением эллипса с прямой, проходящей через его центр и точку (x4,y4). Дуга рисуется против часовой стрелки от начальной до конечной точки. Рисуются прямые, ограничивающие сегмент и проходящие через центр эллипса и точки (x3,y3) и (x4,y4).

Листинг исходного кода (результат показан на рисунке 13):

Image1.Canvas.Pie(0,0, 200,200, 200,0, 0,0);

Image1.Canvas.Pie(210,0, 410,200, 210,0, 410,0);

 

Рисунок 13 – Рисование сектора окружности или эллипса

 

Метод Polyline

 

Рисует на канве текущим пером кусочно-линейную кривую по заданному множеству точек.

Листинг исходного кода (результат показан на рисунке 14):

Image1.Canvas.Polyline([ Point(10,10), Point(200,30), Point(100,80) ])

 

Рисунок 14 – Вывод кусочно-линейной кривой по трем точкам

 

Метод Polygon

Рисует на канве текущим пером замкнутую фигуру по заданному множеству угловых точек.

Листинг исходного кода (результат показан на рисунке 15):

Image1.Canvas.Polygon([ Point(10,10), Point(200,30), Point(100,80), Point(100,80)])

 

Рисунок 15 – Вывод замкнутой фигуры по множеству угловых точек

 

 

КЛАСС TPen

 

Предназначен для описания свойств пера (карандаша). Данный инструмент используется канвой для рисования линий (рамой фигур, таких как эллипс, прямоугольник и т.д.).

 

Основными свойствами данного класса являются:

− Color – задает цвет пера;

− Mode – описывает одну из бинарных растровых операций. Эти операции определяют взаимодействие цвета пера с цветом экрана и соответствуют стандартным операциям, определенным в Windows (таблица 2). По умолчанию установлен режим pmCopy;

 

Таблица 2 – Возможные значения свойства Mode

Mode (режим)	Логическая операция перо-экран	Результирующий цвет
pmBlack	Black	Всегда черный
pmWhite	White	Всегда белый
pmNop	Нет	Неизменный
pmNot	Not Screen	Инверсия цвета экрана
pmCopy	Pen	Цвет пера, указанный свойством Pen.Color
pmNotCopy	Not Pen	Инверсия цвета пера
pmMergePenNot	Pen or not Screen	Дизъюнкция цвета пера и инверсии цвета экрана
pmMaskPenNot	Pen and not Screen	Конъюнкция цвета пера и инверсии цвета экрана
pmMergeNotPen	Not Pen or Screen	Дизъюнкция цвета экрана и инверсии цвета пера
pmMaskNotPen	Not Pen and Screen	Конъюнкция цвета экрана и инверсии цвета пера
pmMerge	Pen or Screen	Дизъюнкция цвета пера и цвета экрана
pmNotMerge	Not (Pen or Screen)	Инверсия дизъюнкции цвета пера и цвета экрана
pmMask	Pen and Screen	Конъюнкция цветов пера и экрана
pmNotMask	Not (Pen and Screen)	Инверсия конъюнкции цветов пера и экрана
pmXor	Pen xor Screen	Цвета пера и экрана связаны операцией «исключающее или»
pmNotXor	Not (Pen xor Screen)	Инверсия операции «исключающее или» для цветов пера и экрана

 

 

− Style – определяет стиль линии, рисуемой пером:

Стиль	Описание	Отображение
psSolid	Сплошная линия
psDash	Штриховая линия
psDot	Пунктирная линия
psDashDot	Штрих-пунктирная линия
psDashDotDot	Линия, чередующая штрих и два пунктира
psClear	Отсутствующая линия
psInsideFrame	Сплошная линия, но при width > 1 допускающая цвета, отличные от палитры windows.

 

 

− Width – содержит значение толщины пера в пикселах.

 

 

 

Приведем пример изменения свойств пера. Нарисуем эллипс и линию с разными свойствами пера для каждой фигуры.

Листинг исходного кода (результат показан на рисунке 16):

Image1.Canvas.Pen.Color:= RGB(255,110,155);

Image1.Canvas.Pen.Style:= psInsideFrame;

Image1.Canvas.Pen.Width:= 6;

Image1.Canvas.Rectangle(10,10,100,50);

 

Image1.Canvas.Pen.Color:= clGreen;

Image1.Canvas.Pen.Width:= 1;

Image1.Canvas.Pen.Style:= psDashDot;

Image1.Canvas.MoveTo(10,60);

Image1.Canvas.LineTo(100,100);

 

 

Рисунок 16 – Пример изменения свойств пера Pen

 

 

 

КЛАСС TBrush

 

 

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

Основными свойствами данного класса являются:

− Color – определяет цвет заливки;

− Bitmap – может содержать битовую карту, определенную пользователем для закраски областей (заполнение областей рисунком/текстурой);

− Style – определяет стиль заливки (фактуру закраски). Возможные значения стиля кисти (bsSolid, bsClear, bsHorizontal, bsVertical, bsFDiagonal, bsBDiagonal, bsCross, bsDiagCross):

 

 

Приведем пример изменения стиля заливки для двух фигур: прямоугольника и эллипса. Заполним прямоугольник стандартной картинкой Windows с помощью свойства Bitmap, а эллипс выведем красной пунктирной рамкой. Эллипс заполним зеленой сеткой (стиль bsDiagCross).

 

Исходный код обработчика события нажатия на кнопку:

procedure TForm1.Button1Click(Sender: TObject);

var

btmp: TBitmap;

begin

btmp:= TBitmap.Create; // инициализируем класс для загрузки картинки

try

btmp.LoadFromFile('texture_b.bmp'); // загружаем картинку из файла

 

Image1.Canvas.Pen.Color:= clBlack; // цвет рамки - черный

Image1.Canvas.Pen.Style:= psSolid; // стиль рамки - сплошной

Image1.Canvas.Pen.Width:= 1; // толщина рамки – 1

 

Image1.Canvas.Brush.Bitmap:= btmp; // устанавливает заливку

// картинкой

 

{Рисуем прямоугольник в соответствии

с указанными стилями рамки и заливки}

Image1.Canvas.Rectangle(10,10,100,50);

 

{теперь меняем стили рамки и заливки для другой фигуры}

Image1.Canvas.Pen.Color:= clRed;

Image1.Canvas.Pen.Width:= 1;

Image1.Canvas.Pen.Style:= psDash;

 

{обнуляем для заливки следующей фигуры ссылку на картинку}

Image1.Canvas.Brush.Bitmap:= nil;

 

{устанавливаем стиль заливки для второй фигуры}

Image1.Canvas.Brush.Style:= bsDiagCross;

Image1.Canvas.Brush.Color:= clGreen;

 

{Рисуем эллипс в соответствии

с указанными стилями рамки и заливки}

Image1.Canvas.Ellipse(10,60,100,100);

finally

Image1.Canvas.Brush.Bitmap:= nil;

btmp.Free;

end;

end;

 

 

Пример работы программы показан на рисунке 17.

 

 

Рисунок 17 – Пример заливки фона фигуры

Свойство канвы CopyMode

 

Определяет способ взаимодействия холста с изображением, скопированным с другого холста. По умолчанию, copyMode=cmSrcCopy. Это означает, что пикселы другого холста копируются на холст, перекрывая любое изображение. Изменяя CopyMode, можно создавать различные эффекты. Таблица 3 показывает возможные значения свойства CopyMode и описывает каждое из них.

 

Таблица 3 – Возможные значения свойства CopyMode

Mode (Режим)	Результат
cmBlackness	Превращает все пикселы на полотне в черные
cmDstlnvert	Инвертирует цвета всех пикселов
cmMergeCopy	Объединяет шаблон и исходное полотно, используя логический оператор AND
cmMergePaint	Объединяет инвертированное исходное полотно с результирующим полотном, используя логический оператор OR
cmNotSrcCopy	Копирует инвертированное исходное полотно
cmNotSrcErase	Инвертирует результат объединения результирующего полотна и исходного полотна, используя логический оператор OR
cmPatCopy	Копирует шаблон
cmPatInvert	Объединяет результирующее полотно с шаблоном, используя логический оператор XOR
cmPatPaint	Объединяет инвертированное исходное полотно с шаблоном, используя логический оператор OR
cmSrcAnd	Объединяет точки результирующего полотна и исходного полотна, используя логический оператор AND
cmSrcCopy	Копирует исходное полотно в результирующее полотно
cmSrcErase	Инвертирует результирующее полотно и объединяет результат с исходным полотном, используя логический оператор AND
cmSrclnvert	Объединяет точки результирующего полотна и исходное полотно, используя логический оператор XOR
cmSrcPaint	Объединяет точки результирующего полотна и исходное полотно, используя логический оператор OR
cmWhiteness	Превращает все пикселы на полотне в белые

 

ДОПОЛНИТЕЛЬНЫЕ МЕТОДЫ КАНВЫ

 

 

Метод BrushCopy(const Dest: TRect; Bitmap: TBitmap; const Source: TRect; Color: TColor);

 

Метод BrushCopy копирует прямоугольник Source из битовой карты Bitmap в прямоугольник Dest на канве. При этом для точек, имеющих цвет Color, назначается цвет кисти (Brush.Color).

Пример исходного кода:

 

Из приведенного кода видно, что сначала мы создаем объект bitmap и загружаем в него файл. Далее мы устанавливаем цвет заливки = clYellow. Именно этим цветом в последствии будет заменяться каждый белый пиксел копируемого битмапа.

Далее мы производим копирование в канву Form1.Canvas в область Rect(0,0,80,30) прямоугольника bitmapImage.Canvas.ClipRect из битмапа bitmapImage, указывая, что каждый пиксел с цветом clWhite будет заменяться цветом текущей заливки Form1.Canvas.Brush.Color.

Финальным действием мы освобождаем память, выделенную под объект bitmapImage.

Результат работы программы вы можете увидеть на рисунке 18. Стоит заметить, что копируемый прямоугольник bitmapImage.Canvas.ClipRect растягивается по размерам прямоугольника назначения Rect(0,0,80,30).

Рисунок 18 – Пример использования метода BrushCopy

 

 

Метод CopyRect(const Dest: TRect; Canvas: TCanvas; const Source: TRect);

 

Данный метод копирует прямоугольник Source из канвы Canvas в прямоугольник Dest канвы метода.

 

 

Метод Draw(X, Y: Integer; Graphic: TGraphic);

 

Данный метод выводит графический объект Graphic на холсте в прямоугольной области с верхним левым углом (X,Y).

 

 

Метод FillRect(const Rect: TRect);

 

Данный метод заполняет указанный прямоугольник Rect на холсте, используя текущую кисть.

 

 

Метод FloodFill(X, Y: Integer; Color: TColor; FillStyle: TFillStyle);

 

Данный метод осуществляет заливку, начиная с координаты (X,Y). Если параметр FillStyle равен fsSurface, то заливка продолжается до тех пор, пока есть соседние точки с цветом Color. Если параметр FillStyle равен fsBorder, то заливка прекращается при достижении границ с цветом Color. Заливка со значением параметра FillStyle=fsBorder приводит к заливке всей канвы компонента, если ограничивающий контур «проколот» точкой другого цвета.

 

 

Метод FrameRect(const Rect: TRect);

 

Данный метод рисует контур прямоугольника, используя кисть холста. Данный метод не заполняет внутренность прямоугольника кистью Brush.

 

 

Метод StretchDraw(const Rect: TRect; Graphic: TGraphic);

 

Метод StretchDraw рисует графический объект Graphic в заданном прямоугольнике Rect. Если размеры Rect и Graphic не совпадают, то Graphic масштабируется и вписывается в Rect.

 

Рисование на экране

 

Из приложения можно получить доступ не только к канве компонента, имеющего свойство Canvas, но и к канве любого компонента или ко всему экрану. Для этого объявим переменную ScreenDC типа HDC. Напомним, что тип HDC – это тип контекста рисования в Windows.

 

С помощью функции GetDC можно взять контекст окна, указанного в скобках. Ноль означает, что используется контекст экрана. Метод Ellipse отличается от метода TCanvas.Ellipse только первым параметром – контекстом устройства. Это связано с тем, что ранее рисование шло через объект TCanvas, а при рисовании на экране – средствами GDI модуля Windows. Процедура TCanvas.Ellipse всего лишь вызывает Ellipse из Windows API и подставляет нужный контекст устройства и размеры, поэтому в ней на один параметр меньше.

 

 

МУЛЬТИПЛИКАЦИЯ

 

 

Мультиплика́ция (от лат. multiplicatio — умножение, увеличение, возрастание, размножение) — технические приёмы создания иллюзии движущихся изображений (движения и/или изменения формы объектов — морфинга) с помощью последовательности неподвижных изображений (кадров), сменяющих друг друга с некоторой частотой. Анима́ция (от фр. animation: оживление, одушевление) — западное название мультипликации: вид киноискусства и его произведение (мультфильм), а также соответствующая технология.

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

Так как необходимо будет часто менять координаты перемещаемого объекта, то необходимо воспользоваться одним из двух способов:

1) Перерисовывать объект мультипликации в цикле (FOR, WHILE и т.д.), указывая задержку (процедура Sleep(milliseconds: Cardinal););

2) Использовать компонент Timer (вкладка System панели компонентов), который будет выполнять повторяющиеся действия через указанный интервал времени;

 

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

Разместим на форме компонент PaintBox, расположенный на вкладке System. Именно по его канве будет перемещаться прямоугольник. Также на форме разместим кнопку, по нажатию на которую будет начинаться движение прямоугольника (рисунок 19).

Рисунок 19 - Примерный вид формы для создания простой мультипликации

 

 

Листинг исходного кода:

 

Рисунок 20 – Результат выполнения программы

 

 

Данный пример является демонстрацией простой мультипликации. Можно видеть, что старая позиция прямоугольника закрашивается таким же прямоугольником, но цвет его границы и заливки установлен таким же, как и цвет фона компонента PaintBox1. Таким образом, создается иллюзия перемещения красного прямоугольника.

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

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

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

 

Рисунок 21 – Перемещение объекта по фоновому изображению

 

 

Листинг исходного кода обработчика события нажатия кнопки с комментариями:

procedure TForm1.Button1Click(Sender: TObject);

Var

Begin

{Создаем три объекта типа TBitmap}

bFon:= TBitmap.Create;

bSharik:= TBitmap.Create;

bBufer:= TBitmap.Create;

Try

{Задаем ширину и высоту для шарика. В эту ширину и высоту будет вписываться

исходное изображение шарика, которое имеет больший размер, чем нам необходимо}

sharikWidth:= 60;

sharikHeight:= 90;

{Загружаем в битмап bFon фоновый рисунок}

bFon.LoadFromFile('fon.bmp');

{Отрисовываем загруженный фон на полотне PaintBox1}

PaintBox1.Canvas.Draw(0,0,bFon);

{Загружаем рисунок шарика в битмап bSharik}

bSharik.LoadFromFile('sharik.bmp');

{Сообщаем, что прозрачным цветом в нашем изображение будет являться

левый верхний пиксел изображения с воздушным шариком}

bSharik.TransparentColor:= bSharik.Canvas.Pixels[0,0];

{Сообщаем, что мы будем делать все пикселы прозрачными, у которых

цвет соответствует цвету, указанному в bSharik.TransparentColor}

bSharik.Transparent:= true;

{Начальная позиция по координате Y устанавливается концу высоты изображения.

Ширины и высоты шарика.

Мы здесь указали, что шарик будет выводиться по координате X c 150го пиксела}

sharikRect:= Rect(150,y,150+sharikWidth,y+sharikHeight);

{Так как мы в буфер не загружали никакие изображения изначально, то

Begin

{выводим на фон скопированный заранее буфер}

PaintBox1.Canvas.CopyRect(sharikRect,bBufer.Canvas,buferRect);

{уменьшаем переменную Y. тем самым шарик будет отрисовываться чуть выше}

y:=y-1;

{запоминаем координаты прямоугольника куда впоследствии будет

отрисовываться шарик.}

sharikRect:= Rect(150,y,150+sharikWidth,y+sharikHeight);

{В буфер копируем прямоугольник с запомненными ранее координатами}

bBufer.Canvas.CopyRect(buferRect,bFon.Canvas,sharikRect);

{Отрисовываем шарик}

PaintBox1.Canvas.StretchDraw(sharikRect,bSharik);

{устанавливаем задержку, чтобы шарик двигался более медленно}

sleep(20);

end;

Finally

{Очищаем память из под наших битмапов}

bFon.Free;

bSharik.Free;

bBufer.Free;

end;

end;

 

 

ЗАДАНИЕ

 

Создать программу, демонстрирующую мультипликацию в соответствии с индивидуальным заданием (таблица 4).

 

Таблица 4 – Индивидуальные задания по вариантам

№ варианта (номер по журналу)	Задание
	Продемонстрировать работу светофора
	Показать заполнение резервуара водой
	Создать анимацию полета НЛО по небу
	Создать анимацию полета ядра, выпущенного из пушки
	Создать анимацию движения маятника
	Создать анимацию спуска парашютиста с неба
	Создать анимацию человека, машущего руками
	Создать анимацию движения планет вокруг Солнца
	Продемонстрировать полет воздушного змея по небу
	Создать мультипликацию полета самолета по небу
	Создать анимацию движения рыбки в аквариуме
	Создать анимацию движения божьей коровки по траве
	Продемонстрировать работу светофора
	Показать заполнение резервуара водой
	Создать анимацию полета НЛО по небу
	Создать анимацию полета ядра, выпущенного из пушки
	Создать анимацию движения маятника
	Создать анимацию спуска парашютиста с неба
	Создать анимацию человека, машущего руками
	Создать анимацию движения планет вокруг Солнца
	Продемонстрировать полет воздушного змея по небу
	Создать мультипликацию полета самолета по небу
	Создать анимацию движения рыбки в аквариуме
	Создать анимацию движения божьей коровки по траве
	Продемонстрировать работу светофора
	Показать заполнение резервуара водой
	Создать анимацию полета НЛО по небу
	Создать анимацию полета ядра, выпущенного из пушки
	Создать анимацию движения маятника
	Создать анимацию спуска парашютиста с неба

 

КОНТРОЛЬНЫЕ ВОПРОСЫ

 

1. С помощью какого метода можно изменить цвет пиксела?

2. Какие цветовые модели существуют помимо цветовой модели RGB?

3. Какие методы используются для вывода текста на канву?

4. Каким компонентом можно воспользоваться помимо циклов для выполнения повторных действий через определенный промежуток времени?

 

 

СПИСОК ЛИТЕРАТУРЫ

 

1. Тюкачев Н.А. / Программирование графики в Delphi / Н.А. Тюкачев, И.В. Илларионов, В.Г. Хлебостроев – СПб.:БХВ-Петербург, 2008 – 784с.

ЦВЕТ

 

В предыдущем примере для задания красного цвета пиксела мы использовали константу clRed. В модуле Graphics имеются следующие константы цветов:

clBlack = TColor($000000);

clMaroon = TColor($000080);

clGreen = TColor($008000);

clOlive = TColor($008080);

clNavy = TColor($800000);

clPurple = TColor($800080);

clTeal = TColor($808000);

clGray = TColor($808080);

clSilver = TColor($C0C0C0);

clRed = TColor($0000FF);

clLime = TColor($00FF00);

clYellow = TColor($00FFFF);