Паскаль. Графика. Вводный урок.

Паскаль. Графика. Вводный урок.

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

Сначала некоторые основные сведения о графике и графических драйверах. В Паскале графические драйверы имеют расширение. BGI. Мы будем работать с драйвером EGAVGA. BGI. Само собой разумеется, что до начала работы, необходимо проверить наличие этого драйвера. Все драйвера располагаются по адресу *\BP\BGI, где вместо «*» идет адрес папки BP. Разрешение экрана стандартное – 640 на 480 точек, и его, к сожалению (а может и к радости), никак изменить не получится. Для того чтобы было удобнее работать с графикой, а точнее, строить разного рода изображения, можно обзавестись миллиметровой бумагой (или просто бумагой в клетку) и перед заданием координат в программе, предварительно прорисовывать все на этой бумаге. О том, что необходимо разметить бумагу, можно и не говорить – это должно быть и так понятно (при этом достаточно отметить только самые важные точки, например 0, 50, 100, 640). В этом случае технология «рисования» будет примерно следующей:

1. Построение изображений на бумаге в координатной плоскости.

2. Разметка основных координат.

3. Написание программы.

Еще стоит отметить, что начало координат располагается в левом верхнем углу экрана. Диагональ, идущая из начала координат, называется главной, а вторая – побочной.

Графический режим также как и текстовый, необходимо будет описать в блоке описания модулей (то есть написать Uses Graph;). Также для обеспечения работоспособности данного режима, необходимо в блоке описания переменных задать целочисленные переменные Gd и Gm. Подстановка значений в Gd обуславливает выбор графического драйвера, а в Gm – разрешения монитора. Значения этих переменных можно устанавливать автоматически (GD:=detect) или вручную. При установке значений вручную, можно экспериментировать (так, например, будет незначительно меняться, скажем, размер экрана), а лучше ставить значения Gd:=9; Gm:=2; Инициализация графики происходит через процедуру Initgraph (GD, GM,’..’); а закрытие при помощи CloseGraph соответственно. Кратко этот процесс совершается примерно таким образом.

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

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

Обычную точку можно поставить благодаря PutPixel (X, Y, C), где X – координата по горизонтали, Y – координата по вертикали, С – цвет.

Листинг : Описание

PutPixel (320, 240, 15);

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

Отрезок (точнее, простую линию) можно нарисовать, используя команду Line (X1,Y1, X2,Y2), где X1, Y1 – начальные координаты, а X2, Y2 – конечные. Небольшое отступление. Можно изобразить произвольный (главное, неразвернутый) угол, используя команду Line три раза, а можно переместить курсор в определенную точку экрана (это делается командой MoveTo (x, y)) и рисовать из нее линию командой LineRel (dx, dy), где dx, dy – смещения по осям. То есть это выглядеть будет примерно следующим образом:

Примечания:

1. Использован оператор ввода для того, чтобы можно было увидеть результат нашей деятельности. Можно было бы использовать комбинацию клавиш Alt+F5, но не надо забывать, что мы закрываем графический режим после выполнения программы, следовательно, уничтожаем результаты ее выполнения, именно поэтому для того, чтобы увидеть результат выполнения нашей программы, используем оператор ввода.

2. Если не использовать MoveTo, то начальной точкой будет автоматически считаться начало координат. Это в частности, а в общем – в случае, когда не указаны начальные координаты в некоторых случаях будет выводиться сообщение об ошибке, а в некоторых – точка (первая, начальная, единственная) будет помещена в начало координат.

Произвольный отрезок (изображен белым), созданный благодаря Line (x1,y1,x2,y2), будет выглядеть примерно следующим образом:

Стоит отметить, что если поменять местами координаты начальной и конечной точек, то рисунок не изменится.

Прямоугольник можно изобразить командой Rectangle (X1,Y1, X2, Y2) где X1, Y1 – координаты левого верхнего угла, а X2, Y2 – правого нижнего. Если, как и в примере с отрезком, поменять пары координат местами, ничего не изменится, потому что левый верхний угол будет занимать место правого нижнего и наоборот. Так выглядит произвольный прямоугольник:

Также еще из стандартных фигур можно рассказать про окружность – Circle (X, Y, R), где X, Y – координаты центра окружности, а R – радиус окружности. Блюдем традиции и создаем пример произвольной окружности:

В конце – эллипс. Ellipse (X, Y,S, E,XR, YR), где X, Y – координаты центра эллипса, XR, YR – радиусы по горизонтали и вертикали, S, E – начальный и конечный углы.

А так эллипс отобразится в Pascal'e

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

Кучу всего понарисовали, надо бы убрать. Очистка экрана теперь осуществляется оператором ClearDevice. ClrScr не будет работать, потому что относится к текстовому режиму.

Также меняется цвет фона и изображения. SetBKColor (C) – цвет фона. SetColor (C) – цвет изображения. Можно цвет задавать словом (например, green), а можно цифрой.

Графический режим предоставляет относительно широкие возможности в создании изображений. Так, например, можно устанавливать стиль линий: SetLineStyle (T, P,V), где Т – тип линии (0 – сплошная, 1 – штрихпунктирная, 2 – штриховая), Р – шаблон (обычно равен 0), V – толщина (1 – нормальная, 3 – большая).

Pascal позволяет также использовать заливку цветом (закрашивание). Закрасить можно только замкнутые фигуры (области), нарисованные по контуру одним и тем же цветом. Стиль заполнения устанавливается командой SetFillStyle (P, C), где С – цвет, а Р – маска (0 – заливка сплошным цветом фона, 1 – заливка сплошным текущим цветом, 2 – заливка «пунктиром», 3 – штрихование). Непосредственно закраска осуществляется оператором FloodFill (X, Y, B ), где Х, Y – координата любой точки внутри закрашиваемой области, В – цвет контура замкнутой области.

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

Итак, отображение строк. В графическом режиме на экран выводятся только строки. Выводятся при помощи процедуры Outtext (S), где S – сообщение в кавычках. При использовании этой процедуры все строки выводятся последовательно из начала координат. Чтобы писать в любой точке экрана, используется процедура OuttextXY (X, Y,S); Думаю, ясно, что Х, Y обозначают стартовые координаты, в которых необходимо производить письмо.

Также можно настраивать стиль письма. SetTextStyle (F, D,CS), где F – номер шрифта (0 – матричный, 1 – полужирный, 2 – тонкий), D – ориентирование и направление (0 – обычная, 1 – снизу вверх, 2 – слева направо (буквы на боку)), CS – размер (варьируется от 0 до 10).

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

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

1. Определить траекторию, по которой будет перемещаться тело.

2. Составить функцию, по которой программа будет определять траекторию перемещения тела (ведь программе недостаточно сказать: «Принеси кубик к вон тому стогу сена»).

3. Когда выполнены первые пункты, переходим непосредственно к составлению изображения. Вопрос – что надо сделать в первую очередь? Некоторые из вас ответят – нарисовать фигуру в начальной позиции. А вот и нет. В первую очередь необходимо стереть фигуру (это мы будем делать путем закрашивания фигуры фоновым цветом).

4. Пересчитать координаты, нарисовать фигуру и стереть ее. Повторить n раз.

Теперь конкретнее. Вот таким образом будет выглядеть код программы, в которой осуществляется перемещение окружности от одного края к другому.

Листинг : Описание program example; uses crt, graph; var x, y,gd, gm:integer; s:string; begin gd:=detect; initgraph (gd, gm,’E:\BP\BGI’); for x:=30 to 630 do begin setcolor (0); circle (x-1,240,10); setcolor (15); circle (x,240,10); delay (3000); end; closegraph; end.

Краткое пояснение тела цикла. В первую очередь осуществляется закрашивание фигуры цветом фона (стирание) в предыдущей позиции (то есть в позиции х-1). Это делается для того, чтобы в результате не получилась линия загрузки. После стирания мы рисуем фигуру в текущей позиции, а задержку выставляем, чтобы успели увидеть результат выполнения программы. Координата х высчитывается в цикле. Если бы мы выбрали другой вид цикла (скажем, цикл с постусловием), то тело изменилось бы не существенно. Пришлось бы до цикла задать х, зарисовку осуществлять circle (x,240,10), потому что координата еще не менялась, а приращение координаты прописать в отдельной строке после стирания. То есть данная программа выглядела бы следующим образом:

Листинг : Описание program example; uses crt, graph; var x, y,gd, gm:integer; s:string; begin gd:=detect; initgraph (gd, gm,’E:\BP\BGI’); x:=30; repeat setcolor (0); circle (x,240,10); x:=x+1 setcolor (15); circle (x,240,10); delay (3000); until x=630; closegraph; end.

В конце урока традиционный пример – простенькая программка, иллюстрирующая некоторые возможности данного урока. В этот раз мы сделаем программку, напоминающую по принципу работы скринсейвер Windows (по экрану будет перемещаться надпись, координаты, естественно, случайные).

Листинг : Описание program example; uses crt, graph; var x, y,gd, gm:integer; s:string; begin randomize; gd:=detect; initgraph (gd, gm,’E:\BP\BGI’); s:=’Good Day’; repeat setcolor (0); outtextxy (x, y,s); x:=random (630); y:=random (470); setcolor (15); outtextxy (x, y,s); delay (30000); delay (30000); delay (30000); until keypressed; closegraph; end.


Карта сайта


Информационный сайт Webavtocat.ru