如何使用滑块初始化自定义颜色调整面板的颜色?

我试图做一个颜色调整面板与三个滑块的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 }
    }
}

我确实能够设置的背景和前景(文本)的颜色 标签 用鼠标移动滑块。但是,在程序中启动 是黑色的,因为滑块在 0 . 当然,我可以将它们设置为不同的值,但这不会有帮助,因为这仍然会导致两种颜色相同,文本仍然不可见。所以,我需要初始化 color 属性设置为不同的值。

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

Qt.hsla(sliderH.value, sliderS.value, sliderL.value, 1.0) 而且不能再使用滑块设置颜色了。

这个 accepted answer 如何在qml中设置自定义滑块的初始值? 建议将属性设为别名,例如。 property alias color: ,但在我的案例中我应该参考什么呢?