qml实现app登录界面

QML 是一种用于创建用户界面的语言，可以轻松地实现应用程序的登录界面。下面是一个简单的示例：

import QtQuick 2.15
import QtQuick.Controls 2.15

ApplicationWindow {
    id: window
    visible: true
    width: 400
    height: 300
    title: "Login"

    // 用于存储用户名和密码的变量
    property string username: ""
    property string password: ""

    Column {
        spacing: 10
        anchors.centerIn: parent

        // 用户名输入框
        TextField {
            id: usernameField
            width: 200
            placeholderText: "Username"
            text: window.username
            onTextChanged: window.username = text.trim()
        }

        // 密码输入框
        TextField {
            id: passwordField
            width: 200
            placeholderText: "Password"
            text: window.password
            echoMode: TextInput.Password
            onTextChanged: window.password = text.trim()
        }

        // 登录按钮
        Button {
            text: "Login"
            onClicked: {
                // 进行登录验证
                if (window.username === "admin" && window.password === "admin123") {
                    console.log("Login success!")
                } else {
                    console.log("Login failed!")
                }
            }
        }
    }
}

在这个示例中，我们创建了一个 `ApplicationWindow`，用于显示登录页面。在窗口中，我们使用 `Column` 布局来排列输入框和按钮。对于每个输入框，我们使用 `TextField` 控件来创建。我们还为每个输入框创建了一个变量，以便在用户输入时更新它们的值。最后，我们使用 `Button` 控件来创建登录按钮，并在用户单击该按钮时执行登录验证。

这只是一个简单的示例，你可以根据自己的需求进行修改和扩展。