Элементы управления для работы с графикой
Элемент управления для вставки рисунка (PictureBox)
Пример 4.3.
Создать проект, разместить в нем фоновое изображение на форме. При нажатии на кнопку поверх фонового изображения должно появиться другое изображение.
Этапы выполнения задания
Установить размеры формы Height = 450, Width = 670.
Загрузить фоновое изображение для формы. Задать для свойства формы BackgroundImageLayout значение Stretch.
Поместить на форму компонент изображение и кнопку.
Для компонента PictureBox установить значение для свойства Visible = False (изображение невидимо при запуске приложения). Размеры Height = 120, Width = 200. Свойство SizeMode = StretchImage.
Загрузить изображение в компонент PictureBox. Изображение может быть формата PNG, или GIF с прозрачным фоном, или формата BMP с фоном однородного цвета. Свойство BackColor = Transparent.
Написать обработчик события OnClick для компонента Button1. Если при запуске приложения изображение мерцает, то устранить мерцание можно с помощью включения двойной буферизации:
DoubleBuffered := true;
Эта команда должна быть прописана в обработчике события Load для формы.
procedure Form1.button1_Click (sender: Object; e: EventArgs);
begin
PictureBox2.Top := 220;
var rnd: Random := new Random();
PictureBox2.Left := rnd.
Next(300);
PictureBox2.Visible := True;
end;
Построение графиков функций
Пример 4.5
Создать проект и построить график функции y=x*sin(x) на промежутке, заданном пользователем.
Этапы выполнения задания
Поместить на форму компоненты: PictureBox, два компонента Label, два компонента TextBox и компонент Button.
Изменить свойства Text у компонентов Label1, Label2 на x0 и xn соответственно.
Изменить свойства Text у компонентов Edit1 и Edit2 на –20 и 20 соответственно.
Изменить свойства Text у компонента Button1 на «Построить график».
Написать обработчик события Click для компонента Button1 и строить в нем график функции по точкам.
Нарисовать оси координат в виде двух перпендикулярных линий, пересекающихся в центре компонента PictureBox.
Чтобы получить видимость сплошной линии, количество точек, которые образуют график функции, должно быть не менее 10 000 (n = 10 000).
Шаг изменения значения x определяется как h=(xn-x0)/n
При построении нужно учитывать масштаб: ширина компонента PictureBox должна соответствовать длине заданного промежутка. Тогда масштабный коэффициент можно рассчитать по формуле k=PictureBox1.Width/(xn-x0)
Поскольку расположение осей координат на экране не совпадает с расположением осей, принятым в математике, то нужно преобразовать координаты: точке (0; 0) должна соответствовать точка в центре компонента PictureBox. Для этого полученное значение x нужно увеличить на величину cx=PictureBox1.Width div 2, а значение у на cy=PictureBox1.Height div 2. Так как ось Y направлена вниз, а не вверх, то у значения Y нужно еще поменять знак на противоположный. На канве будет закрашиваться точка с координатами (xekr= x*k+cx, yekr=–y*k+cy).
Необходимo учитывать, что при вычислении значения x и y будут вещественными, а значения графических координат могут быть только целыми. Поэтому перед прорисовкой точки нужно преобразовать вещественные числа в целые с помощью функции trunc.
Некоторые точки графика при построении могут оказаться за пределами графической области, поэтому необходима проверка значения y1: значение должно быть неотрицательным и меньше высоты графической области.
procedure Form1.button1_Click (sender: Object; e: EventArgs);
var x, y, h, k, x0, xn :real;
x1, y1, n, c_x, c_y : integer;
gr: Graphics;
bm: Bitmap;
p_c: Pen;
begin
//подготовка графической области
//для рисования по пикселям
bm:=new Bitmap (PictureBox1.Width, Picturebox1.Height);
pictureBox1.Image:=(Image)(bm);
gr:=Graphics.FromImage(pictureBox1.Image);
//закраска графической области
//белым цветом
gr.Clear(Color.White);
//количество точек
n:=10000;
//концы промежутка
x0:=StrToFloat(TextBox1.Text);
xn:=StrToFloat(TextBox2.Text);
// центр области построения
c_x:=PictureBox1.Width div 2;
c_y:=PictureBox1.Height div 2;
// масштабный коэффициент
k:=PictureBox1.Width/(xn-x0);
// шаг
h:=(xn-x0)/n;
x:=x0;
//оси
p_c:=new Pen(Color.Black,1);
gr.DrawLine(p_c,0,c_y,2*c_x,c_y);
gr.DrawLine(p_c,c_x,0,c_x,2*c_y);
for var i := 1 to n do
begin
y:=x*sin(x);
x1:=trunc(x*k)+c_x;
y1:= trunc(-y*k)+c_y;
//проверка попадания точки
//в графическую область
if (y1 >= 0) and (y1 < 2*c_y) then
bm.SetPixel(x1,y1,Color.Blue);
x:=x+h;
end;
end;
Построение диаграмм
Пример 4.6
Этапы выполнения задания
Поместить на форму компоненты: PictureBox и два компонента Button.
Изменить свойства Text у компонента Button1 на «Диаграмма с константными данными».
Изменить свойства Text у компонента Button2 на «Диаграмма со случайными данными».
Написать обработчик события Click для компонента Button1, в котором диаграмма строится с помощью прямоугольников.
Найти максимальный элемент в массиве max.
Рассчитать масштабный коэффициент: m=PictureBox1.Heigth/max.
В цикле строить n прямоугольников одинаковой ширины. Ширина прямоугольника h= PictureBox1.Width/(2n+1)
Обработчик для компонента Button2 будет отличаться от обработчика для компонента Button1 только способом получения элементов массива.
Массив должен быть описан в разделе var: a: array[1..10] of integer;
Элементы массива со значениями от 20 до 100 можно получать следующим образом:
rnd := new Random();
for i := 1 to n do
a[i] := rnd.next(80)+20;
procedure Form1.button1_Click (sender: Object; e: EventArgs);
const a: array[1..10] of integer =
(10,14,22,75,63,12,37,61,42,48);
n = 10;
var max, x, y1, y2, h, i, cr, cg,
cb : integer;
m : real;
gr : Graphics;
rnd : Random;
sb : SolidBrush;
begin
max := a[1];
for i := 2 to n do
if a[i] > max then
max := a[i];
h:=trunc(PictureBox1.Width/(2*n+1));
m := PictureBox1.Height / max;
x := h;
//подготовка графической области
//для рисования примитивов
gr:=PictureBox1.CreateGraphics;
gr.Clear(Color.White);
rnd := new Random();
for i := 1 to n do
begin
cr := rnd.next(256);
cg := rnd.next(256);
cb := rnd.next(256);
sb := new SolidBrush(Color.FromArgb(cr,cg,cb));
y1 := PictureBox1.Height -1;
y2 := y1 - trunc(a[i] * m)-1;
gr.FillRectangle(sb,x,y2,h,y1);
x := x + 2 * h;
end;
end;
Анимация
Пример 4.8
Создать проект, в котором самолет будет пролетать над городом.
Этапы выполнения задания
Поместить на форму компоненты PictureBox и Button, добавить компонент Timer.
Загрузить изображение города в компонент как фон формы (свойство формы BackgroundImage).
Установить прозрачный цвет фона для компонента PictureBox1 (значение Transparent у свойства BackColоr). Установить режим изменения размера - AutoSize (свойство SizeMode).
Написать обработчик события Load для формы и описать начальное положение самолета, указав координаты верхнего левого угла PictureBox1 за пределами формы. Загрузить в PictureBox1 изображение из файла с рисунком самолета.
Изменить свойства Text у компонента Button1 на «Полетели!».
Установить значение False у свойства таймера Enabled в инспекторе объектов.
Установить в инспекторе объектов время срабатывания таймера, равным 10.
Написать обработчик события Click для компонента Button1, запустить таймер.
В инспекторе объектов установить прозрачность для компонента PictureBox1.
Написать обработчик события Tick и менять в нем значение свойства Left у компонента PictureBox1. Если самолет вылетел за границу, то вернуть его в начальное положение.
Двойная буферизация позволяет сделать анимацию более плавной, поскольку все операции рисования сначала выполняются в памяти, а лишь затем на экране компьютера. После завершения всех операций рисования
procedure Form1.Form1_Load (sender: Object; e: EventArgs);
begin
PictureBox1.Load ('plane.png');
x := -PictureBox1.Width;
y := 20;
PictureBox1.Left := x;
PictureBox1.Top := y;
end;
procedure Form1.button1_Click (sender: Object; e: EventArgs);
begin
Timer1.Enabled := True;
end;
procedure Form1.timer1_Tick (sender: Object; e: EventArgs);
begin
x := x + 1;
PictureBox1.Left := x;
if PictureBox1.Left > Width +
+ PictureBox1.Width then
x := -PictureBox1.Width;
end;
Упражнения
Добавьте в проект из примера 4.3. еще одно животное (например, белку). Для размещения белки нужно добавить еще одну кнопку. Местоположение определить случайным образом в верхушке какого-либо дерева.
Добавьте в проект 4.5 перечисленные возможности.
Оси координат со стрелками и подписями.
Единичный отрезок на оси X.
График функции y = 0,3x2 – 4x + 2 в той же системе координат красным цветом.
4. Постройте в одной системе координат графики следующих функций. Каждую кривую рисовать своим цветом. Для ввода значений параметров a, b и c добавьте на форму компоненты Text.
3. Измените проект из примера 4.6 так, чтобы строилась линейчатая диаграмма (столбики расположены горизонтально).
4*. Измените проект из примера 4.6 так, чтобы значения в массив можно было вводить. Для этого числа необходимо записывать в компонент TextBox, считывать строку из чисел и пробелов, выделять цифры и преобразовывать их в числовые значения.
5. Добавьте в проект из примера 4.8 кнопку «Стоп», при нажатии на которую самолет остановится.
*После остановки самолета должен появиться парашютист и опуститься вниз.
6*. Создайте анимацию движения Луны вокруг Земли. Для расчета координат верхнего левого угла PictureBox1, содержащего Луну, можно воспользоваться параметрическим уравнением окружности: x=Rsin(t), y=Rcos(t), где R — радиус, t — параметр, изменяющий свое значение от 0 до 2π.