前言

漸變色字體就不多說了，在開發應用中用得很多，之前用LinearGradient來實現，但是一直效果不太理想，在桌面端運行時沒有問題，但是在android上表現不一樣。后來查看官方文檔，找到一種比較好的方法，分享一下。

正文

這里用到的是ShaderEffect類，來看看效果

來看源代碼

Item{width: 200height: 100Rectangle {id: gradientRect;width: 10height: 10gradient: Gradient {GradientStop { position: 0; color: "white" }GradientStop { position: 1; color: "steelblue" }}visible: false; // should not be visible on screen.layer.enabled: true;layer.smooth: true}Text {id: textItemfont.pixelSize: 48text: "Gradient Text"anchors.centerIn: parentlayer.enabled: true// This item should be used as the 'mask'layer.samplerName: "maskSource"layer.effect: ShaderEffect {property var colorSource: gradientRect;fragmentShader: "uniform lowp sampler2D colorSource;uniform lowp sampler2D maskSource;uniform lowp float qt_Opacity;varying highp vec2 qt_TexCoord0;void main() {gl_FragColor =texture2D(colorSource, qt_TexCoord0)* texture2D(maskSource, qt_TexCoord0).a* qt_Opacity;}"}} }

總結

以上是生活随笔為你收集整理的QML做渐变色字体的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。