Question

我需要在QML中实现TimeEdit（HH：MM：SS）字段，类似于QT C ++中的QTimeEdit。在QML中我没有找到TimeEdit，我使用TextField实现了类似于TimeEdit的控件，如果我添加 inputMask ，那么正则表达式根本就没有经过验证，有什么方法可以实现这个目标吗？以下是代码。

import QtQuick 2.7
import QtQuick.Window 2.2
import QtQuick.Controls 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Time Edit")

    TextField{
        id:textEditTD
        text : ""
        inputMethodHints: Qt.ImhDigitsOnly

        inputMask: "dd:dd:dd; "
        validator: RegExpValidator { regExp: /^([0-1]?[0-9]|2[0-3]):([0-5][0-9]):[0-5][0-9]$ / }

        width:100
        height:50
        background:Rectangle{
            color:"transparent"
            border.color: "red"
            border.width:2
            radius:(width * 0.05)
        }
    }
}

Answer 1

我使用以下“向下舍入”QValidator的组合 - 派生时间输入的自定义验证器（添加秒数很简单）：

#pragma once

#include <QTime>
#include <QValidator>

// almost equiv to RegExpValidator { regExp: /(([01][0-9])|(2[0-3])):([0-5][0-9])/ }
class TimeValidator
        : public QValidator
{

    Q_OBJECT

public :

    explicit TimeValidator(QObject * const parent = Q_NULLPTR)
        : QValidator{parent}
    { ; }

    virtual
    State validate(QString & input, int & pos) const Q_DECL_OVERRIDE
    {
        Q_UNUSED(pos);
        const auto parts = input.splitRef(':');
        if (parts.length() != 2) {
            input = QStringLiteral("00:00");
        } else {
            const int hours = qBound(0, parts.first().toInt(), 23);
            const int minutes = qBound(0, parts.last().toInt(), 59);
            const QTime time{hours, minutes};
            Q_ASSERT(time.isValid());
            input = time.toString("hh:mm");
        }
        return Acceptable;
    }

};

template< typename T >
int qmlRegisterClass(int versionMajor = 1, int versionMinor = 0)
{
    const auto className = T::staticMetaObject.className();
    return ::qmlRegisterType< T >(className, versionMajor, versionMinor, className);
}

// ...

qmlRegisterClass< TimeValidator >();

TextFiled与inputMask：

import TimeValidator 1.0

TextField {
    id: timePicker

    verticalAlignment: TextInput.AlignVCenter
    horizontalAlignment: TextInput.AlignHCenter

    text: "00:00"
    inputMask: "00:00;_"

    validator: TimeValidator {}

    inputMethodHints: Qt.ImhDigitsOnly

    // placeholderText: "00:00" // for implicitWidth
    // Layout.minimumWidth: implicitWidth
    // Layout.fillWidth: true
}

Answer 2

我找到了两种实现方法：

1）我更改了 Orient 答案以满足我的要求，以下是按下document.ready()时有效的更改：

backspace

2）只需更改virtual State validate(QString & input, int & pos) const Q_DECL_OVERRIDE { const QStringList parts = input.split(":"); if (parts.length() != 3) { input = QStringLiteral("00:00:00"); } else { int hours = 0; int minutes = 0; int seconds = 0; //hours if(parts[0].toInt() > 23){ hours = 23; pos +=1; //Increment the position } else{ QString str = parts[0]; if(str.contains(" ")){ str.replace(" ","0"); } hours = str.toInt(); } // Minutes if(parts[1].toInt() > 59){ minutes = 59; pos +=1; //Increment the position } else{ QString str = parts[1]; if(str.contains(" ")){ str.replace(" ","0"); } minutes = str.toInt(); } //Seconds if(parts[2].toInt() > 59){ seconds = 59; pos +=1; //Increment the position } else{ QString str = parts[2]; if(str.contains(" ")){ str.replace(" ","0"); } seconds = str.toInt(); } const QTime time{hours, minutes,seconds}; Q_ASSERT(time.isValid()); input = time.toString("hh:mm:ss"); } return Acceptable; }和inputMask非常简单：

RegExp

QML中的时间输入字段

2 个答案: