[SOLVED] Is it possible to conditionally handle a gradient



  • I've added a gradient to a QML button that I've created for use in other areas of our UI. I need to handle the case where the color of the button is transparent. Is it possible to conditionally display a gradient. When I set the rectangle's color to transparent in the QML designer the gradient is completely removed. Is it possible to do this in the QML?

    Here's an example of my button:

    @

    Rectangle {
    id: rectangle3
    width: rectangle1.width + 20
    height: 462
    color: "#b18b60"

    Rectangle {
        id: rectangle1
        width: 241
        height: 100
        color: "#390dc8"
        anchors.top: parent.top
        anchors.topMargin: 7
        anchors.left: parent.left
        anchors.leftMargin: 10
    

    //
    // Here I would like to say...
    // if ( !color is transparent ) {

        gradient: Gradient {
            GradientStop { position: 0.00; color: "black" }
            GradientStop { position: 0.50; color: "white" }
            GradientStop { position: 1.00; color: "black" }
        }
    

    // }
    }
    }

    @



  • Hi,

    according to documentation of Rectangle

    bq. If both a gradient and a color are specified, the gradient will be used.

    So you can switch between color and gradient, setting gradient to null.

    See this example:

    @
    import QtQuick 2.0

    Rectangle {
    id: rect
    width: 100
    height: 100

    color: "blue"
    
    gradient: Gradient {
        id: grad
        GradientStop { position: 0.0; color: "red" }
        GradientStop { position: 0.33; color: "yellow" }
        GradientStop { position: 1.0; color: "green" }
    }
    
    MouseArea {
        anchors.fill: parent
        onClicked: {
            console.debug(rect.gradient)
            if( rect.gradient != null ) {
                rect.gradient = null
            }
            else
            {
                rect.gradient = grad
            }
        }
    }
    

    }
    @



  • Thank you+


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.