原文: https://zetcode.com/gfx/pycairo/gradients/

在 PyCairo 教程的这一部分中,我们将介绍渐变。 我们将提到线性和径向渐变。

在计算机图形学中,渐变是从浅到深或从一种颜色到另一种颜色的阴影的平滑混合。 在 2D 绘图程序和绘画程序中,渐变用于创建彩色背景和特殊效果以及模拟灯光和阴影。 (answers.com)

线性渐变

线性渐变是沿着一条线的颜色混合或颜色阴影混合。 它们由 PyCairo 中的cairo.LinearGradient类表示。

  1. #!/usr/bin/python
  2. '''
  3. ZetCode PyCairo tutorial
  4. This program works with linear
  5. gradients in PyCairo.
  6. author: Jan Bodnar
  7. website: zetcode.com
  8. last edited: August 2012
  9. '''
  10. from gi.repository import Gtk
  11. import cairo
  12. class Example(Gtk.Window):
  13. def __init__(self):
  14. super(Example, self).__init__()
  15. self.init_ui()
  16. def init_ui(self):
  17. darea = Gtk.DrawingArea()
  18. darea.connect("draw", self.on_draw)
  19. self.add(darea)
  20. self.set_title("Linear gradients")
  21. self.resize(340, 390)
  22. self.set_position(Gtk.WindowPosition.CENTER)
  23. self.connect("delete-event", Gtk.main_quit)
  24. self.show_all()
  25. def on_draw(self, wid, cr):
  26. self.draw_gradient1(cr)
  27. self.draw_gradient2(cr)
  28. self.draw_gradient3(cr)
  29. def draw_gradient1(self, cr):
  30. lg1 = cairo.LinearGradient(0.0, 0.0, 350.0, 350.0)
  31. count = 1
  32. i = 0.1
  33. while i < 1.0:
  34. if count % 2:
  35. lg1.add_color_stop_rgba(i, 0, 0, 0, 1)
  36. else:
  37. lg1.add_color_stop_rgba(i, 1, 0, 0, 1)
  38. i = i + 0.1
  39. count = count + 1
  40. cr.rectangle(20, 20, 300, 100)
  41. cr.set_source(lg1)
  42. cr.fill()
  43. def draw_gradient2(self, cr):
  44. lg2 = cairo.LinearGradient(0.0, 0.0, 350.0, 0)
  45. count = 1
  46. i = 0.05
  47. while i < 0.95:
  48. if count % 2:
  49. lg2.add_color_stop_rgba(i, 0, 0, 0, 1)
  50. else:
  51. lg2.add_color_stop_rgba(i, 0, 0, 1, 1)
  52. i = i + 0.025
  53. count = count + 1
  54. cr.rectangle(20, 140, 300, 100)
  55. cr.set_source(lg2)
  56. cr.fill()
  57. def draw_gradient3(self, cr):
  58. lg3 = cairo.LinearGradient(20.0, 260.0, 20.0, 360.0)
  59. lg3.add_color_stop_rgba(0.1, 0, 0, 0, 1)
  60. lg3.add_color_stop_rgba(0.5, 1, 1, 0, 1)
  61. lg3.add_color_stop_rgba(0.9, 0, 0, 0, 1)
  62. cr.rectangle(20, 260, 300, 100)
  63. cr.set_source(lg3)
  64. cr.fill()
  65. def main():
  66. app = Example()
  67. Gtk.main()
  68. if __name__ == "__main__":
  69. main()

该示例绘制了三个填充有线性渐变的矩形。

  1. lg3 = cairo.LinearGradient(20.0, 260.0, 20.0, 360.0)

在这里,我们创建一个线性渐变。 参数指定直线,沿着该直线绘制渐变。 这是一条水平线。

  1. lg3.add_color_stop_rgba(0.1, 0, 0, 0, 1)
  2. lg3.add_color_stop_rgba(0.5, 1, 1, 0, 1)
  3. lg3.add_color_stop_rgba(0.9, 0, 0, 0, 1)

我们定义色标以产生渐变图案。 在这种情况下,渐变是黑色和黄色的混合。 通过添加两个黑色和一个黄色色标,我们创建了一个水平渐变图案。 这些停止实际上是什么意思? 在我们的情况下,我们从黑色开始,该黑色将停止在大小的 1/10 处。 然后,我们开始逐渐涂成黄色,最终达到形状的中心。 黄色停在大小的 9/10,我们再次开始用黑色绘画,直到结束。

PyCairo 渐变 - 图1

图:线性渐变

径向渐变

径向渐变是两个圆之间颜色或阴影的混合。 cairo.RadialGradient类用于在 PyCairo 中创建径向渐变。

  1. #!/usr/bin/python
  2. '''
  3. ZetCode PyCairo tutorial
  4. This program works with radial
  5. gradients in PyCairo.
  6. author: Jan Bodnar
  7. website: zetcode.com
  8. last edited: August 2012
  9. '''
  10. from gi.repository import Gtk
  11. import cairo
  12. import math
  13. class Example(Gtk.Window):
  14. def __init__(self):
  15. super(Example, self).__init__()
  16. self.init_ui()
  17. def init_ui(self):
  18. darea = Gtk.DrawingArea()
  19. darea.connect("draw", self.on_draw)
  20. self.add(darea)
  21. self.set_title("Radial gradients")
  22. self.resize(300, 200)
  23. self.set_position(Gtk.WindowPosition.CENTER)
  24. self.connect("delete-event", Gtk.main_quit)
  25. self.show_all()
  26. def on_draw(self, wid, cr):
  27. self.draw_gradient1(cr)
  28. self.draw_gradient2(cr)
  29. def draw_gradient1(self, cr):
  30. cr.set_source_rgba(0, 0, 0, 1)
  31. cr.set_line_width(12)
  32. cr.translate(60, 60)
  33. r1 = cairo.RadialGradient(30, 30, 10, 30, 30, 90)
  34. r1.add_color_stop_rgba(0, 1, 1, 1, 1)
  35. r1.add_color_stop_rgba(1, 0.6, 0.6, 0.6, 1)
  36. cr.set_source(r1)
  37. cr.arc(0, 0, 40, 0, math.pi * 2)
  38. cr.fill()
  39. cr.translate(120, 0)
  40. def draw_gradient2(self, cr):
  41. r2 = cairo.RadialGradient(0, 0, 10, 0, 0, 40)
  42. r2.add_color_stop_rgb(0, 1, 1, 0)
  43. r2.add_color_stop_rgb(0.8, 0, 0, 0)
  44. cr.set_source(r2)
  45. cr.arc(0, 0, 40, 0, math.pi * 2)
  46. cr.fill()
  47. def main():
  48. app = Example()
  49. Gtk.main()
  50. if __name__ == "__main__":
  51. main()

在示例中,我们绘制了两个径向渐变。

  1. r1 = cairo.RadialGradient(30, 30, 10, 30, 30, 90)
  2. r1.add_color_stop_rgba(0, 1, 1, 1, 1)
  3. r1.add_color_stop_rgba(1, 0.6, 0.6, 0.6, 1)
  4. cr.set_source(r1)
  5. cr.arc(0, 0, 40, 0, math.pi * 2)
  6. cr.fill()

我们画一个圆,并用径向渐变填充其内部。 径向梯度由两个圆定义。 add_color_stop_rgba()方法定义颜色。 我们可以试验圆的位置或半径的长度。 在第一个渐变示例中,我们创建了一个类似于 3D 形状的对象。

  1. r2 = cairo.RadialGradient(0, 0, 10, 0, 0, 40)
  2. r2.add_color_stop_rgb(0, 1, 1, 0)
  3. r2.add_color_stop_rgb(0.8, 0, 0, 0)
  4. cr.set_source(r2)
  5. cr.arc(0, 0, 40, 0, math.pi * 2)
  6. cr.fill()

在此示例中,定义径向渐变的圆和自定义绘制的圆具有共同的中心点。

PyCairo 渐变 - 图2

图:径向渐变

在本章中,我们介绍了 PyCairo 渐变。