2

私はこれを持っています：

    Rectangle{
    id:testrect

    property color gradcolor:"#8C8F8C"
    gradient:
        Gradient {
        GradientStop { position: 0.0; color: gradcolor }
        GradientStop { position: 0.17; color: "#6A6D6A" }
        GradientStop { position: 0.77; color: gradcolor }
        GradientStop { position: 1.0; color: "#6A6D6A" }
        }

子 MouseArea で、私はこれをしたい:

         onEntered: {
            testrect.gradcolor="white"
            parent.border.color = Qt.lighter("#6A6D6A")

境界線の色は希望どおりに変化していますが、グラデーションの色は変化していません。グラデーションが gradcolor プロパティからリアルタイムでプルされていないためですか? これにアプローチする最良の方法は何ですか？

4

2 に答える 2

4

どの要素にプロパティが含まれているかを指定しないと、Gradient要素がリンクされていないことが問題のようです。gradcolorこれは私のために働く：

Rectangle{
    id:testrect
    width: 200
    height: 200
    property color gradcolor: "green"
    gradient: Gradient {
        GradientStop { position: 0.0; color: testrect.gradcolor }
        GradientStop { position: 0.17; color: "#6A6D6A" }
        GradientStop { position: 0.77; color: testrect.gradcolor }
        GradientStop { position: 1.0; color: "#6A6D6A" }
    }

    MouseArea {
        anchors.fill:parent
        hoverEnabled: true  // Mandatory for hover events to work
        onEntered: {
            testrect.gradcolor = "red";
        }
        onExited: {
            testrect.gradcolor = "blue";
        }
    }
}

QML スコープの詳細については、こちらを参照してください。

于 2013-08-08T08:54:51.373 に答える
2

QMLでキャンバスとグラデーションの使用を探しているときに、この答えを見つけました

import QtQuick 2.0
Canvas {
    id:canvas
    property var ctx
    onPaint:{
        ctx = canvas.getContext('2d');
        ctx.strokeStyle = Qt.rgba(0, 1, 1, 1);
        ctx.lineWidth = 1;
        ctx.beginPath();
        var radgrad = ctx.createRadialGradient(75,50,5,90,60,100);
        radgrad.addColorStop(0, '#A7D3FC');
        radgrad.addColorStop(0.5, '#019F62');
        radgrad.addColorStop(0.9, 'rgba(1,159,98,0)');
        ctx.arc(100,75,50,0,2*Math.PI);
        ctx.fillStyle = radgrad;
        ctx.fill(0,10,10,10);
        ctx.stroke();
    }

    width: 360
    height: 360

    MouseArea {
        anchors.fill: parent
        onClicked: {
            var p = ctx.getImageData(mouseX, mouseY, 1, 1);
            var red = p.data[0];
            var green = p.data[1];
            var blue = p.data[2];
            var alpha = p.data[3];
        }
    }
}

ここで関連性があるかどうかはわかりませんが、ここに置くことができると思った情報と同じように、これは私にとってはうまくいきましたありがとう

于 2013-08-21T08:31:01.830 に答える