Question

我在QML中有CheckBox元素：

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
import QtQuick.Controls.Material 2.12


Item

{
    id: root

    CheckBox
    {
        id: timeCheckbox
        height: 30
        anchors.left: parent.left
        anchors.leftMargin: 30
        anchors.top: parent.top
        anchors.topMargin: 10
        text: "Display time"
        checked: true
    }

    CheckBox
    {
        id: delayCheckBox
        height: 30
        anchors.left: parent.left
        anchors.leftMargin: 30
        anchors.top: timeCheckbox.bottom
        anchors.topMargin: 10
        text: "Enable Delay"
        checked: true
    }
}

我想将指示器背景颜色更改为蓝色，并将复选标记符号更改为黑色。但是，如果我尝试在CheckBox元素中添加此元素，一切都会中断，并且只会显示蓝色矩形：

indicator: Rectangle 
{
     background: "blue"
}

我也尝试过但没有成功：

Component.onCompleted: indicator.children[0].color = "blue"

对于选中标记颜色，我找不到更改颜色的任何来源。

我有这个：

我想对此进行修改：

欢迎任何提示或帮助。预先感谢。

Answer 1

不幸的是，您无法通过访问属性来修改QML复选框，但是这里有2种可能的解决方案

-1，您可以通过样式表进行如下操作：

 @QCheckBox::indicator{
   background-color: #0000FF;
   }
   @

-2，您可以复制复选框的qml实现并像此处更改de属性

ApplicationWindow {
id: window
title: "Stack"
visible: true
width: 300
CheckBox {
    id: control
    indicator: Rectangle {
    implicitWidth: 28
    implicitHeight: 28

    x: control.mirrored ? control.leftPadding : control.width - width - control.rightPadding
    y: control.topPadding + (control.availableHeight - height) / 2

    color: control.down ? control.palette.light : control.palette.base
    border.width: control.visualFocus ? 2 : 1
    border.color: control.visualFocus ? control.palette.highlight : control.palette.mid

    ColorImage {
        x: (parent.width - width) / 2
        y: (parent.height - height) / 2
        defaultColor: "#353637"
        color: "blue" // you can add your color here
        source: "qrc:/qt-project.org/imports/QtQuick/Controls.2/images/check.png"
        visible: control.checkState === Qt.Checked
    }
    Rectangle {
        x: (parent.width - width) / 2
        y: (parent.height - height) / 2
        width: 16
        height: 3
        color: control.palette.text
        visible: control.checkState === Qt.PartiallyChecked
    }
}
}



}

希望有帮助，再见

如何更改QML复选框指示符和对勾颜色？

1 个答案: