Класс TCanvas представляет собой сложное образование для соз-
дания изображений. Он объединяет в себе устройство графического
интерфейса CDI, инструменты (перо, кисть и шрифт, которые уже рас-
смотрены) и набор методов для рисования простейших геометриче-
ских фигур. Класс TCanvas не является компонентом, а входит в каче-
стве свойства во многие визуальные компоненты: TBitmap, TComboBox,
TDBComboBox, TDBGrid, TDBListBox, TDirectoryListBox, TDrawGrid,
TFileListBox, TForm, Tlmage, TListBox, TOutline, TPaintBox,
TPrinter, TStringGrid.
На канве можно представить наличие невидимого курсора, кото-
рый определяет текущее положение карандаша. Для ряда случаев ри-
сование тех или иных примитивов (например, линии) начинается с
текущего положения этого курсора. Имеются средства установки кур-
сора, в заданное положение. При выполнении некоторых операций
курсор меняет свое положение.
Основные свойства класса TCanvas представлены в табл. 1.4.
Таблица 1.4. Свойства класса TCanvas
Для того чтобы на поверхности объекта появилась картинка (на-
пример, содержимое jpg-файла), текст или графический примитив
(точка, линия, прямоугольник, окружность и т.п.), необходимо к свой-
ству Canvas применить соответствующий метод (табл. 1.5), обеспечи-
вающий отображение иллюстрации, вывод текста или вычерчивание
графического примитива. При отображении фигур контур изображает-
ся карандашом Pen с установленными в нем характеристиками. Если
фигура является замкнутой, ее поверхность закрашивается кистью
Brush с установленными в ней характеристиками. Все тексты изобра-
жаются шрифтом Font с заданными характеристиками. Во время вы-
полнения приложения эти характеристики можно изменять, но эти
изменения должны быть выполнены до того момента, как соответст-
вующий инструмент будет использован для отображения графического
примитива.
Методы вывода графических примитивов рассматривают свойство
Canvas как некоторую поверхность, на которой можно рисовать. Гра-
фическая поверхность состоит из отдельных точек – пикселей. Поло-
жение точки характеризуется горизонтальной и вертикальной коорди-
натами (x, y). Координата (0,0) - это координаты верхнего левого пик-
селя, т.е. верхнего левого угла графической поверхности. Координаты
возрастают сверху вниз и слева направо, то есть значения по оси Оу
увеличиваются вниз экрана (рис. 1.2).
Рис. 1.2. Координаты области вывода
Метод построения графического примитива в общем случае имеет
следующий синтаксис:
Компонент.Canvas.Metod(параметры_метода);
Таблица 1.5. Методы рисования класса TCanvas
При построении графических изображений часто используются
классы TPoint и TRect, задающие координаты точки и прямоуголь-
ную область:
TPoint=record
x:Longint;
y: Longint
end;
TRect=record
Case integer of
0:(Left,Top,Right,Bottom: integer);
1:(TopLeft, BottomRight: TPoint)
end
end;
Заполнить поля структуры TRect можно при помощи функции
Bounds, обращение к которой в общем случае имеет вид:
Bounds(x, y, w, h)
где: x и y – координаты левого верхнего угла области; w и h – ши-
рина и высота области.
Пример использования структур TPoint и TRect:
procedure TForm1.Button1Click(Sender: TObject);
var
p1, p2: TPoint;
r1, r2: TRect;
begin
p1.X:=50; p1.Y:=50; //координаты первой точки
p2.X:=100; p2.Y:=100; //координаты второй точки
//Зададим координаты углов прямоугольников
r1:=Rect(p1,p2);
r2:=Rect(10,10,100,100);
with Form1.Canvas do
begin
Brush.Color:=clYellow; //цвет кисти
FillRect(r1); //закрашенный прямоугольник
Pen.Color:=clRed; //цвет пера
MoveTo(p1.X, p1.Y); //перемещение курсора
LineTo(p2.X, p2.Y); //проводим линию
Brush.Color:=clBlue; //цвет кисти
FrameRect(r2) //граница прямоугольника
end
end;
На рис. 1.3 для некоторых методов рисования приведены парамет-
ры, определяющие вид геометрической фигуры.
Рис. 1.3. Значения параметров некоторых методов рисования
Рассмотрим примеры, демонстрирующие работу методов рисова-
ния.
Пример использования метода Polygon для вычерчивания трапеции.
var
//координаты вершин многоугольника
point: array[1..4] of TPoint;
begin
//Координаты первой точки
point[1].X:=50; point[1].Y:=100;
//Координаты второй точки
point[2].X:=100; point[2].Y:=50;
//Координаты третьей точки
point[3].X:=150; point[3].Y:=50;
//Координаты четвертой точки
point[4].X:=200; point[4].Y:=100;
Form1.Canvas.Polygon(point);
end;
Пример использования свойства Pixels. При нажатии на кнопку
Button1 всем точкам формы присваивается свой цвет.
procedure TForm1.Button1Click(Sender: TObject);
var
i, j: longint;
begin
Button1.Visible:=false;
for i:=0 to Form1.Width do
for j:=0 to form1.Height do
Form1.Canvas.Pixels[i,j]:=i+j
end;
Пример появления 200 точек случайного цвета в случайном месте
компоненты Image1
const
countPoint=200; //число точек
var
i, x, y: integer;
begin
randomize;
for i:=1 to countPoint do
begin
x:=Random(Image1.Width);
y:=Random(Image1.Height);
Image1.Canvas.Pixels[x,y]:=RGB(Random(256),
Random(256), Random(256))
end
end;
В рассмотренном примере используется функция RGB, которая
определяет цвет из трёх основных составляющих: красного, зелёного и
синего (значения от 0 до 255).
В следующем примере показано, как скопировать графическое
изображение с инвертированием:
with Canvas do
begin
CopyMode:=cmNotSrcCopy;
CopyRect(ClientRect, Canvas, ClientRect);
end;
Пример использования методов рисования. При нажатии на кноп-
ку Button2 в случайном месте на форме появляется смайлик.
procedure TForm1.Button2Click(Sender: TObject);
var
x, y: integer; //координаты смайла
begin
randomize;
//случайный выбор координат
x:=random(ClientWidth-60);
y:=random(ClientHeight-60);
with Form1.Canvas do
begin
Pen.Width:=1; //толщина карандаша
Pen.Color:=clBlack; //цвет карандаша
Brush.Color:=clYellow; //цвет кисти
Ellipse(x, y, x+60, y+60); //лицо смайла
Brush.Color:=clWhite; //цвет кисти
Ellipse(x+10, y+15, x+25, y+30); //левый глаз
Ellipse(x+35, y+15, x+50, y+30); //правый глаз
Brush.Color:=clBlack; //цвет кисти
Ellipse(x+15, y+20, x+22, y+25); //левый зрачок
Ellipse(x+40, y+20, x+45, y+25); //правый зрачок
Pen.Color:=clRed; //цвет карандаша
Pen.Width:=3; //толщина карандаша
arc(x+15,y+30,x+45,y+50,x+15,y+40,x+45,y+40) //улыбка
end
end;
Пример использования метода Draw(). Графический файл картин-
ка.bmp рисуется на канве формы Form1 в прямоугольной области с
верхним углом (10, 10).
procedure TForm1.Button1Click(Sender: TObject);
var
Bitmap: TBitmap; //фоновая картинка
begin
Bitmap:=TBitmap.Create;//создание объекта – битового образа
//Загрузка битового изображения из файла
Bitmap.LoadFromFile('картинка.bmp');
Form1.Canvas.Draw(10,10,Bitmap);
end;
В рассмотренном примере если после загрузки изображения (на-
жатии на кнопку Button1) свернуть окно и вновь его развернуть, то
картинка не будет изображаться на поверхности формы. Это связано с
тем, что не происходит перерисовка компонента, в который загружает-
ся картинка (в данном случае Form1).
Доступ к графической поверхности объекта (свойству Canvas)
имеет процедура обработки события Paint. Поэтому графику должна
выводить именно она. Событие Paint возникает перед тем, как компо-
нент должен быть перерисован, например, для формы это событие
возникает в начале работы приложения, а также всякий раз, когда окно
или его часть (которая была, например, закрыта другим окном) появ-
ляется на экране. Рисование с помощью методов класса TCanvas в
процедуре FormCreatе не осуществляется, так как в процессе создания
формы (onCreat) связь объекта с Windiws на исполнение ко-
манд/запросов еще не установлена. Поэтому выполнение графики на
форме производится либо в специальной процедуре Events/OnPaint
(объект Form). Либо в других обработчиках событий объектов формы
(например, ButtonClick).
Пример использования обработчика OnPaint. Создадим приложе-
ние, в котором фоновый рисунок загружается из файла. Если размер
загружаемого изображения меньше размера окна, то фоновый рисунок
должен быть растиражирован.
var
Form1: TForm1;
implementation
{$R *.dfm}
var
Bitmap: TBitmap; //фоновая картинка
procedure TForm1.FormCreate(Sender: TObject);
begin
Bitmap:=TBitmap.Create;//создание объекта - битового образа
//Загрузка битового изображения из файла
Bitmap.LoadFromFile('картинка.bmp');
end;
procedure TForm1.FormPaint(Sender: TObject);
var
x, y: integer; //левый верхний угол картинки
begin
x:=0;
y:=0;
while y
begin
while x
begin
form1.Canvas.Draw(x, y, Bitmap);
x:=x+Bitmap.Width
end;
x:=0;
y:=y+Bitmap.Height
end
end;
Для вывода картинки на канву можно также использовать метод
StretchDraw(), он отличается от метода Draw() тем, что растягивает
или сжимает картинку так, чтобы она заполнила весь указанный пря-
моугольник, например:
implementation
{$R *.dfm}
var
Bitmap: TBitmap; //фоновая картинка
procedure TForm1.FormCreate(Sender: TObject);
begin
Bitmap:=TBitmap.Create; //создание объекта-битового образа
//Загрузка битового изображения из файла
Bitmap.LoadFromFile('картинка.bmp');
end;
procedure TForm1.FormPaint(Sender: TObject);
begin
Canvas.StretchDraw(Rect(0, 0, Form1.Width, Form1.Height),
Bitmap);
end;
|
Главная
Каталог файлов
