在QML中使用Gradient可以来实现颜色的一组渐变,但是却只能实现垂直线上的渐变,无法横向渐变,所以我就通过旋转属性rotation来将上下渐变的颜色旋转90度变成横向渐变,详细代码如下:
Rectangle{
id:btnrec
anchors.centerIn: parent
width:btn.height
height:btn.width
radius:5
smooth:true
gradient: Gradient{
GradientStop{position: 0.0; color: color1}
GradientStop{position: 1.0; color: color2}
}
rotation: 90
transformOrigin: "Center"
}
其中transformOrigin属性是确定旋转的中心点,position属性是渐变的颜色位置,从0.0到1.0之间选取。