Important: Please read the Qt Code of Conduct -

[solved] QML TextInput with Time format hh:mm:ss

  • Hi,

    i need a user input with time format hh:mm:ss and did it this way below. But it is still
    possible to enter something like "12:90:11" and 90 minutes is not possible. The input
    should be checked for hours from 1 to 99 hours, minutes and seconds between 0 to 59.
    How can i do that?
    PS: I don't know why <code> doesn't work?

    import QtQuick 2.4
    import QtQuick.Controls 1.3
    import QtQuick.Window 2.2
    import QtQuick.Layouts 1.1
    ApplicationWindow {
        title: qsTr("Hello World")
        width: 640
        height: 480
        visible: true
        property string currentintervall: "00:00:00"
        ColumnLayout {
            Text {
                id: li_userinput_text
                opacity: 1
                text: "User Interval: "
            TextInput {
                opacity: 1
                id: li_userinput_edit
                // font.pointSize: 12
                inputMask: "00:00:00"
                cursorVisible: true
                inputMethodHints: Qt.ImhTime
                text: "00:00:00"
                onAccepted: currentintervall = li_userinput_edit.text
            Text {
                text: "Current Interval: "
            Text {
                height: 40
                //font.pointSize: 12
                width: parent.width
                text: currentintervall

    Edited : Use ``` (3 backticks) instead - p3c0

  • Moderators

    @HappyCoder Apart from using inputMask you will also need to set a validator. RegExpValidator would be perfect choice for it. A common validator for hh:mm:ss I found was this /^(?:(?:([01]?\d|2[0-3]):)?([0-5]?\d):)?([0-5]?\d)$/
    Usage is simple:

    validator: RegExpValidator { regExp: /^(?:(?:([01]?\d|2[0-3]):)?([0-5]?\d):)?([0-5]?\d)$/ }

    You can also find another validators.

Log in to reply