如何在不破坏内部绑定的情况下从外部初始化自定义项的属性？

Question

我正在尝试为 HSL 组件制作一个带有三个滑块的颜色调整面板。它包含一个可重复使用的 ColorPanel 项：

Item {
    id: root

    property color color: Qt.hsla(sliderH.value, sliderS.value, sliderL.value, 1.0)

    implicitWidth: 300; implicitHeight: 100

    Rectangle { anchors.fill: parent }

    Column {
        width: parent.width

        Slider { id: sliderH }
        Slider { id: sliderS }
        Slider { id: sliderL }
    }
}

我在 main.qml 中使用了两次，一次用于调整 Label 的背景颜色，另一次 - 调整其文本颜色：

ApplicationWindow {
    width: 500; height: 400
    visible: true
    title: qsTr("Color Setup")

    header: RowLayout {
        spacing: 10

        ColorPanel { id: colorText }
        ColorPanel { id: colorBackground }
    }

    Label {
        anchors.centerIn: parent
        color: colorText.color
        text: qsTr("How to initialize the colors?")
        font.pointSize: 22; padding: 11

        background: Rectangle { color: colorBackground.color }
    }
}

这个非常简短的示例产生以下 UI：

我确实能够通过用鼠标移动滑块来设置 Label 的背景和前景（文本）颜色。但是，在程序启动时 Label 是黑色的，因为滑块位于 0。我当然可以将它们设置为不同的值，但这无济于事，因为它仍然会导致两种颜色相同并且文本仍然不可见。因此，我需要将两个面板的 color 属性初始化为不同的值。

问题是，当我写这样的东西来初始化颜色时：

ColorPanel { id: colorText; color: "red" }
ColorPanel { id: colorBackground; color: "green" }

颜色确实在启动时设置为所需值，但新绑定打破了 Qt.hsla(sliderH.value, sliderS.value, sliderL.value, 1.0) 的内部绑定，无法再使用滑块设置颜色。

到 How to set initial value of a custom slider in qml? 建议将属性设为别名，例如property alias color:，但我应该参考什么？

如何解决？

Answer 1

您可以将 initialColor 属性添加到 ColorPanel 并将滑块连接到它，如下所示：

Item {
    id: root

    property color initialColor
    property color color: Qt.hsla(sliderH.value, sliderS.value, sliderL.value, 1.0)

    implicitWidth: 300; implicitHeight: 100

    Rectangle { anchors.fill: parent }

    Column {
        width: parent.width

        Slider { id: sliderH; value: initialColor.hslHue }
        Slider { id: sliderS; value: initialColor.hslSaturation }
        Slider { id: sliderL; value: initialColor.hslLightness }
    }
}

然后在 main.qml 而不是 color 中，像这样使用 initialColor：

ColorPanel { id: colorText; initialColor: "red" }
ColorPanel { id: colorBackground; initialColor: "green" }

如何在不破坏内部绑定的情况下从外部初始化自定义项的属性？

How to initialize a property of a custom item from outside without breaking the internal bindings?

windows

qt

qml

qt5

如何在不破坏内部绑定的情况下从外部初始化自定义项的 属性？

How to initialize a property of a custom item from outside without breaking the internal bindings?

windows

qt

qml

qt5

如何在不破坏内部绑定的情况下从外部初始化自定义项的属性？