Методы вычерчивания графических примитивов

Любая картинка, чертеж, схема могут рассматриваться как совокупность графических примитивов: точек, линий, окружностей, дуг и др.

Вычерчивание графических примитивов на поверхности компонента (формы или области вывода иллюстрации) осуществляется применением соответствующих методов к свойству Canvas этого компонента.

Линия

Вычерчивание прямой линии осуществляет метод LinеТо, инструкция вызова которого в общем виде выглядит следующим образом: Компонент.Canvas.LineTo(x,у)

Метод LinеТо вычерчивает прямую линию от текущей позиции карандаша в точку с координатами, указанными при вызове метода.

Начальную точку линии можно задать, переместив карандаш в нужную точку графической поверхности. Сделать это можно при помощи метода MoveTo, указав в качестве параметров координаты нового положения карандаша.

Вид линии (цвет, толщина и стиль) определяется значениями свойств объекта Реп графической поверхности, на которой вычерчивается линия.

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

 

Рис. 4. Форма приложения Координатная сетка

 

Листинг 2. Оси координат и оцифрованная сетка

unit grid_;

Interface

uses Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs, StdCtrls;

Type

TForm1 = class(TForm)

procedure FormPaint(Sender: TObject);

private

{ Private declarations }

Public

{ Public declarations }

end;

var Form1: TForm1; implementation

{$R *.DFM}

procedure TForm1.FormPaint(Sender: TObject);

var x0,y0:integer; // координаты начала координатных осей

dx,dy:integer; // шаг координатной сетки (в пикселах)

h,w:integer; // высота и ширина области вывода координатной сетки

х,у:integer;

lx,ly:real; // метки (оцифровка) линий сетки по X и Y

dlx,dly:real; // шаг меток (оцифровки) линий сетки по X и Y

cross:integer; // счетчик неоцифрованных линий сетки

dcross:integer;// количество неоцифрованных линий между оцифрованными

Begin

х0:=30; у0:=220; // оси начинаются в точке (40,250)

dx:=40; dy:=40; // шар координатной сетки 40 пикселов

dcross:=1; // помечать линии сетки X: 1 — каждую;

// 2 — через одну;

// 3 — через две;

dlx:=0.5; // шаг меток оси X

dly:=1.0; // шаг меток оси Y, метками будут: 1, 2, 3 и т. д.

h:=200; w:=300;

with forml.Canvas do begin

cross:=dcross;

MoveTo(x0,v0); LineTo(x0,y0-h); // ось X

MoveTo(x0,y0); LineTo(x0+w, y0); // ось Y

// засечки, сетка и оцифровка по оси X

x:=x0+dx; lx:=dlx;

Repeat

MoveTo(x,y0-3);LineTo(x,yO+3); // засечка

cross:=cross-l;

if cross = 0 then // оцифровка

Begin

TextOut(x-8,y0+5,FloatToStr(lx));

cross:=dcross ; end;

Pen.Style:=psDot;

MoveTo(x,y0-3);LineTo(x,y0-h); // линия сетки

Pen.Style:=psSolid; lx:=lx+dlx; x:=x+dx;

until (x>x0+w);

// засечки, сетка и оцифровка по оси Y

y:=y0-dy; ly:=dly;

Repeat

MoveTo(х0-3,у);LineTo(х0+3,у); // засечка

TextOut(х0-20,у,FloatToStr(1у)); // оцифровка

Pen.Style:=psDot;

MoveTo(х0+3,у); LineTo(x0+w,у); // линия сетки

Pen.Style:=psSolid; y:=y-dy; ly:=ly+dly;

until (y<y0-h);

end;end;

End.

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

Ломаная линия

Метод polyline вычерчивает ломаную линию. В качестве параметра метод получает массив типа TPoint. Каждый элемент массива представляет собой запись, поля х и у которой содержат координаты точки перегиба ломаной. Метод Polyline вычерчивает ломаную линию, последовательно соединяя прямыми точки, координаты которых находятся в массиве: первую со второй, вторую с третьей, третью с четвертой и т. д.

В качестве примера использования метода Polyline в листинге 3 приведена процедура, которая выводит график изменения некоторой величины. Предполагается, что исходные данные находятся в доступном процедуре массиве Data (тип Integer).

Листинг 3. График функции (использование метода Polyline)

procedure TForml.Button1Click(Sender: TObject);

Var

gr: array[1..50] of TPoint; // график — ломаная линия

x0,y0: integer; // координаты точки начала координат

dx,dy: integer; // шаг координатной сетки по осям X и Y

i: integer; begin

х0 := 10; у0 := 200; dx :=5; dy := 5;

// заполним массив gr

for i:=l to 50 do begin

gr[i].x := x0 + (i-l)*dx; gr[i].y := y0 - Data[i]*dy;

end;

// строим график

with forml.Canvas do begin

MoveTo(x0,y0); LineTo(x0,10); // ось Y

MoveTo(x0,y0); LineTo(200,y0); // ось X

Polyline(gr); // график

end; end;

Метод Polyline можно использовать для вычерчивания замкнутых контуров. Для этого надо, чтобы первый и последний элементы массива содержали координаты одной и той же точки. В качестве примера использования метода Polybine для вычерчивания замкнутого контура в листинге 4 приведена программа, которая на поверхности диалогового окна, в точке нажатия кнопки мыши, вычерчивает контур пятиконечной звезды (рис. 5).

Цвет, которым вычерчивается звезда, зависит от того, какая из кнопок мыши была нажата. Процедура обработки нажатия кнопки мыши (событие MouseDown) вызывает процедуру рисования звезды starLine и передает ей в качестве параметра координаты точки, в которой была нажата кнопка. Звезду вычерчивает процедура starLine, которая в качестве параметров получает координаты центра звезды и холст, на котором звезда должна быть выведена. Сначала вычисляются координаты концов и впадин звезды, которые записываются в массив р. Затем этот массив передается в качестве параметра методу Polyline. При вычислении координат лучей и впадин звезды используются функции sin и cos. Так как аргумент этих функций должен быть выражен в радианах, то значение угла в градусах домножается на величину pi/18о, где pi — это стандартная именованная константа равная числу пи.

Листинг 4. Вычерчивание замкнутого контура (звезды) в точке нажатия кнопки мыши

unit Stars_; interface

uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls;

Type

TForm1 = class(TForm)

procedure FormMouseDown(Sender: TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

Private

{ Private declarations }

Public

{ Public declarations }

end;

var Forml: TForml;

Implementation

f$R *.dfm}

// вычерчивает звезду

procedure StarLine(x0,y0,r: integer; Canvas: TCanvas);

// x0,y0 — координаты центра звезды, r — радиус заезды

Var

р : array [1.. 11] of TPoint; // массив координат лучей и впадин

a: integer; // угол между осью ОХ и прямой, соединяющей

// центр звезды и конец луча или впадину

i: integer;

Begin

а := 18; // строим от правого гор. луча

for i:=l to 10 do begin

if (i mod 2=0) then begin // впадина

p[i].x := x0+Round(r/2*cos(a*pi/180) ) ;

p[i] .y:=y0-Round(r/2*sin(a*pi/180) ) ;

End

Else begin // луч

[i] .x:=x0+Round(r*cos (a*pi/180) ) ;

[i] .y:=y0-Round(r*sin(a*pi/180) ) ;

end;

a := a+36;

end;

p[ll].X := p[l].X; // чтобы замкнуть контур звезды

Canvas. Polyline (р) ; // начертить звезду

end;

// нажатие кнопки мыши

procedure TForm1 . FormMouseDown { Sender : TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

Begin

if Button = mbLeft // нажата левая кнопка?

then Form1. Canvas . Pen . Color : = clRed

else Form1. Canvas. Pen. Color := clGreen;

StarLine(x, y, 30, Forml. Canvas );

end;

end.

 

Рис. 5. Звезда

Примечание

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

Окружность и эллипс

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

Объект.Canvas.Ellipse(x1,y1, х2,у2]

где:

· объект — имя объекта (компонента), на поверхности которого выполняется вычерчивание;

· x1, y1, х2, у2 — координаты прямоугольника, внутри которого вычерчивается эллипс или, если прямоугольник является квадратом, окружность (рис. 6).

 

 

 

Рис. 6. Значения параметров метода Ellipse определяют вид геометрической фигуры

 

Цвет, толщина и стиль линии эллипса определяются значениями свойства Реп, а цвет и стиль заливки области внутри эллипса — значениями свойства Brush поверхности (canvas), на которую выполняется вывод.

Дуга

Вычерчивание дуги выполняет метод Arc, инструкция вызова которого в общем виде выглядит следующим образом: Объект.Canvas.Arc(x1,y1,х2,у2,х3,у3,х4,у4)

где:

· x1, y1, х2, у2 — параметры, определяющие эллипс (окружность), частью которого является вычерчиваемая дуга;

· х3, у3 — параметры, определяющие начальную точку дуги; П х4, у4 — параметры, определяющие конечную точку дуги.

Начальная (конечная) точка — это точка пересечения границы эллипса и прямой, проведенной из центра эллипса в точку с координатами х3 и у3 (х4, у4). Дуга вычерчивается против часовой стрелки от начальной точки к конечной (рис. 7).

Цвет, толщина и стиль линии, которой вычерчивается дуга, определяются значениями свойства Реп поверхности (canvas), на которую выполняется вывод.

 

Рис. 7. Значения параметров метода Arc определяют дугу как часть эллипса (окружности)

Прямоугольник

Прямоугольник вычерчивается методом Rectangle, инструкция вызова которого в общем виде выглядит следующим образом: Объект. Canvas . Rectangle ( x 1, y 1, x 2, y 2)

где:

· объект — имя объекта (компонента), на поверхности которого выполняется вычерчивание;

· x1, y1 и х2, у2 — координаты левого верхнего и правого нижнего углов прямоугольника.

Метод RoundRec тоже вычерчивает прямоугольник, но со скругленными углами. Инструкция вызова метода RoundRec выглядит так: Объект.Canvas.RoundRec(x1,y1,х2, у2, х3, у3), где:

· x1, y1, х2, у2 -- параметры, определяющие положение углов прямоугольника, в который вписывается прямоугольник со скругленными углами;

· х3 и у3 — размер эллипса, одна четверть которого используется для вычерчивания скругленного угла (рис. 8).

 

Рис. 8. Метод RoundRec вычерчивает прямоугольник со скругленными углами

 

Вид линии контура (цвет, ширина и стиль) определяется значениями свойства Реп, а цвет и стиль заливки области внутри прямоугольника — значениями свойства Brush поверхности (canvas), на которой прямоугольник вычерчивается.

Есть еще два метода, которые вычерчивают прямоугольник, используя в качестве инструмента только кисть (Brush). Метод FillRect вычерчивает закрашенный прямоугольник, а метод FrameRect — только контур. У каждого из этих методов лишь один параметр — структура типа TRect. Поля структуры TRect содержат координаты прямоугольной области, они могут быть заполнены при помощи функции Rect.

Ниже в качестве примера использования методов FillRect и FrameRect приведена процедура, которая на поверхности формы вычерчивает прямоугольник с красной заливкой и прямоугольник с зеленым контуром.

 

procedure TForm1.Button1Click(Sender: TObject);

var r1, r2: TRect; // координаты углов прямоугольников

Begin

// заполнение полей структуры

// зададим координаты углов прямоугольников

r1 := Rect(20,20,60,40); r2 := Rect(10,10,40,50);

with fоrm1.Canvas do begin

Brush.Color := clRed; FillRect(r1); // закрашенный прямоугольник

Brush.Color := clGreen; FrameRect(r2}; // только граница прямоугольника

end; end;

Многоугольник

Метод Polygon вычерчивает многоугольник. В качестве параметра метод получает массив типа TPoint. Каждый элемент массива представляет собой запись, поля (х,у) которой содержат координаты одной вершины многоугольника. Метод Polygon вычерчивает многоугольник, последовательно соединяя прямыми линиями точки, координаты которых находятся в массиве: первую со второй, вторую с третьей, третью с четвертой и т. д. Затем соединяются последняя и первая точки.

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

Ниже приведена процедура, которая, используя метод polygon, вычерчивает треугольник:

procedure TForm1.Button2Click(Sender: TObject);

var pol: array[1..3] of TPoint; // координаты точек треугольника

Begin

pol[1].x := 10;

polf1].y := 50;

pol[2].x := 40;

pol[2].y := 10;

pol[3].х := 70;

pol[3].у := 50;

Form1.Canvas.Polygon(pol);

end;

Сектор

Метод pie вычерчивает сектор эллипса или круга. Инструкция вызова метода в общем виде выглядит следующим образом:

Объект. Canvas.Pie(x1,y1,x2,y2,х3,у3,х4,у4)

где:

· x1, y1, х2, у2 — параметры, определяющие эллипс (окружность), частью которого является сектор;

· х3, у3, х4, у4 — параметры, определяющие координаты конечных точек прямых, являющихся границами сектора.

Начальные точки прямых совпадают с центром эллипса (окружности). Сектор вырезается против часовой стрелки от прямой, заданной точкой с координатами (хЗ, уз), к прямой, заданной точкой с координатами (х4, у4) (рис. 9).

 

Рис. 9. Значения параметров метода Pie определяют сектор как часть эллипса (окружности)

Точка

Поверхности, на которую программа может осуществлять вывод графики, соответствует объект Canvas. Свойство pixels, представляющее собой двумерный массив типа TColor, содержит информацию о цвете каждой точки графической поверхности. Используя свойство Pixels, можно задать требуемый цвет для любой точки графической поверхности, т. е. "нарисовать" точку. Например, инструкция

Form1.Canvas.Pixels[10,10]:=clRed окрашивает точку поверхности формы в красный цвет.

Размерность массива pixels определяется размером графической поверхности. Размер графической поверхности формы (рабочей области, которую также называют клиентской) задается значениями свойств ciientwidth и ClientHeight, а размер графической поверхности компонента image — значениями свойств width и Height. Левой верхней точке рабочей области формы соответствует элемент pixels [0,0], а правой нижней -Pixels[Ciientwidth - 1,ClientHeight - 1].

Свойство Pixels можно использовать для построения графиков. График строится, как правило, на основе вычислений по формуле. Границы диапазона изменения аргумента функции являются исходными данными. Диапазон изменения значения функции может быть вычислен. На основании этих данных можно вычислить масштаб, позволяющий построить график таким образом, чтобы он занимал всю область формы, предназначенную для вывода графика.

Например, если некоторая функция f(x) может принимать значения от нуля до 1000, и для вывода ее графика используется область формы высотой в 250 пикселов, то масштаб оси Y вычисляется по формуле: т = 250/1000. Таким образом, значению f(x) = 70 будет соответствовать точка с координатой Y =233. Значение координаты Y вычислено по формуле

Y= h -f(x) х т = 250 - 70х(250/1000), где h - высота области построения графика.

Обратите внимание на то, что точное значение выражения 250 - 70х(250/1000) равно 232,5. Но т. к. индексом свойства pixels, которое используется для вывода точки на поверхность Canvas, может быть только целое значение, то число 232,5 округляется к ближайшему целому, которым является число 233.

Следующая программа, текст которой приведен в листинге 5, используя свойство pixels, выводит график функции у = 2 sin(jc) e*/⁵. Для построения графика используется вся доступная область формы, причем если во время работы программы пользователь изменит размер окна, то график будет выведен заново с учетом реальных размеров окна.

Листинг 5. График функции

unit grfunc_;

Interface

Windows, Messages, SysUtils, Classes,

Graphics, Controls, Forms, Dialogs;

Type

TForm1 = class(TForm)

procedure FormPaint(Sender: TObject);

procedure FormResize(Sender: TObject);

private

{ Private declarations }

Public

{Public declarations }

end;

var Forml: TForml;

Implementation

{$R *.DFM}

// Функция, график которой надо построить

Function f(x:real):real;

Begin

f:=2*Sin(x)*exp(x/5) ;

end;

// строит график функции

procedure GrOfFunc;

var x1,x2:real; // границы изменения аргумента функции

y1,y2:real; // границы изменения значения функции

х:real; // аргумент функции

у:real; // значение функции в точке х

dx:real; // приращение аргумента

l,b:integer; // левый нижний угол области вывода графика

w,h:integer; // ширина и высота области вывода графика

mx,my:real; // масштаб по осям X и Y

х0,у0:integer; // точка — начало координат

Begin

// область вывода графика

l:=10; // X — координата левого верхнего угла

b:=Forml.ClientHeight-20;

//У — координата левого верхнего угла

h:=Forml.ClientHeight-40; // высота

w:=Forml.Width-40; // ширина

x1:=0; // нижняя граница диапазона аргумента

х2:=25; // верхняя граница диапазона аргумента

dx:=0.01; // шаг аргумента

// найдем максимальное и минимальное значения

// функции на отрезке [x1,x2]

y1:=f(xl); // минимум

y2:=f(xl); //максимум

x:=x1;

Repeat

У := f (х);

if у < yl then yl:=y;

if у > у 2 then y2:=y;

х:=x+dx; until (x >= х2);

// вычислим масштаб

my:=h/abs(y2-yl); // масштаб по оси Y

mx:=w/abs(x2-xl); // масштаб по оси X

х0:=1; у0:=b-Abs(Round(y1*my)) ;

with form1.Canvas do begin

// оси

MoveTo(l,b);LineTo(l,b-h); MoveTo(x0,y0);LineTo(x0+w,y0);

TextOut(l+5,b-h,FloatToStrF(y2,ffGeneral,6,3)); TextOut(l+5,b,FloatToStrF(yl,ffGeneral,6,3));

// построение графика

x:=xl; repeat

y:=f(x); Pixels[x0+Round(x*mx),y0-Round(y*my)]:=clRed;

x:=x+dx;

until (x >= x2);

end; end;

procedure TForm1.FormPaint(Sender: TObject);

begin GrOfFunc; end;

// изменился размер окна программы

procedure TForm1.FormResize(Sender: TObject);

Begin

// очистить форму

forml.Canvas.FillRect(Rect(0,0,ClientWidth,ClientHeight));

// построить график

GrOfFunc;

End ; end .

Основную работу выполняет процедура GrOfFunc, которая сначала вычисляет максимальное (у2) и минимальное (yl) значения функции на отрезке [x1l,x2]. Затем, используя информацию о ширине (Forml.Clientwidth -40) и высоте (Form1.ClientHeight - 40) области вывода графика, вычисляет масштаб по осям X (mх) иY(mу).

Высота и ширина области вывода графика определяется размерами рабочей (клиентской) области формы, т. е. без учета области заголовка и границ. После вычисления масштаба процедура вычисляет координату у горизонтальной оси (уо) и вычерчивает координатные оси графика. Затем выполняется непосредственное построение графика (рис.10).

Вызов процедуры GrOfFunc выполняют процедуры обработки событий onPaint и onFormResize. Процедура TForm1. FormPaint обеспечивает вычерчивание графика после появления формы на экране в результате запуска программы, а также после появления формы во время работы программы, например, в результате удаления или перемещения других окон, полностью или частично перекрывающих окно программы. Процедура TForm1.FormResize обеспечивает вычерчивание графика после изменения размера формы.

 

Рис. 10. График, построенный процедурой GrOfFunc

 

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

Примечание

Рассмотренная программа работает корректно, если функция, график которой надо построить, принимает как положительные, так и отрицательные значения. Если функция во всем диапазоне только положительная или только отрицательная, то в программу следует внести изменения. Какие — пусть это будет упражнением для читателя.

Вывод иллюстраций

Наиболее просто вывести иллюстрацию, которая находится в файле с расширением bmp, jpg или ico, можно при помощи компонента image, значок которого находится на вкладке Additional палитры (рис. 11).

 

 

Рис. 11. Значок компонента Image

 

В табл. 8 перечислены основные свойства компонента image.

 

Таблица 8. Свойства компонента image

Свойство

Определяет

Picture Width, Height     AutoSize   Strech     Visible

Иллюстрацию, которая отображается в поле компонента Размер компонента. Если размер компонента меньше размера иллюстрации, и значение свойств AutoSize и strech равно False, то отображается часть иллюстрации Признак автоматического изменения размера компонента в соответствии с реальным размером иллюстрации Признак автоматического масштабирования иллюстрации в соответствии с реальным размером компонента. Чтобы было выполнено масштабирование, значение свойства AutoSize должно быть False Отображается ли компонент, и, соответственно, иллюстрация, на поверхности формы

 

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

Во время разработки формы иллюстрация задается установкой значения свойства picture путем выбора файла иллюстрации в стандартном диалоговом окне, которое появляется в результате щелчка на командной кнопке Load окна Picture Editor (рис. 12). Чтобы запустить Image Editor, нужно в окне Object Inspector выбрать свойство Picture и щелкнуть на кнопке с тремя точками.

Если размер иллюстрации больше размера компонента, то свойству strech нужно присвоить значение True и установить значения свойств width и Height пропорционально реальным размерам иллюстрации.

Чтобы вывести иллюстрацию в поле компонента image во время работы программы, нужно применить метод LoadFromFile к свойству Picture, указав в качестве параметра имя файла иллюстрации. Например, инструкция

Form1.Image1.Picture.LoadFromFile('e:\temp\bart.bmp')

загружает иллюстрацию из файла bart.bmp и выводит ее в поле вывода иллюстрации (imagel).

Метод LoadFromFile позволяет отображать иллюстрации различных графических форматов: BMP, WMF, JPEG (файлы с расширением jpg).

Следующая программа, ее текст приведен в листинге 6, использует компонент image для просмотра иллюстраций, которые находятся в указанном пользователем каталоге. Диалоговое окно программы приведено на рис. 13.

 

Рис. 12. Окно Picture Editor                         Рис. 13. Слайд-проектор

Листинг 6. Слайд-проектор

Unit shpic_;

Interface

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

Dialogs, ExtCtrls, StdCtrls, Menu

Type

TForm1 = class(TForm) Image1: ТImage;

Button1: TButton;

procedure FormActivate(Sender: TObject);

procedure ButtonlClick(Sender: TObject);

Private

{ Private declarations }

Public

{ Public declarations }

end;

var Form1: TForm1;

aSearchRec : TSearchRec;

aPath : String; // каталог, в котором находятся иллюстрации

aFile : String; // файл иллюстрации

iw,ih: integer; // первоначальный размер компонента Image

Implementation

$R *.DFM}

// изменение размера области вывода иллюстрации

// пропорционально размеру иллюстрации

Procedure Scalelmage;

Var pw, ph : integer; // размер иллюстрации

scaleX, scaleY : real; // масштаб по Х и Y

scale : real; // общий масштаб

Begin

// иллюстрация уже загружена, получим ее размеры

pw := Form1.Image1.Picture.Width; ph := Form1.Image1.Picture.Height;

if pw > iw // ширина иллюстрации больше ширины компонента Image

then scaleX := iw/pw // нужно масштабировать

else scaleX := 1;

if ph > ih // высота иллюстрации больше высоты компонента

then scaleY := ih/ph // нужно масштабировать

elsescaleY := 1;

// выберем наименьший коэффициент

if scaleX < scaleY then scale := scaleX else scale := scaleY;

// изменим размер области вывода иллюстрации

Form1.Image1.Height := Round(Form1.Image1.Picture.Height*scale)

Form1.Image1.Width := Round(Form1.Image1.Picture.Width*scale);

// т. к. Strech = True и размер области пропорционален

// размеру картинки, то картинка масштабируется без искажений

end;

// вывести первую иллюстрацию

Procedure FirstPicture;

var r : integer; // результат поиска файла

Begin

aPath := 'f:\temp\';

r := FindFirst(aPath+'*.bmp',faAnyFile,aSearchRec);

if г = 0 then begin // в указанном каталоге есть bmp-файл

aFile := aPath + aSearchRec.Name;

Form1.Image1.Picture.LoadFromFile(aFile); // загрузить иллюстрацию

Scalelmage; //-установить размер компонента

Image r := FindNext(aSearchRec); // найти следующий файл

If r = 0 then // еще есть файлы иллюстраций

Forml.Button1.Enabled := True;

end;  end;

// вывести следующую иллюстрацию

Procedure NextPicture();

Var r : integer;

Begin

aFile := aPath + aSearchRec.Name;

Forml.Image1.Picture.LoadFromFile(aFile);

Scalelmage;

// подготовим вывод следующей иллюстрации

r := FindNext(aSearchRec); // найти следующий файл

if r<>0 then Forml.Buttonl.Enabled := False; // больше нет иллюстраций

end;

procedure TForml.FormActivate(Sender: TObject);

Begin

Image1.AutoSize := False; // запрет автоизменения размера компонента

Image1.Stretch := True; // разрешим масштабирование

// запомним первоначальный размер области вывода иллюстрации

iw := Imagel.Width; in := imagel.Height;

Button1.Enabled := False; // сделаем недоступной кнопку Дальше

FirstPicture; // вывести первую иллюстрацию

end ;

//щелчок на кнопке Дальше

Procedure TForm1.Button1Click(Sender: TObject);

Begin

NextPicture;

End;end.

Программа выполняет масштабирование выводимых иллюстраций без искажения, чего нельзя добиться простым присвоением значения True свойству strech. Загрузку и вывод первой и остальных иллюстраций выполняют соответственно процедуры FirstPicture и NextPicture. Процедура FrirstPicture использует функцию FindFirst для того, чтобы получить имя первого BMP-файла. В качестве параметров функции FindFirst передаются:

- имя каталога, в котором должны находиться иллюстрации;

- структура asearchRec, поле Name которой, в случае успеха, будет содержать имя файла, удовлетворяющего критерию поиска;

- маска файла иллюстрации.

Если в указанном при вызове функции FindFirst каталоге есть хотя бы один BMP-файл, значение функции будет равно нулю. В этом случае метод LoadFromFiie загружает файл иллюстрации, после чего вызывается функция scaieimage, которая устанавливает размер компонента пропорционально размеру иллюстрации. Размер загруженной иллюстрации можно получить, обратившись к свойствам Form1.Image1.Picture.Width и Form1.Шmage1.Picture.Height, значения которых не зависят от размера компонента Image.

Битовые образы

При работе с графикой удобно использовать объекты типа TBitMap (битовый образ). Битовый образ представляет собой находящуюся в памяти компьютера, и, следовательно, невидимую графическую поверхность, на которой программа может сформировать изображение. Содержимое битового образа (картинка) легко и, что особенно важно, быстро может быть выведено на поверхность формы или области вывода иллюстрации (image). Поэтому в программах битовые образы обычно используются для хранения небольших изображений, например, картинок командных кнопок.

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

Например, если в программе объявлена переменная pic типа TBitMap, то после выполнения инструкции pic. LoadFromFiie('е:\ images\ aplane. bmp')

битовый образ pic будет содержать изображение самолета.

Вывести содержимое битового образа (картинку) на поверхность формы или области вывода иллюстрации можно путем применения метода Draw к соответствующему свойству поверхности (canvas). Например, инструкция Image1.Canvas.Draw(x,у, bm)

выводит картинку битового образа bm на поверхность компонента image 1 (параметры х и у определяют положение левого верхнего угла картинки на поверхности компонента).

Если перед применением метода Draw свойству Transparent объекта TBitMap присвоить значение True, то фрагменты рисунка, окрашенные цветом, совпадающим с цветом левого нижнего угла картинки, не будут выведены — через них будет как бы проглядывать фон. Если в качестве "прозрачного" нужно использовать цвет, отличный от цвета левой нижней точки рисунка, то свойству Transparentcoior следует присвоить значение символьной константы, обозначающей необходимый цвет.

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

Листинг 7. Использование битовых образов

unit aplanes_; interface

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

Type

TForml = class(TForm)

procedure FormPaint(Sender: TObject);

Private

{ Private declarations }

Public

{ Public declarations }

end;

var Forml: TForm1;

sky,aplane: TBitMap; // битовые образы: небо и самолет

Implementation

($R *.DFM}

procedure TForm1.FormPaint(Sender: TObject);

Begin

// создать битовые образы

sky := TBitMap.Create; aplane := TBitMap.Create;

// загрузить картинки

sky.LoadFromFile('sky.bmp');

aplane.LoadFromFile('aplane.bmp') ;

Form1.Canvas.Draw(0,0,sky); // отрисовка фона

Form1.Canvas.Draw(20,20,aplane); // отрисовка левого самолета

aplane.Transparent:=True;

// теперь элементы рисунка, цвет которых совпадает с цветом левой нижней точки

// битового образа, не отрисовываются

 Form1.Canvas.Draw(120,20,aplane); // отрисовка правого самолета

// освободить память

sky.free; aplane.free;

end;

End.

После запуска программы в окне приложения (рис. 14) появляется изображение летящих на фоне неба самолетов. Фон и изображение самолета -битовые образы, загружаемые из файлов. Белое поле вокруг левого самолета показывает истинный размер картинки битового образа aplane. Белое поле вокруг правого самолета отсутствует, т. к. перед его выводом свойству Transparent битового образа было присвоено значение True.

Рис. 14. Влияние значение свойства Transparent на вывод изображения

Мультипликация

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

Как было показано выше, рисунок может быть сформирован из графических примитивов (линий, окружностей, дуг, многоугольников и т. д.). Обеспечить перемещение рисунка довольно просто: надо сначала вывести рисунок на экран, затем через некоторое время стереть его и снова вывести этот же рисунок, но уже на некотором расстоянии от его первоначального положения. Подбором времени между выводом и удалением рисунка, а также расстояния между старым и новым положением рисунка (шага перемещения), можно добиться того, что у наблюдателя будет складываться впечатление, что рисунок равномерно движется по экрану.

Следующая простая программа, текст которой приведен в листинге 8, а вид формы — на рис. 15, демонстрирует движение окружности от левой к правой границе окна программы.

Рис. 15. Форма программы Движущаяся окружность

Листинг 8. Движущаяся окружность

unit mcircle_;

Interface

uses Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs, ExtCtrls, StdCtrls;

Type

TForm1 = class(TForm) Timer1: TTimer;

procedure Timer1Timer(Sender: TObject};

procedure FormActivate(Sender: TObject);

private

{ Private declarations }

public

{ Public declarations }

end;

implementation

{$R *.DFM}

Var Form1: TForml;

x,y: byte; // координаты центра окружности

dx: byte; // приращение координаты x при движении окружности

// стирает и рисует окружность на новом месте

procedure Ris;

begin

// стереть окружность

form1.Canvas.Pen.Color:=form1.Color; form1.Canvas.Ellipse(x,y,x+10,y+10);

x:=x+dx;

// нарисовать окружность на новом месте

form1.Canvas.Pen.Color:=clBlack; form1.Canvas.Ellipse(x,y, x+10, y+10) ;

end;

// сигнал от таймера

procedure TForm1.Timer1Timer(Sender: TObject);

begin Ris; end;

procedure TForm1.FormActivate(Sender: TObject);

begin

x:=0; y:=10; dx:=5; timer1.Interval:=50;

// период возникновения события OnTimer —0.5 сек

form1.canvas.brush.color:=forml.color;

end; end.

Основную работу выполняет процедура Ris, которая стирает окружность и выводит ее на новом месте. Стирание окружности выполняется путем перерисовки окружности поверх нарисованной, но цветом фона.

Для обеспечения периодического вызова процедуры Ris в форму программы добавлен невизуальный компонент Timer (таймер), значок которого находится на вкладке System палитры компонентов (рис. 16). Свойства компонента Timer, перечислены в табл. 9.

Рис. 16. Значок компонента Timer

Таблица 9. Свойства компонента Timer

Свойство	Определяет
Name Interval   Enabled	Имя компонента. Используется для доступа к компоненту Период генерации события OnTimer. Задается в миллисекундах Разрешение работы. Разрешает (значение True) или запрещает (значение False) генерацию события OnTimer

 

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

Компонент Timer генерирует событие OnTimer. Период возникновения события OnTimer измеряется в миллисекундах и определяется значением свойства Interval. Следует обратить внимание на свойство Enabled. Оно дает возможность программе "запустить" или "остановить" таймер. Если значение свойства Enabled равно False, то событие OnTimer не возникает.

Событие onTimer в рассматриваемой программе обрабатывается процедурой TimeriTimer, которая, в свою очередь, вызывает процедуру Ris. Таким образом, в программе реализован механизм периодического вызова процедуры Ris.

Примечание

Переменные х, у (координаты центра окружности) и dx (приращение координаты х при движении окружности) объявлены вне процедуры Ris, т. е. они являются глобальными. Поэтому надо не забыть выполнить их инициализацию (в программе инициализацию глобальных переменных реализует процедура FormActivate).

Метод базовой точки

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

1. Выбирается некоторая точка изображения, которая принимается за базовую.

2. Координаты остальных точек отсчитываются от базовой точки.

3. Если координаты точек изображения отсчитывать от базовой в относительных единицах, а не в пикселах, то обеспечивается возможность масштабирования изображения.

На рис. 17 приведено изображение кораблика. Базовой точкой является точка с координатами (X₀ Y₀). Координаты остальных точек отсчитываются именно от этой точки.

 

 

Рис. 17. Определение координат изображения относительно базовой точки

В листинге 9 приведен текст программы, которая выводит на экран изображение перемещающегося кораблика.

Листинг 9. Кораблик

unit ship_;

Interface

uses Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls, ExtCtrls;

Type

TForm1 = class(TForm)

Timer1: TTimer;

procedure Timer1Timer(Sender: TObject);

procedure FormActivate(Sender: TObject);

Private

{ Private declarations } public

{ Public declarations } end;

Var Form1: TForm1;

x,y: integer; // координаты корабля (базовой точки)

Implementation

{$R *.DFM}

// вычерчивает кораблик

procedure Titanik(x,y: integer; // координаты базовой точки

color: TColor); // цвет корабля

const dx = 5; dy = 5;

var buf: TColor;

Begin

with form1.canvas do begin

buf:=pen.Color; // сохраним текущий цвет

pen.Color:=color;

// установим нужный цвет

// рисуем . . .

// корпус

MoveTo(x,y);

LineTo(x,y-2*dy) ; LineTo (x+10*dx, y-2*dy) ;

LineTo (x+ll*dx, y-3*dy) ; LineTo (x+17*dx,y-3*dy) ;

LineTo (x+14*dx, y) ; LineTo (x,y) ;

// надстройка

MoveTo(x+3*dx,y-2*dy) ;

LineTo (x+4*dx, y-3*dy) ; LineTo (x+4*dx, y-4*dy) ;

LineTo (x+13*dx,y-4*dy) ; LineTo (x+13*dx, y-3*dy) ;

MoveTo(x+5*dx,y-3*dy) ; LineTo (x+9*dx, y-3*dy) ;

// капитанский мостик

Rectangle (x+8*dx, y-4*dy, x+ll*dx, y-5*dy)

// труба

Rectangle (x+7*dx, y-4*dy, x+8*dx, y-7*dy) ;

// иллюминаторы

Ellipse (x+ll*dx,y-2*dy,x+12*dx,y-l*dy) ;

Ellipse (x+13*dx, y-2*dy, x+14*dx, y-l*dy) ;

// мачта

MoveTo(.x+10*dx,y-5*dy) ; LineTo(x+10*dx,y-10*dy);

// оснастка

MoveTo(x+17*dx,y-3*dy);

LineTo(x+10*dx,y-10*dy); LineTo(x,y-2*dy);

pen.Color:=buf; // восстановим старый цвет карандаша

end; end;

// обработка сигнала таймера

procedure TForm1.Timer1Timer(Sender: TObject);

Begin

Titanik(x,y,form1.color); // стереть рисунок

if x < Form1.ClientWidth then x := x+5

else begin // новый рейс x := 0;

у := Random(50) + 100;

end;

Titanik(x,у,clWhite); // нарисовать в новой точке end;

procedure TForml.FormActivate(Sender: TObject);

Begin

x:=0; y:=100;

Form1.Color:=clNavy;

Timerl.Interval := 50; // сигнал таймера каждые 50 миллисекунд

end;

End.

 

Отрисовку и стирание изображения кораблика выполняет процедура Titanik, которая получает в качестве параметров координаты базовой точки и цвет, которым надо вычертить изображение кораблика. Если при вызове процедуры цвет отличается от цвета фона формы, то процедура рисует кораблик, а если совпадает — то "стирает". В процедуре Titanik объявлены константы dx и dy, определяющие шаг (в пикселах), используемый при вычислении координат точек изображения. Меняя значения этих констант, можно проводить масштабирование изображения.

⇐ Предыдущая123456789Следующая ⇒

Поделиться: