Занятие 6. Начинаем рисовать
Многие классы в Delphi, такие, например, как форма, класс TPaintBox и некоторые другие имеют встроенное свойство Canvas(холст, канва), которое само является объектом и содержит свойства и методы, позволяющие рисовать в окне линии, фигуры, задавать цвета линий, заливать фигуры цветом.
Изображение формируется с помощью точек, пикселов, каждая такая точка имеет цвет и координаты. Начало системы координат располагается в левом верхнем углу окна. Координаты точки определяются двумя числами, задающими смещение точки по горизонтали и вертикали относительно начала координат (см. рисунок).
Но мы не будем рисовать линии, фигуры по точкам, для этого мы будем использовать готовые свойства и методы холста, класса TCanvas.
Рисование линий
Метод MoveTo – установить курсор в заданную позицию экрана. Синтаксис:
procedure MoveTo(X, Y: Integer); Где X и Y – координаты точки.
Например: Canvas.MoveTo(0,0);
Метод LineTo – провести линию из текущей позиции курсора в заданную точку. Синтаксис: procedure LineTo(X, Y: Integer); где X,Y – координаты точки.
Метод работает совместно с методом MoveTo.
Например:
Canvas.MoveTo(0,0); { устанавливает курсор в точку с координатами 0,0 }
Canvas.LineTo(100,100); {провести линию в точку с координатами 100,100 }
Оператор With
Для того, чтобы не повторять имя объекта в каждой строке кода можно использовать оператор with. Например, тот же самый код можно написать с использованием with таким образом:
with Canvas do
begin
MoveTo(0,0);
LineTo(100,100);
end;
Свойство Pen(карандаш)
Свойство Pen позволяет задать цвет и тип линии. Свойство Pen – это вложенный в Canvas объект со своими свойствами.
Свойства класса TPen
Свойство | Описание |
Color | Задает цвет линии, границы фигуры |
Mode | Задает, как взаимодействует цвет карандаша и цвет холста |
Style | Задает стиль границы |
PenPos | Задает текущую позицию карандаша |
Width | Задает ширину границы |
Для задания стиля (свойства Style) используются следующие константы:
psSolid - непрерывная линия;
psDash - прерывистая линия;
psDot - линия из серии точек;
psDashDot – линия, состоящая из комбинации линий и точек;
psDashDotDot - линия, состоящая из комбинации линии, точки, точки;
psClear - нет линии, границы.
Для задания ширины линии (свойство Width) используются целые положительные числа. Ширина линии влияет на стиль линии.
Например:
with canvas do
begin
pen.Style:=psSolid;
pen.Width:=5;
pen.Color:=clRed;
moveto(50,50);
lineto(300,300);
end;
Для задания цвета можно использовать константы, например clRed – красный , clBlue – синий, и т.д.
Задание цвета
Цвет объекта можно задавать тремя способами.
- С помощью предопределенных констант:
Константа | Цвет |
clWhite | Белый |
clBlack | Черный |
clRed | Красный |
Например, названия констант, обозначающих цвета, хорошо видны в свойстве Color формы.
- С помощью шестнадцатеричных констант, например:
$00FF0000 – голубой цвет,
$0000FF00 – зеленый цвет,
$000000FF – красный цвет,
$00000000 – черный,
$00FFFFFF – белый.
Где первые две цифры (слева направо) всегда нули, вторые две цифры – задают интенсивность голубого цвета от 00 до FF(256), две третьи цифры – задают интенсивность зеленого цвета, последние две цифры – задают интенсивность красного цвета.
Пример1:
var
col1:TColor;
col1:=$AB00CC;
Цвет col1 – это будет смешение голубого и красного цвета.
- С помощью функции RGB.
Функция возвращает цвет, значение типа TColor, который является смешением трех цветов: красного, зеленого и голубого. Первый аргумент задает интенсивность красного цвета, второй - задает интенсивность зеленого цвета, третий – интенсивность голубого цвета. Интенсивность задается числом от 0 до 256.Синтаксис функции:
function RGB(r:byte,g:byte,b:byte):TColor;
Например:
var r,b,g:byte;
col:TColor;
…
r:=56; b:=245; g:=25;
col:=RGB(r,g,b);
with Canvas do
begin
Pen.Color:=col;
MoveTo(50,40);
LineTo(100,250);
End;
Рисование фигур
Метод Ellipse – позволяет нарисовать эллипс, вписанный в прямоугольник, заданный координатами своих вершин. Синтаксис:
procedure Ellipse(X1, Y1, X2, Y2: Integer);
Где X1, Y1 – координаты левого верхнего угла прямоугольника
X2, Y2 – координаты правого нижнего угла прямоугольника
Пример:
Ellipse(50,50,200,250);
Метод Rectangle –позволяет нарисовать прямоугольник, заданный координатами своих вершин. Синтаксис:
procedure Rectangle(X1, Y1, X2, Y2: Integer);
Где X1, Y1 – координаты левого верхнего угла прямоугольника;
X2, Y2 – координаты правого нижнего угла прямоугольника.
Для задания границы прямоугольника используется свойство Pen, для задания цвета заполнения используется свойство Brush(кисть).
Для рисования прямоугольника со скругленными углами используется свойство RoundRect. Например, нарисовать прямоугольник зеленого цвета с желтой границей:
With canvas do
Begin
Pen.Color:=clYellow;
Brush.Color:=clRed;
Rectangle(50,20,200,150);
End;
Свойство Brush –это объект, со своими свойствами и методами, который позволяет задать цвет заполнения фигуры, стиль заполнения.
Свойства класса TBrush
Свойство | Описание |
Color | Цвет |
Style | Стиль |
Для задания стиля используются следующие константы:
bsSolid - сплошное заполнение
bsClear - нет заполнения
bsBDiagonal и bsFDiagonal – диагональная штриховка
bsCross - поперечная штриховка
bsDiagCross - диагонально-поперечная штриховка
bsHorizontal- горизонтальная штриховка
bsVertical – вертикальная штриховка
Например, заполнить прямоугольник с синей границей штриховкой желтого цвета:
with canvas do
begin
brush.Style:=bsDiagCross;
brush.Color:=clYellow;
pen.Color:=clBlue;
pen.Width:=6;
rectangle(100,100,200,200);
end;
Метод RoundRect –прямоугольник со скругленными углами. Синтаксис:
procedure RoundRect(X1, Y1, X2, Y2, X3, Y3: Integer);
Где X1, Y1, X2, Y2 – координаты вершин прямоугольника.
X3 – задает ширину и Y3 – задает высоту скругления.
Например:
RoundRect(200,150,250,200,10,20);
Метод Pie –используется для рисования сегмента эллипса, заданного прямоугольником с координатами X1,Y1, X2,Y2. Сегмент определяется двумя линиями, соединяющими центр эллипса с точками с координатами X3,Y3,X4,Y4. Синтаксис:
procedure Pie(X1, Y1, X2, Y2, X3, Y3, X4, Y4: Longint);
Например:
pie(100,300,200,400,200,370,180,300);
Метод FloodFill –используется для заполнения замкнутой области цветом, задаваемым кистью (Brush). Синтаксис:
procedure FloodFill(X, Y: Integer; Color: TColor; FillStyle: TFillStyle);
Заполнение начинается с точки с координатами X и Y. Каким образом будет происходить заполнение, определяет параметр FillStyle – стиль заполнения. FillStyle может иметь два значения, описанных в таблице.
Значение | Описание |
fsSurface | Область заполняется до тех пор, пока в ней присутствует цвет, заданный параметром Color |
fsBorder | Область, которая будет заполнена, ограничена цветом, задаваемым параметром Color |
Пример1.Нарисовать треугольник красного цвета с зеленой границей:
with canvas do
begin
pen.Width:=3;
pen.Color:=clGreen;
brush.Color:=clRed;
MoveTo(200,100);
LineTo(100,200);
LineTo(300,200);
LineTo(200,100);
FloodFill(200,150,clGreen,fsBorder);
end;
То, что получится, вы видите на рисунке:
Пример 2.Нарисовать треугольник, заполненный красным цветом, с границей красного цвета.
with canvas do
begin
pen.Width:=3;
pen.Color:=clRed;
brush.Color:=clRed;
MoveTo(200,50);
LineTo(100,200);
LineTo(300,200);
LineTo(200,50);
FloodFill(200,150,clRed,fsBorder);
end;
Вывод текста
С помощью метода TextOut можно вывести строку, начиная с точки с координатами X,Y. Текст выводится с помощью текущего шрифта. Синтаксис метода:
procedure TextOut(X, Y: Integer; const Text: string);
Где Text – задает строку, которую необходимо вывести
X,Y – координаты точки, откуда выводить.
Например: TextOut(50,50,‘Привет’);