Графика (рисование примитивов)

В первую очередь вы должны понять, что любое рисование с помощью различных библиотек - это всего лишь рисование точек на экране. Да у библиотек OpenGl и DirectX эти возможности несомненно выше. Но оно и понятно. Там оптимизированы функции в плане вычисления, а так же само рисование реализуется быстрее из-за задействования аппаратных возможностей. Но как бы там ни было, это всего лишь вывод точек. По кол-ву точек по ширине и высоте подсчитывается разрешение экрана. Вывод точек производится с различным цветом. Основной цвет (background) точек задает цвет фона (по умолчанию черный). В последствии все рисуется на фоне только другим цветом(foreground) или цветом рисования.

Сначала о цветности

Кое что о цветах мы рассматривали в главе консоль. Для консоли информации там достаточно, но для рисования надо бы дополнить. Начнем со стандартной палитры цветов:

2х цветная палитра (0-1):

палитра

4х цветная палитра (0-3):

палитра

16х цветная(0-15):

палитра

256х цветная палитра (0-255):

палитра

Режим экрана	Пояснение
1	Цвет фона может быть в диапазоне (0-15) Цвет рисования может быть в диапазоне (0-3)
2, 11	Цвет фона может быть в диапазоне (0-1) Цвет рисования может быть в диапазоне (0-1)
7, 8	Цвет фона может быть в диапазоне (0-15) Цвет рисования может быть в диапазоне (0-15)
9	Цвет фона может быть в диапазоне (0-63) Цвет рисования может быть в диапазоне (0-63)
12	Цвет фона может быть в диапазоне (0-15) Цвет рисования может быть в диапазоне (0-15)
13 и выше	Цвет фона может быть в диапазоне (0-255) Цвет рисования может быть в диапазоне (0-255)

Палитра - это обыкновенный массив, в котором каждый индекс имеет свое значение цвета. Так в двухцветной палитре только 2 цвета (черный и белый). Она используется во 2 и 11 режимах экрана. Однако установленные цвета в палитре можно менять. Данной возможностью обладает функция Palette :

Синтаксис:

Palette [Get] [index, color]
Palette [Get] [index, r, g, b]
Palette [Get] Using arrayname(idx)

Get - используется только если нужно получать значения палитры
index - индекс по которому находится значение цвета
color - номер (значение) цвета , но можно использовать напрямую градации цвета (ниже в следующем параметре)
r , g , b (RGB) - градации цветов красный, зеленый и синий. Поскольку значение цвета состоит из трех составляющих вышеуказанных цветов, то можно добиться любого оттенка задавая значения RGB . Каждый из этих составляющих может иметь значение от 0 до 255. К примеру:
- белый (255,255,255)
- черный (0 , 0 , 0)
- красный (255,0,0)
Using arrayname - используется для получения или установки палитры с помощью массива значений. Это нужно для того, чтобы не устанавливать по отдельности каждый индекс палитры

Устанавливаемые и получаемые значения в градациях RGB для функции Palette ограничиваются 18 битами (для каждой градации 6 бит) В итоге значение одной из градаций может иметь самое большое 63 состояния или в шестнадцатеричном представлении &h3F. Это следует учитывать. Спасибо человеку с ником fxm за информацию!

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

Пример_1:

Screen 2
Palette 0,2
Palette 1,4
Print "FreeBasic"
Sleep

Как видите мы нашу монохромную палитру преобразовали в зелено-красную.

Пример_2 (установка и получение цвета для 0 индекса):

Dim As Integer r,g,b
Screen 14
Palette 0,121,161,20
Palette Get 0,r,g,b
Print r,g,b
Sleep

Пример_3 (установка цветов с помощью массива):

Dim As Integer M(1)={12,14}
Screen 2
Palette Using M
Print "FreeBasic"
Sleep

Получение цвета точки на экране

Для получения цвета отдельной точки на экране можно использовать функцию Point. Ее синтаксис:

result = Point( x, y [,buffer] )

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

Пример_1:

Screen 13
Color ,3
Cls
? Point(10,10)
Sleep

Пример_2 (установка цвета с помощью макроса RGB):

Screen 14,32
Color 0,Rgb(240,240,240)
Cls
? Hex(Point(10,10))
Sleep

Как вы заметили, во втором примере мы устанавливаем цвет с помощью макроса RGB (в отдельной статье мы разберем что такое макросы, а пока представьте себе, что это как будто функция). Обратите внимание, что данная возможность появляется при установке глубины цвета как минимум 24 бита во втором параметре SCREEN. Так при глубине цвета 8 и 16, макрос RGB бесполезен. Функция Point тоже хитрая и при глубине цвета более 24 бит, возвращает цветовое значение с прозрачностью. Если глубина цвета меньше 24 бит, то возвращает номер цвета.

Обратите внимание на макросы:

RGB - красный, зеленый, синий
RGBA - красный, зеленый, синий, прозрачность.

Задаем цвет мы с помощью RGB , хотя можно и с помощью RGBA, а вот возвращается значение из функции Point именно формата RGBA. В итоге возвращаемое число на экране не F0F0F0 , а FFF0F0F0 , где FF значение прозрачности.

Рисование с помощью примитивов

Pset и PReset

После того, как мы более или менее разобрались с цветами, можно приступать к рисованию. Начнем с рисования обычной точки. Заведуют данной возможностью функции PSET и PRESET. Одна рисует цветом рисования, другая цветом фона. Они имеют одинаковые параметры:

PSet [target ,] [STEP] (x, y) [,color]

PReset [target ,] [STEP] (x, y) [,color]

У функций только два обязательных параметра - координаты X и Y. Остальные используются в зависимости от поставленной задачи. Так например:

target - буфер изображения, используется если рисование идет на изображение в буфере. Если его не использовать, то рисование происходит на текущую видеостраницу экрана.
Step - используется при рисовании точки относительно последних координат. То есть если последнее рисование закончилось в координатах (10,10) , то следующее рисование при использовании Step и координат (5,5) , будет выводиться в точке (15,15)
Color - цвет точки. Если не использовать этот параметр, то функция возьмет стандартный установленный цвет.

Пример_1 (треугольник):

Screen 1
Dim a As Integer = 10
Do
    Pset (a,10),2
    Pset (10,a),2
    Pset (160-a,a),2
    a+=1
Loop Until a=150
Sleep

Пример_2 (сетка):

Screen 14
For s As Integer = 10 To 310 Step 4
    For d As Integer=10 To 230 Step 4
        Pset(s,d),9
    Next
Next
Sleep

Пример_3 (окружность):

Dim As Double r=50 , x=-(r*2),y
Screen 14

Do
    x += 0.001:y=Sqr(r^2-x^2)
    Pset((160+x),120-y),5
    Pset((160+x),120+y),5
Loop Until Multikey(1) 'для выхода нажать Esc

Функция Preset рисует цветом фона. Ее в основном используют для стирания каких определенных точек.

Пример (левая кнопка мыши рисует точки, правая стирает):

Dim As Integer x,y,b
Screen 13

Do
    Getmouse (x,y,,b)
        If b=1 Then
            Pset(x,y),3
        Elseif b=2 Then
            Preset(x,y)
        Endif
   Sleep(1)
Loop Until Multikey(1) 'для выхода нажать Esc

Circle

Как видите точками рисовать не сложно, но все же не всегда удобно и быстро. Кроме того в FreeBasic есть функции , которые однозначно облегчат вам задачу. Так например для рисования круга, не надо вспоминать его формулу, когда есть функция CIRCLE. Более того эта функция кроме круга рисует дуги и эллипсы.

Ее синтаксис:

Circle [target,] [STEP] (x,y), radius[, [color][, [start][, [end][, [aspect][, F]]]]]

Какой большой список параметров! Но не пугайтесь, сейчас мы их все разберем.

target - буфер изображения, используется если рисование идет на изображение в буфере. Если его не использовать, то рисование происходит на текущую видеостраницу экрана.
Step - используется при рисовании круга относительно последних координат. То есть если последнее рисование закончилось в координатах (10,10) , то следующее рисование при использовании Step и координат (5,5) , будет выводиться в точке (15,15)
x , y - координаты центра круга
Radius - радиус круга
color - цвет. Если не использовать этот параметр, то функция возьмет стандартный установленный цвет.
start и end - Значения в радианах углов. Используются при рисовании дуг. Значения могут быть от -2*PI до 2*PI . Если значения отрицательные, то рисуется дуга и отрезки от центра к концам этой дуги. Если их не использовать , то рисуется полный круг или эллипс. Если указать только координату START , то END примет значение 2*PI , если указать только END , то START будет равна 0.
aspect - соотношение сторон , используется при рисовании эллипсов. Если aspect>1 , то расширение идет по оси Y. Если aspect<1 , то расширение идет по оси X.
F - если указать этот флаг, то рисованный круг или эллипс будет закрашен. Для дуг не имеет никакого эффекта.

Пример_1:

Screen 14
'Рисуем простой круг 
Circle (160, 120), 100, 15
'Рисуем закрашенный круг
Circle (160, 120), 70, 4,,,,F
'Рисуем эллипс растянутый по оси Y
Circle (160, 120), 50, 9,,,2,F
'Рисуем эллипс растянутый по оси X
Circle (160, 120), 50, 9,,,0.5,F
'Рисуем дугу 
Circle (160, 120), 85, 2,3.14,6.28
'Рисуем дугу и соединяем концы с центром
Circle (160, 27), 20, 3,-3.14,-6.28
Sleep

Пример_2(неказистый смайлик):

Screen 14
Circle (160, 120), 100, 14,,,,F
Circle (120, 80), 20, 15,,,,F
Circle (200, 80), 20, 15,,,,F
Circle (120, 80), 3,0,,,,F
Circle (200, 80), 3,0,,,,F
Circle (120, 66), 20,0,6.5,3,0.8
Circle (200, 66), 20,0,6.5,3,0.8
Circle (160, 120), 80,0,3.14,6.28,0.8
Sleep

Line

Для построения линий, квадратов, прямоугольников довольно просто использовать функцию Line. Это перегруженная функция. Обратимся к ее синтаксису:

Line [target,] [[STEP] (x1, y1)]-[STEP] (x2, y2) [, [color][, [B|BF][, style]]]

ИЛИ

Line - (x1, y1) [, [color][, [B|BF][, style]]]

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

target - буфер изображения, используется если рисование идет на изображение в буфере. Если его не использовать, то рисование происходит на текущую видеостраницу экрана.
STEP - используется при рисовании линии относительно последних координат. То есть если последнее рисование закончилось в координатах (10,10) , то следующее рисование при использовании Step и координат (5,5) , будет начинаться в точке (15,15)
x1 и y1 - начальные координаты линии. Если используется параметр B или BF , то данные координаты станут верхним левым углом прямоугольника.
STEP -используется при рисовании линии относительно координат X1 и Y1. То есть если координаты X1 и Y1 равны(10,10) , то следующее рисование при использовании Step и координат (5,5) , будет заканчиваться в точке (15,15)
x2 и y2 - конечные координаты линии. Если используется параметр B или BF , то данные координаты станут нижним правым углом прямоугольника.
color - цвет. Если не использовать этот параметр, то функция возьмет стандартный установленный цвет.
B или BF- Если использовать параметр B , то рисуется прямоугольник. Если использовать параметр BF , то рисуется закрашенный прямоугольник.
style - стиль линии. Определяется 16 битным двоичным числом. В этом числе:
- 1 - отображать пиксель
- 0 - не отображать пиксель
  - Так вереница битов:
    - 1111111111111111 - есть обыкновенная линия
    - 1010101010101010 - есть пунктирная линия

Что касается второй записи синтаксиса функции Line, то она отличается от первой тем, что рисование происходит от последней рисуемой точки до координат x1 и y1. И конечно в ней не хватает ключевых слов Step и параметра target.

Пример_1 (рисование линий):

Screen 13
For a As Integer = 1 To 15
    Line (10,10*a)- (10*a,10),a
    Line (310,10*a)- (320-10*a,10),a
Next
Sleep

Пример_2 (рисование закрашенного квадрата):

Screen 1
Line -(100,100),2,BF
Sleep

Пример_3 (рисование незакрашенного квадрата):

Screen 1
Line (100,50)- Step(100,100),2,B
Sleep

Пример_4(рисование незакрашенного квадрата с узорными краями):

Screen 1
Line (100,50)- Step(100,100),2,B,&b1010111111110101
Sleep

Draw

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

Команды:

Команды	Пояснения
B	Двигаться, но не рисовать
N	Двигаться, рисовать, вернуться в исходную точку
Mx,y	Двигаться абсолютно или относительно. Если х или у имеют знак (+ или -), движение осуществляется относительно текущей точки, т. е. значения х и у будут прибавлены к значениям соответствующих текущих координат.Если знаков нет, то движение абсолютное, т. е. из текущей точки в точку с данными координатами.
U [n]	Вверх на n
D [n]	Вниз на n
L [n]	Влево на n
R [n]	Вправо на n
E [n]	Диагонально вверх и вправо на n
F [n]	Диагонально вниз и вправо на n
G [n]	Диагонально вниз и влево на n
H [n]	Диагонально вверх и влево на n
A [n]	Установка угла поворота n. Значение n находится в пределах от 0 до 3, где 0 = 0°, 1 = 90°, 2 = 180° и 3 = 270°. Размеры фигур, повернутых на угол 90° или 270° масштабируются в отношении 4/3 к их размерам в углах 0° или 180°
TA [n]	Поворачивает изображение на угол в n градусов. Значение n находится в пределах от -360 до 360. Если n > 0, то поворот производится против часовой стрелки, иначе — по часовой стрелке
C [n]	Установка цвета n
S [n]	Установка масштабного фактора n, где n находится в пределах от 1 до 255. Масштабный фактор увеличивает единицы перемещения команд U, D ,L ,R и относительной М
P n, m	Установка цвета нарисованной фигуры: n - цвет содержимого ограниченной области, m - цвет границ

Пример:

Screen 1
Draw "B M160,20 C2 F150 L300 E150 BD10 P1,2"
Sleep

Данный код рисует закрашенный треугольник. Как видите, все команды в одной строке. Но в команду Draw можно подавать и строковую переменную, которая содержит эти команды:

Screen 1
Dim As String Dr = "B M160,20 C2 F150 L300 E150 BD10 P1,2"
Draw Dr
Sleep

Paint

При рисовании каких-то нестандартных фигур, часто нужно залить их каким-то цветом. Как раз для этого предназначена функция Paint. Она закрашивает фигуры определенным цветом в параметре paint , используя номер цвета последнего параметра функции border_color для того, чтобы определить границы закрашивания. Ее синтаксис:

Paint [target,] [STEP] (x, y)[, [paint][, [border_color]]]

target - буфер изображения, используется если рисование идет на изображение в буфере. Если его не использовать, то рисование происходит на текущую видеостраницу экрана.
Step - используется при рисовании линии относительно последних координат.
X и Y - координаты полости для заполнения
Paint - числовое или символьное выражение. Если это числовое выражение, оно представляет атрибут цвета. Если аргумент не указан, используется атрибут фона. Если аргумент является символьным выражением, то закрашивается фигура образом указанным в этом выражении битовой маской.
Border_color - цвет рамки

Пример_1:

Screen 13
Circle (160, 100), 80, 15,-3.14,-6.28
Paint (160, 120), 10,15
Sleep

Обратите внимание на одинаковые номера цвета в 4 параметрах Circle и Paint. Попробуйте поменять на другие значения.

Пример_2 (своеобразный фон):

Screen 13
Dim As String STT
For a As Integer = 1 To 64
    STT=STT+"Fre"
Next
Paint (160, 100), STT,3
Sleep

Это пожалуй все для этой статьи, в следующей статье продолжим. Всего доброго!

содержание | назад | вперед