[翻譯]PyCairo指南--漸變

PyCairo漸變

PyCairo指南的這個部分，咱們將討論漸變。咱們將提到線性的和徑向的漸變。

在計算機圖形學中，漸變是深淺的平滑的調配，由亮到暗，或者由一種顏色到另外一種顏色。在2D製圖程序和繪畫程序中，漸變被用於建立五彩繽紛的背景和特殊的效果，也用於模擬燈光和陰影。

線性漸變

線性漸變是顏色的調配(兩種不一樣的顏色)或顏色的深淺(一種顏色，R,G,B各色彩成分佔比相同，但亮度不同)變化都沿着一條直線。在PyCairo中，它們由一個 cairo.LinearGradient來表示。

#!/usr/bin/python
'''
ZetCode PyCairo tutorial

This program works with linear
gradients in PyCairo

author: Jan Bodnar
website: zetcode.com
last edited: August 2012
'''

import cairo
import gtk

class MainWindow(gtk.Window):
    def __init__(self):
        super(self.__class__, self).__init__()
        self.init_ui()

    def init_ui(self):
        darea = gtk.DrawingArea()
        darea.connect("expose_event", self.expose)
        self.add(darea)

        self.set_title("Linear gradients")
        self.resize(340, 390)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("delete-event", gtk.main_quit)
        self.show_all()

    def expose(self, widget, event):
        self.context = widget.window.cairo_create()
        self.on_draw(300, self.context)
        
    def on_draw(self, wdith, 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, 350)
        
        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)
        
        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():
    window = MainWindow()

    gtk.main()
        
if __name__ == "__main__":
    main()

這個例子中，咱們畫了三個用線性漸變填充的矩形。

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)

咱們定義了顏色停止點來產生咱們的漸變模式。在這個例子中，漸變是黑色和黃色的調配。經過添加兩個黑色的和一個黃色的停止點，咱們建立了一個豎直的漸變模式。這些停止點實際意味着什麼呢？在咱們的例子中，咱們以黑色開始，它會停止於1/10大小處。而後咱們逐漸的用黃色來描繪，它會在形狀的中心位置達到頂點。黃色終止於9/10大小處，咱們也在此處開始再次用黑色描繪，直到終點。

Figure: Linear gradients

徑向漸變

徑向漸變在兩個圓形之間調配顏色或者顏色的深淺。在PyCairo中，用 cairo.RadialGradient類來建立徑向漸變。

#!/usr/bin/python
'''
ZetCode PyCairo tutorial

This program works with radial
gradients in PyCairo

author: Jan Bodnar
website: zetcode.com
last edited: August 2012
'''

import cairo
import gtk
import math

class MainWindow(gtk.Window):
    def __init__(self):
        super(self.__class__, self).__init__()
        self.init_ui()

    def init_ui(self):
        darea = gtk.DrawingArea()
        darea.connect("expose_event", self.expose)
        self.add(darea)

        self.set_title("Radial gradients")
        self.resize(300, 200)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("delete-event", gtk.main_quit)
        self.show_all()

    def expose(self, widget, event):
        self.context = widget.window.cairo_create()
        self.on_draw(300, self.context)
        
    def on_draw(self, wdith, 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():
    window = MainWindow()

    gtk.main()
        
if __name__ == "__main__":
    main()

這個例子中，咱們畫了兩個徑向漸變。

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()方法定義色彩。咱們能夠用不一樣的圓的位置和半徑來作試驗。在第一個漸變的例子中，咱們建立了一個對象，它相似於一個3D形狀。

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()

在這個例子中，定義徑向漸變的圓和將要繪製的圓，具備相同的中心位置。

Figure: Radial gradients

在這一章中，咱們討論了PyCairo的漸變。