漸變,是指逐漸的,有規律性的變化,是一種規律性很強的現象。qt提供了乙個與漸變相關的qgradient類,目前支援三種漸變畫刷,分別是線性漸變(qlineargradient)、輻射漸變(qradialgradient)、角度漸變(qconicalgradient),如下圖所示:
從左到右依次為:線性漸變、輻射漸變、角度漸變
下面來看一下實現的**,由於程式較簡單,所以將解釋都加在了每行**的後邊:
1.線性漸變qlineargradient12
3456
78910
11qpainter painter(this);//建立了乙個qpainter物件例項
painter.setrenderhint(qpainter::antialiasing, true);//消除鋸齒
qlineargradient lineargradient(20,20, 150, 150);
//建立了乙個qlineargradient物件例項,引數為起點和終點座標
lineargradient.setcolorat(0.2, qt::white);
lineargradient.setcolorat(0.4, qt::blue);
lineargradient.setcolorat(0.6, qt::red);
lineargradient.setcolorat(1.0,qt::yellow);
//上面的四行分別設定漸變的顏色和路徑比例
painter.setbrush(qbrush(lineargradient));//將lineargradient物件傳遞給畫刷
painter.drawellipse(10,10, 150, 150);//在相應的座標畫出來
2.輻射漸變qradialgradient12
3456
qradialgradient radialgradient(275,85,75,275,85);
//建立了乙個qradialgradient物件例項,引數分別為中心座標,半徑長度和焦點座標
radialgradient.setcolorat(0,qt::black);
radialgradient.setcolorat(1.0,qt::green);//設定漸變的顏色和路徑比例
painter.setbrush(qbrush(radialgradient));
painter.drawellipse(200,10,150,150);//在相應的座標畫出來
3.角度漸變qconicalgradient12
3456
qconicalgradient conicalgradient(465,85,10);
//建立了乙個qconicalgradient物件例項,引數分別為中心座標和初始角度
conicalgradient.setcolorat(0,qt::white);
conicalgradient.setcolorat(0.8,qt::blue);//設定漸變的顏色和路徑比例
painter.setbrush(qbrush(conicalgradient));
painter.drawellipse(390,10,150,150);//在相應的座標畫出來
css3 Gradient漸變效果
雖然css3的漸變屬性在眾瀏覽器中得到較好的支援,但在實際使用的時候也像製作軟體 photoshop cs6 firework cs6等 的漸變工具一樣,將漸變分成了幾種 線性漸變 linear gradients 徑向漸變 radial gradients 重複線性漸變和重複徑向漸變。國外乙個根據...
CSS屬性之漸變屬性(gradient)
漸變分為線性漸變和徑向漸變,所謂漸變就是幾種顏色之間的平穩過渡。實現線性漸變,你至少需要定義兩種顏色的結點,這兩種結點就是你想平穩過渡的顏色,即 其中一種顏色結點為起點,另一種顏色結點為結束點。書寫 background linear gradient color1,color2 color1為起點...
CSS漸變屬性(gradient)的用法
漸變分為線性漸變和徑向漸變,所謂漸變就是幾種顏色之間的平穩過渡。線性漸變 線性漸變 linear gradient 實現線性漸變,你至少需要定義兩種顏色的結點,這兩種結點就是你想平穩過渡的顏色,即 其中一種顏色結點為起點,另一種顏色結點為結束點。書寫 background linear gradie...