Рисуем с помощью lua+cairo

Разработка скриптов на lua. Создание виджетов, диалогов и т.д.
Ответить
Аватара пользователя
olgmen
Сообщения: 155
Зарегистрирован: 30 ноя 2012, 11:00
Темы: 32
Откуда: Санкт-Петербург
Статус: Не в сети

Рисуем с помощью lua+cairo

Сообщение olgmen » 09 янв 2014, 18:22

Рисуем линии с помощью lua+cairo

Сейчас я покажу как с помощью lua+cairo нарисовать прямые линии, такие как на рисунке

Изображение

Как и при выводе текста, для вывода линии, нужна начальная точка

cr:move_to(x, y)

также, конечно необходим цвет линии в системе RGB

cr:set_source_rgb(0,0,0)

и для линии необходимо назначить толщину линии

cr:set_line_width(10)

или

cr.cr.line_width = 10

что в oocairo равнозначно

Прямая линия рисуется назначением второй точки с помощью команды

cr:line_to(x1, y1)

Для вывода линии на экран необходимо дать команду

cr:stroke()

Всё вместе это выглядит так

cr:set_source_rgb(0,0,0)
cr:set_line_width(10)
cr:move_to(20,20)
cr:line_to(220, 20)
cr:stroke()

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

cr:save()

а в конце блока команд даем команду восстановить данные

cr:restore()

Команда отрисовки концов линии выглядит так

cr:set_line_cap(stile)

В этой команде stile имеет три значения

0 - butt, устанавливается по умолчанию, поэтому вторая линия ничем не отличающается от первой
1 - round, закругленный конец линии, центр окружности находится в конце линии, поэтому она и выводится более длинной
2 - square, прямоугольное окончание линии, увеличенная так же как и линия round

cr:move_to(20,60)
cr:line_to(220, 60)
cr:set_line_cap(0) -- butt
cr:stroke()

cr:save()
cr:move_to(20,100)
cr:line_to(220, 100)
cr:set_line_cap(1) -- round
cr:stroke()
cr:restore()

cr:save()
cr:move_to(20,140)
cr:line_to(220, 140)
cr:set_line_cap(2) -- square
cr:stroke()
cr:restore()

Для показа увеличения линий, поверх них проведены красные линии без отрисовки концов

cr:set_line_width(1)
cr:set_source_rgb(1,0,0)
cr:move_to(20, 60)
cr:line_to(220, 60)
cr:move_to(20, 100)
cr:line_to(220, 100)
cr:move_to(20, 140)
cr:line_to(220, 140)
cr:stroke()

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

cr:set_dash({ 10, 10 }, 0)

0 в конце команды показывает какой отступ от начала линии

Шестая, штрихпунктирная линия имеет такую команду

cr:set_dash({ 50, 10, 10, 10 }, -50)

Здесь 50 - длина штриха, вторая цифра промежуток, третья - точка и последняя промежуток. А в общем это выглядит так

cr:set_source_rgb(0,0,0)

cr:set_line_width(10)
cr:set_dash({ 10, 10 }, 0)
cr.line_width = 10
cr:move_to(20, 180)
cr:line_to(220, 180)
cr:stroke()

cr:set_dash({ 50, 10, 10, 10 }, -50)
cr.line_width = 10
cr:move_to(20, 220)
cr:line_to(220, 220)
cr:stroke()
Кто ищет, тот всегда найдет

Arch Linux
Conky - 1.9

Аватара пользователя
olgmen
Сообщения: 155
Зарегистрирован: 30 ноя 2012, 11:00
Темы: 32
Откуда: Санкт-Петербург
Статус: Не в сети

Re: Рисуем с помощью lua+cairo

Сообщение olgmen » 14 янв 2014, 15:18

Ломаные линии

В cairo при проведении любой линии запоминается последняя точка. Для рисования ломаной линии достаточно просто добавить следующую точку

cr:set_source_rgb(0,0,0)
cr:set_line_width(20)
cr:move_to(20,20)
cr:line_to(220, 20)
cr:line_to(20, 160)
cr:stroke()


Изображение

кроме этого с помощью команды

cr:rel_line_to(x1, y1)

можно перенести начало координат из верхнего левого угла виджета (окна) в последнюю точку, и отсчет вести от неё.

cr:set_source_rgb(0,0,0)
cr:set_line_width(20)
cr:move_to(20,20)
cr:line_to(220, 20)
cr:line_to(40, 160)
cr:rel_line_to(200, 0)
cr:stroke()


Изображение

Так же существует команда для срезания или закругления угла между двумя прямыми

cr:set_line_join(style)

По умолчанию используется

cr:set_line_join(0) - miter, т.е. всё остается так как видно на верхнем рисунке

cr:set_line_join(1) - round, угол закруглен с внешней стороны

Изображение

cr:set_line_join(2) - bevel, угол срезан с внешней стороны


Изображение

Кстати, все эти команды можно писать в любой последовательности, главное, что бы команда

cr:stroke()

была последней. Так как она показывает, что линия должна быть нарисована.

Из линий остались только кривые линии, с помощью следующей команды хорошо выводить графики

cr:curve_to(x1, y1, x2, y2, x, y)

пример

Изображение

cr:set_line_width(3)
cr:set_source_rgb(0,0,0)
cr:move_to(20, 250)
cr:line_to(350, 250)
cr:stroke()
cr:set_source_rgb(1,0,0)
cr:move_to(20,250)
cr:curve_to(100, 300, 150, 25, 230, 300)
cr:stroke()
Кто ищет, тот всегда найдет

Arch Linux
Conky - 1.9

Ответить

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 1 гость