QT時鐘控制元件顯示

import QtQuick 2.6
import QtQuick.Layouts 1.3
/*
 * 作者: yubo
 * 功能: Time
 * 描述: 時間時鐘顯示
 * 日期: 2018-07-12
 */
Item {
    property var timeSetValueId: [ hourTen, hourBit, miniuteTen, miniuteBit ]
    property alias hourTenValue: hourTen.infoValue
    property alias hourBitValue: hourBit.infoValue
    property alias miniuteTenValue: miniuteTen.infoValue
    property alias miniuteBitValue: miniuteBit.infoValue

    RowLayout {
        width: 300
        TextFieldAuto {
            id: hourTen
            width: 30
            fontFamilyType: 0
            valueWidth: 40
            valueFontSize: 45
            infoValue: hourTenValue
        }
        TextFieldAuto {
            id: hourBit
            width: 30
            fontFamilyType: 0
            valueWidth: 40
            valueFontSize: 45
            infoValue: hourBitValue
        }
        TextFieldAuto {
            width: 30
            valueWidth: 40
            valueFontSize: 45
            infoValue: ":"
        }
        TextFieldAuto {
            id: miniuteTen
            width: 30
            fontFamilyType: 0
            valueWidth: 40
            valueFontSize: 45
            infoValue: miniuteTenValue
        }
        TextFieldAuto {
            id: miniuteBit
            width: 30
            fontFamilyType: 0
            valueWidth: 40
            valueFontSize: 45
            infoValue: miniuteBitValue
        }
    }
}

import QtQuick 2.6

/*
 * 作者: yubo
 * 功能: 文字控制元件
 * 描述: Text進行一層包裝，方便修改
 * 日期: 2018-07-12
 */
Item {
    // 文字
    property string infoValue: ""
    // 文字顏色
    property string valueColor: "#ffffff"
    // 文字字型大小
    property int valueFontSize: 25
    // 斜體字型
    property bool fontItalic: false
    // 粗體字型
    property bool fontBold: false
    // 文字寬度
    property real valueWidth: 200
    // 文字字型 1:文字字型 其他:數值字型
    property int fontFamilyType: 1
    // 文字對齊方式 0:居中 1:左對齊 2:右對齊
    property int valuePositionType: 0

    property bool isWrap: true

    Text {
        id: infoValueText
        width: valueWidth
        wrapMode: isWrap ? Text.Wrap : Text.NoWrap
        lineHeight: 1.4
        horizontalAlignment: {
            if (valuePositionType === 1) {
                Text.AlignLeft;
            } else if (valuePositionType === 2) {
                Text.AlignRight;
            } else {
                Text.AlignHCenter;
            }
        }
        text: ML.lan(infoValue)
        color: valueColor
        font.pixelSize: valueFontSize
        font.letterSpacing: 3
        font.family: fontFamilyType === 1 ? UiController.font["SourceHanSansCN"] : UiController.font["YZKJ8"]
        font.italic: fontItalic
        font.bold: fontBold
    }
}