Qml 时间控件，并完成24小时制，与12小时制的切换

最新推荐文章于 2023-06-30 17:24:20 发布

xiaofengyiyue

最新推荐文章于 2023-06-30 17:24:20 发布

阅读量854

点赞数

分类专栏： QML 文章标签： qml c++

本文链接：https://blog.csdn.net/xiaofengyiyue/article/details/119322176

版权

这篇博客介绍了如何使用Qml创建一个自定义的时间控件，该控件支持在24小时制和12小时制之间切换。文章提供了一份完整的代码示例，包括用于切换制式的按钮实现，可以将其作为一个独立的Qml组件使用。

摘要由CSDN通过智能技术生成

此为自定义组件，为完整代码

import QtQuick 2.4
import QtQuick.Controls 1.4
import QtQuick.Window 2.2
import QtQuick.Controls.Styles 1.4
import QtQuick.Controls 2.14
Item {
    property string hour:(new Date().toLocaleTimeString(Qt.locale(),"hh"))
    property string minute: (new Date().toLocaleTimeString(Qt.locale(),"mm"))
    property string second: (new Date().toLocaleTimeString(Qt.locale(),"ss"))
    property string system   //小时制,作为一个标记
    id:main
    visible: true;
    onSystemChanged: {//当标记system发生变化是触发，进行小时制的切换。
        if(system == "12"){//12小时制
            main.hour = Number(main.hour)
            shangxiawu.text = main.hour >= 12?"下 午":"上 午"   //显示上午下午，12点为下午，0点为上午
            //数值转换大于12减去12.小于12不变，0点变为12点
            if(main.hour > 12)
                main.hour = Number(main.hour) - 12
            if(main.hour == 0)
                main.hour = 12
            hour_text.text = main.hour
        }
        else{//24小时制
            if(shangxiawu.text == "下 午"&&Number(main.hour)!=12)//下午并且不为12点数值加12
                main.hour = Number(main.hour) + 12
            else if(shangxiawu.text == "上 午"){
                if(main.hour < 10)
                    main.hour = "0" + main.hour
                if(main.hour == 12)
                    main.hour = "00"
            }
            hour_text.text = main.hour
            shangxiawu.text = ""  //24小时制，显示空字符
        }
    }

    Column{//小时
        id:hour_layout
        anchors.top: parent.top
        width: 90
        anchors.left: parent.left
        anchors.leftMargin: 20
        spacing: 2
        Button{//实现小时加
            id:hour_add
            width: 90
            height: 30
            autoRepeat: true
            Text {
                id: add_hour
                anchors.centerIn: parent
                text: qsTr("+")
                font.pixelSize: 22
            }
            background: Rectangle{
                id:rec_bg_hour_add
                border.color: "#4F94CD"
                border.width: 2
            }
            onPressed: rec_bg_hour_add.color = "#B5B5B5" //点下去变色
            onReleased: rec_bg_hour_add.color = "white" //释放恢复原色
            onClicked: {
                main.hour++
                if(system == "24"){//24小时制
                    if(main.hour == 24)
                        main.hour = 0
                    if(main.hour < 10)
                        hour_text.text="0"+main.hour
                    else
                        hour_text.text=main.hour
                }
                else{//12小时制
                    if(Number(main.hour) > 12)
                        main.hour = 1
                    if(Number(main.hour) == 12){
                        if(shangxiawu.text == "上 午")
                            shangxiawu.text = "下 午"
                        else
                            shangxiawu.text = "上 午"
                    }
                }
                hour_text.text = main.hour
            }
        }
        Rectangle{//显示
            id:hour_rec
            width: hour_add.width
            height: hour_add.height
            border.color: "#c8c4c4"
            border.width: 1
            Label{
                id:hour_text
                text