Qt笔记-qml-radionButton

最新推荐文章于 2024-08-20 02:23:12 发布

csq镜子的月亮

最新推荐文章于 2024-08-20 02:23:12 发布

阅读量614

点赞数

分类专栏： QT qt学习文章标签： qt radio button qml

本文链接：https://blog.csdn.net/cookic12346/article/details/78284610

版权

QT 同时被 2 个专栏收录

17 篇文章 0 订阅

订阅专栏

qt学习

16 篇文章 1 订阅

订阅专栏

qml自定义RadioButton (暂时只做了双态)

 import QtQuick 2.0

import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

Item {
    id: item

    property string text: ""
    property bool   checked: true

    // 单选框框风格组件
    Component{
        id: radioStyle;
        RadioButtonStyle{
            indicator: Rectangle{
                implicitHeight: radioButtonImage.height;
                implicitWidth: radioButtonImage.width;
                color: "#00000000"

                Rectangle{
                    id: myCheck
                    anchors.fill: parent;
                    state:
                    {

                        if ( control.checked )
                            state: "radioCheck";
                        else
                            state:"radioNoCheck";
                    }
                    color: "#00000000"

                    property string imageSource: ""
                    property string imageChecked: "qrc:/image/RadioButtonChecked.png"
                    property string imageNoChecked: "qrc:/image/RadioButtonNoChecked.png"


                    Image {
                        id: radioButtonImage
                        source: myCheck.imageSource
                    }

                    states: [
                        State {
                            name: "radioCheck"
                            PropertyChanges {
                                target: myCheck
                                imageSource:imageChecked;
                            }
                        }
                        ,State {
                            name: "radioNoCheck"
                            PropertyChanges {
                                target: myCheck
                                imageSource:imageNoChecked;
                            }
                        }
                    ]

                }
            }

            label:Text{
                //color: control.activeFocus?"blue":"black";
                color: "#444444"
                font.pointSize: 14
                text:control.text;
            }
        }

    }

    //具体单选框
    RadioButton{
        text:     item.text;
        checked:  item.checked;
        focus: true;
        activeFocusOnPress:  true;
        style:radioStyle;
    }
}

使用：

CRadionButton{
    anchors.top: rect.bottom;
    anchors.topMargin: 4;
    anchors.left: rect.left;
    anchors.leftMargin: 10;

    text: "是否可用"
    checked: false
}