鍍金池/ 教程/ C/ 漸變填充
Qt 容器和算法拾遺
自定義 model 之一
反走樣
Hello, world!
Qt 容器類(lèi)之關(guān)聯(lián)存儲(chǔ)容器
QStringListModel
拖放技術(shù)之一
狀態(tài)欄
QTreeWidget
拖放技術(shù)之二
通用算法
event()
Qt 學(xué)習(xí)之路(18): Qt 標(biāo)準(zhǔn)對(duì)話框之 QInputDialog
Qt 容器類(lèi)之遍歷器和隱式數(shù)據(jù)共享
QListWidget
Meta-Object 系統(tǒng)
事件接收與忽略
Qt 學(xué)習(xí)之路(tip): parent 參數(shù)
Qt 標(biāo)準(zhǔn)對(duì)話框之 QColorDialog
QPainter(續(xù))
國(guó)際化(下)
漸變填充
自定義委托
創(chuàng)建 shared library
model-view 架構(gòu)
Graphics View Framework
自定義拖放數(shù)據(jù)對(duì)象
QSortFilterProxyModel
國(guó)際化(上)
組件布局
自定義 Model 之三
事件過(guò)濾器
QDirModel
Hello, world!(續(xù))
Qt 標(biāo)準(zhǔn)對(duì)話框之 QFileDialog
自定義 model 之二
深入了解信號(hào)槽
坐標(biāo)變換
剪貼板操作
QTableWidget
QByteArray 和 QVariant
創(chuàng)建一個(gè)對(duì)話框(下)
Qt 學(xué)習(xí)之路(32): 一個(gè)簡(jiǎn)易畫(huà)板的實(shí)現(xiàn)(Graphics View)
文本文件讀寫(xiě)
自定義事件
編寫(xiě)跨平臺(tái)的程序
MainWindow
初探信號(hào)槽
Qt 學(xué)習(xí)之路(17): Qt 標(biāo)準(zhǔn)對(duì)話框之 QMessageBox
繪圖設(shè)備
菜單和工具條(續(xù))
二進(jìn)制文件讀寫(xiě)
QString
事件(event)
菜單和工具條
QPainter
Qt 容器類(lèi)之順序存儲(chǔ)容器
進(jìn)程間交互
API 文檔的使用
創(chuàng)建一個(gè)對(duì)話框(上)
一個(gè)簡(jiǎn)易畫(huà)板的實(shí)現(xiàn)(QWidget)

漸變填充

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

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

http://wiki.jikexueyuan.com/project/learn-road-qt/images/1.png" alt="" />

下面我們來(lái)看一下線性漸變 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è)線性漸變,就是說(shuō),在從(60, 50)到(200, 200)的線段上,在0.2,也就五分之一處設(shè)置成白色,在0.6也就是五分之三處設(shè)置成綠色,在1.0也就是終點(diǎn)處設(shè)置成黑色。

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

http://wiki.jikexueyuan.com/project/learn-road-qt/images/43.png" alt="" />

那么,我們?cè)趺醋尵€段也是漸變的呢?要知道,直線是用畫(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); 
}

看看我們的漸變線吧!

http://wiki.jikexueyuan.com/project/learn-road-qt/images/44.png" alt="" />

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