В данном разделе мы рассмотрим градиенты. Также мы упомянем линейные и радиальные градиенты. В компьютерной графике градиентом называют плавное перетекание теней от светлых к темным, или перетекание одного цвета к другому. В программах для работы с двухмерной графикой и приложениях для рисования, градиенты используются как для создания наполненного цветом фона и специальных эффектов, так и для создания игры света и тени.
Линейные градиенты
Линейные градиенты являются смесью цветов или цветов теней, отбрасываемых вдоль линии. В PyCairo градиенты представлены классом cairo.LinearGradient .
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
#!/usr/bin/python from gi.repository import Gtk import cairo class Example(Gtk.Window): def __init__(self): super(Example, self).__init__() self.init_ui() def init_ui(self): darea = Gtk.DrawingArea() darea.connect("draw", self.on_draw) self.add(darea) self.set_title("Linear gradients") self.resize(340, 390) self.set_position(Gtk.WindowPosition.CENTER) self.connect("delete-event", Gtk.main_quit) self.show_all() def on_draw(self, wid, cr): self.draw_gradient1(cr) self.draw_gradient2(cr) self.draw_gradient3(cr) def draw_gradient1(self, cr): lg1 = cairo.LinearGradient(0.0, 0.0, 350.0, 350.0) count = 1 i = 0.1 while i < 1.0: if count % 2: lg1.add_color_stop_rgba(i, 0, 0, 0, 1) else: lg1.add_color_stop_rgba(i, 1, 0, 0, 1) i = i + 0.1 count = count + 1 cr.rectangle(20, 20, 300, 100) cr.set_source(lg1) cr.fill() def draw_gradient2(self, cr): lg2 = cairo.LinearGradient(0.0, 0.0, 350.0, 0) count = 1 i = 0.05 while i < 0.95: if count % 2: lg2.add_color_stop_rgba(i, 0, 0, 0, 1) else: lg2.add_color_stop_rgba(i, 0, 0, 1, 1) i = i + 0.025 count = count + 1 cr.rectangle(20, 140, 300, 100) cr.set_source(lg2) cr.fill() def draw_gradient3(self, cr): lg3 = cairo.LinearGradient(20.0, 260.0, 20.0, 360.0) lg3.add_color_stop_rgba(0.1, 0, 0, 0, 1) lg3.add_color_stop_rgba(0.5, 1, 1, 0, 1) lg3.add_color_stop_rgba(0.9, 0, 0, 0, 1) cr.rectangle(20, 260, 300, 100) cr.set_source(lg3) cr.fill() def main(): app = Example() Gtk.main() if __name__ == "__main__": main() |
В данном примере были созданы прямоугольники, заполненные линейными градиентами.
|
1 |
lg3 = cairo.LinearGradient(20.0, 260.0, 20.0, 360.0) |
Здесь мы создали линейный градиент. Параметры определяют линию, вдоль которой мы внесем градиент. В данном случае наша линия горизонтальная.
|
1 2 3 |
lg3.add_color_stop_rgba(0.1, 0, 0, 0, 1) lg3.add_color_stop_rgba(0.5, 1, 1, 0, 1) lg3.add_color_stop_rgba(0.9, 0, 0, 0, 1) |
Мы выбираем ограничения цвета для создания нашего градиентного шаблона. В данном случае, градиент сочетает в себе смесь чёрного и желтого цветов. Добавив два ограничения черному и один желтому, мы получаем горизонтальный градиентный шаблон.
Что означают эти ограничения?
В нашем случае, выбранный нами черный цвет ограничен 1\10 размера. После чего мы начинаем постепенно окрашивать объект в желтый, который сгущается в центральной части фигуры. Желтый цвет ограничен 9\10 частью его размера, в том месте, где снова начинается черный, и так до конца.
![Градиенты в PyCairo [Урок №5]](https://python-scripts.com/wp-content/uploads/2017/03/lineargradients.png)
Радиальные градиенты
Радиальными градиентами называют смешивание двух цветов или цвета и тени между двумя окружностями. Класс cairo.RadialGradient применяется для создания радиальных градиентов в PyCairo.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 |
#!/usr/bin/python from gi.repository import Gtk import cairo import math class Example(Gtk.Window): def __init__(self): super(Example, self).__init__() self.init_ui() def init_ui(self): darea = Gtk.DrawingArea() darea.connect("draw", self.on_draw) self.add(darea) self.set_title("Radial gradients") self.resize(300, 200) self.set_position(Gtk.WindowPosition.CENTER) self.connect("delete-event", Gtk.main_quit) self.show_all() def on_draw(self, wid, cr): self.draw_gradient1(cr) self.draw_gradient2(cr) def draw_gradient1(self, cr): cr.set_source_rgba(0, 0, 0, 1) cr.set_line_width(12) cr.translate(60, 60) r1 = cairo.RadialGradient(30, 30, 10, 30, 30, 90) r1.add_color_stop_rgba(0, 1, 1, 1, 1) r1.add_color_stop_rgba(1, 0.6, 0.6, 0.6, 1) cr.set_source(r1) cr.arc(0, 0, 40, 0, math.pi * 2) cr.fill() cr.translate(120, 0) def draw_gradient2(self, cr): r2 = cairo.RadialGradient(0, 0, 10, 0, 0, 40) r2.add_color_stop_rgb(0, 1, 1, 0) r2.add_color_stop_rgb(0.8, 0, 0, 0) cr.set_source(r2) cr.arc(0, 0, 40, 0, math.pi * 2) cr.fill() def main(): app = Example() Gtk.main() if __name__ == "__main__": main() |
В данном примере мы нарисовали два радиальных градиента.
|
1 2 3 4 5 6 |
r1 = cairo.RadialGradient(30, 30, 10, 30, 30, 90) r1.add_color_stop_rgba(0, 1, 1, 1, 1) r1.add_color_stop_rgba(1, 0.6, 0.6, 0.6, 1) cr.set_source(r1) cr.arc(0, 0, 40, 0, math.pi * 2) cr.fill() |
Мы нарисовали окружность и заполнили её содержимое радиальным градиентом. Радиальный градиент определяется двумя окружностями. Метод add_color_stop_rgba() определяет цвет. Мы можем экспериментировать с позицией с позицией окружностей или длиной их радиуса. На первом примере градиента, мы создали объект, напоминающий трёхмерную фигуру.
|
1 2 3 4 5 6 |
r2 = cairo.RadialGradient(0, 0, 10, 0, 0, 40) r2.add_color_stop_rgb(0, 1, 1, 0) r2.add_color_stop_rgb(0.8, 0, 0, 0) cr.set_source(r2) cr.arc(0, 0, 40, 0, math.pi * 2) cr.fill() |
В данном примере окружности, определяющие радиальный градиент и созданный нами круг имеют общую центральную точку.
![Градиенты в PyCairo [Урок №5]](https://python-scripts.com/wp-content/uploads/2017/03/radialgradients.png)
Являюсь администратором нескольких порталов по обучению языков программирования Python, Golang и Kotlin. В составе небольшой команды единомышленников, мы занимаемся популяризацией языков программирования на русскоязычную аудиторию. Большая часть статей была адаптирована нами на русский язык и распространяется бесплатно.
E-mail: vasile.buldumac@ati.utm.md
Образование
Universitatea Tehnică a Moldovei (utm.md)
- 2014 — 2018 Технический Университет Молдовы, ИТ-Инженер. Тема дипломной работы «Автоматизация покупки и продажи криптовалюты используя технический анализ»
- 2018 — 2020 Технический Университет Молдовы, Магистр, Магистерская диссертация «Идентификация человека в киберпространстве по фотографии лица»