第14章：QML之TextInput

最新推荐文章于 2025-07-07 23:15:07 发布

原创最新推荐文章于 2025-07-07 23:15:07 发布 · 612 阅读

1 ·

CC 4.0 BY-SA版权

QT5编程与实例专栏收录该内容

66 篇文章

订阅专栏

本文介绍使用Qt Quick 2.x创建带有聚焦功能的输入窗口的方法。通过两个示例展示了如何为输入框设置初始焦点及如何在不同输入框间切换焦点。第一个示例中，通过属性别名简化了对输入框文本的访问；第二个示例则演示了多个TextBox控件之间的焦点导航。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，输入窗口
2，源码

import QtQuick 2.0

FocusScope{
    property alias label: label.text           //定义属性别名
    property alias text: input.text

    Row{
        spacing: 5

        Text{
            id: label
            text: "标签"
        }

        Rectangle{
            width: 100
            height: 20
            color: "white"                      //白底色
            border.color: "gray"                //灰色边框
            TextInput{
                id: input
                anchors.fill: parent
                anchors.margins: 4
                focus: true
                text: "请输入内容"
            }
        }
    }
}

import QtQuick 2.6

Rectangle {
    property alias mouseArea: mouseArea

    width: 360
    height: 360

    MouseArea {
        id: mouseArea
        anchors.fill: parent
    }

    TextBox {
        id: tBx1
        x: 25; y: 25
        focus: true
        label: "学号"
        text: focus ? "" : "请输入内容..."
        KeyNavigation.tab: tBx2
    }

    TextBox {
        id: tBx2
        x: 25; y: 60
        label: "姓名"
        text: focus ? "" : "请输入内容..."
        KeyNavigation.tab: tBx1
    }


}

3，效果
在这里插入图片描述