漸變填充

前面說(shuō)了有關(guān)反走樣的相關(guān)知識(shí)，下面來(lái)說(shuō)一下漸變。漸變是繪圖中很常見(jiàn)的一種功能，簡(jiǎn)單來(lái)說(shuō)就是可以把幾種顏色混合在一起，讓它們能夠自然地過(guò)渡，而不是一下子變成另一種顏色。漸變的算法比較復(fù)雜，寫(xiě)得不好的話(huà)效率會(huì)很低，好在很多繪圖系統(tǒng)都內(nèi)置了漸變的功能，Qt 也不例外。漸變一般是用在填充里面的，所以，漸變的設(shè)置就是在 QBrush 里面。

Qt 提供了三種漸變畫(huà)刷，分別是線(xiàn)性漸變(QLinearGradient)、輻射漸變(QRadialGradient)、角度漸變(QConicalGradient)。如下圖所示(圖片出自 C++ GUI Programming with Qt4, 2nd Edition)：

下面我們來(lái)看一下線(xiàn)性漸變 QLinearGradient 的用法。

void PaintedWidget::paintEvent(QPaintEvent *event) 
{ 
        QPainter painter(this); 

        painter.setRenderHint(QPainter::Antialiasing, true); 
        QLinearGradient linearGradient(60, 50, 200, 200); 
        linearGradient.setColorAt(0.2, Qt::white); 
        linearGradient.setColorAt(0.6, Qt::green); 
        linearGradient.setColorAt(1.0, Qt::black); 
        painter.setBrush(QBrush(linearGradient)); 
        painter.drawEllipse(50, 50, 200, 150); 
}

同前面一樣，這里也僅僅給出了 paintEvent()函數(shù)里面的代碼。

首先我們打開(kāi)了反走樣，然后創(chuàng)建一個(gè) QLinearGradient對(duì)象實(shí)例。QLinearGradient 構(gòu)造函數(shù)有四個(gè)參數(shù)，分別是x1, y1, x2, y2，即漸變的起始點(diǎn)和終止點(diǎn)。在這里，我們從(60, 50)開(kāi)始漸變，到(200, 200)止。

漸變的顏色是在 setColorAt()函數(shù)中指定的。下面是這個(gè)函數(shù)的簽名：

void QGradient::setColorAt ( qreal position, const QColor & color )

它的意思是把 position 位置的顏色設(shè)置成 color。其中，position 是一個(gè)0 - 1區(qū)間的數(shù)字。也就是說(shuō)，position 是相對(duì)于我們建立漸變對(duì)象時(shí)做的那個(gè)起始點(diǎn)和終止點(diǎn)區(qū)間的。比如這個(gè)線(xiàn)性漸變，就是說(shuō)，在從(60, 50)到(200, 200)的線(xiàn)段上，在0.2，也就五分之一處設(shè)置成白色，在0.6也就是五分之三處設(shè)置成綠色，在1.0也就是終點(diǎn)處設(shè)置成黑色。

在創(chuàng)建 QBrush 時(shí)，把這個(gè)漸變對(duì)象傳遞進(jìn)去，就是我們的結(jié)果啦：

那么，我們?cè)趺醋尵€(xiàn)段也是漸變的呢？要知道，直線(xiàn)是用畫(huà)筆繪制的??！這里，如果你仔細(xì)查閱了 API 文檔就會(huì)發(fā)現(xiàn)，QPen 是接受 QBrush 作為參數(shù)的。也就是說(shuō)，你可以利用一個(gè) QBrush 創(chuàng)建一個(gè)QPen，這樣，QBrush 所有的填充效果都可以用在畫(huà)筆上了！

void PaintedWidget::paintEvent(QPaintEvent *event) 
{ 
        QPainter painter(this); 

        painter.setRenderHint(QPainter::Antialiasing, true); 
        QLinearGradient linearGradient(60, 50, 200, 200); 
        linearGradient.setColorAt(0.2, Qt::white); 
        linearGradient.setColorAt(0.6, Qt::green); 
        linearGradient.setColorAt(1.0, Qt::black); 
        painter.setPen(QPen(QBrush(linearGradient), 5)); 
        painter.drawLine(50, 50, 200, 200); 
}

看看我們的漸變線(xiàn)吧！

本文出自 “豆子空間” 博客，請(qǐng)務(wù)必保留此出處 http://devbean.blog.51cto.com/448512/194031