среда, 9 марта 2011 г.

Рисование кривых в конки

Последнее, что я использую при рисовании, это кривые линии. Я их использовал при выводе графиков нагрузки процессора и в виде часов - сосулек. Также с помощью кривых можно закруглить углы, например прямоугольников.







Как было написано в небольшом обзоре о cairo, кривые в cairo являются кубическими кривыми Безье. Они начинаются в контрольной точке и плавно следуют в направлении двух других точек (не пересекая их) до получения третьей точки. Кривые выводятся командами

cairo_curve_to (cr, x1, y1, x2, y2, x3, y3)

определяется каждая точка относительно предыдущей точки

cairo_rel_curve_to (cr, x1, y1, x2, y2, x3, y3)

определяются все точки, относительно предыдущей контрольной точки.

Легче показать, чем объяснять для меня необъяснимое. Я не знаю, что такое кубические кривые, но думаю большинство читающих тоже это не знают. Просто когда мне необходимо использовать кривые, я подбираю параметры методом "научного тыка", получилось и хорошо. Итак на основе маленького скрипта покажу как же рисуются кривые.

-- задаем начальную точку

x = 25.6
y = 128.0

-- задаем остальные три точки

x1 = 102.4
y1 = 230.4
x2 = 153.6
y2 = 25.6
x3 = 230.4
y3 = 128.0

-- выводим первую точку

cairo_move_to (cr, x, y)

-- задаем кривую

cairo_curve_to (cr, x1, y1, x2, y2, x3, y3)

-- задаем цвет и толщину выводимой линии

cairo_set_source_rgba (cr, 1, 1, 1, 1)
cairo_set_line_width (cr, 10.0)

-- заканчиваем вывод

cairo_stroke (cr)

На рисунке цветными точками обозначены введенные нами точки

зеленая - x, y
желтая - x1, y1
голубая - x2, y2
фиолетовая - x3, y3


Для большей ясности приведу пример рисунка квадрата с закругленными углами

x0 = 25
y0 = 25
width = 200
height = 200

x1 = x0 + width
y1 = y0 + height


cairo_move_to (cr, x0, (y0 + y1)/2)
cairo_curve_to (cr, x0, y0, x0, y0, (x0 + x1)/2, y0)
cairo_curve_to (cr, x1, y0, x1, y0, x1, (y0 + y1)/2)
cairo_curve_to (cr, x1, y1, x1, y1, (x1 + x0)/2, y1)
cairo_curve_to (cr, x0, y1, x0, y1, x0, (y0 + y1)/2)

При выводе этого изображения радиус закругления углов получается автоматически, что не всегда подходит.

Рисунок квадрата с закругленными углами без использования команды вывода кривой.
x = 25
y = 25
width = 200
height = 200
radius = 20

cairo_move_to (cr, x + radius, y)
cairo_line_to(cr, x + width - radius, y)
cairo_arc(cr, x + width - radius, y + radius, radius, -math.pi/2,0)
cairo_line_to(cr, x + width, y + height - radius)
cairo_arc(cr, x + width - radius, y + height - radius, radius, 0, math.pi/2)
cairo_line_to(cr, x + radius, y + height)
cairo_arc(cr, x + radius, y + height - radius, radius, math.pi/2, math.pi)
cairo_line_to(cr, x, y + radius)
cairo_arc(cr, x + radius, y + radius, radius, math.pi, math.pi*1.5)
cairo_close_path(cr)





Комментариев нет:

Отправить комментарий