QML登录界面

import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 2.2
import QtGraphicalEffects 1.0
import QtQuick.Layouts 1.3
ApplicationWindow {
    id: root
    visible: true
    width: Screen.width
    height: Screen.height
    title: qsTr("登录雷达作战系统")
    Component.onCompleted: {
        root.visibility = Window.Maximized
    }
    Image {
        anchors.fill: parent
        source: "qrc:/img/earth.jpg"
    }

    Item {
        width:
        height:
        anchors.centerIn: parent
        //一个圆形图片
        Item {
            width: parent.width
            height: parent.height
            Image {
                id: rdJpg
                anchors.centerIn: parent
                smooth: true
                visible: false
                source: "qrc:/img/rd.jpg"
            }
            Rectangle {
                id: mask
                width: parent.width
                height: parent.height
                radius: width/
                visible: false
            }
            OpacityMask {
                anchors.fill: parent
                source: rdJpg
                maskSource: mask
            }
        }

        //用户输入
        Item {
            width:
            height:
            anchors.bottom: parent.bottom
            anchors.bottomMargin:
            anchors.horizontalCenter: parent.horizontalCenter

            GridLayout {
                id: grid
                rows:
                columns:
                width:
                height:
                columnSpacing:
                Text {
                    text: qsTr("用户名")
                    font.pointSize:
                    color: "black"
                }
                TextField {
                    id: filedUsr
                    Layout.preferredHeight:
                }
                Text {
                    text: qsTr("密码")
                    font.pointSize:
                    color: "black"
                }
                TextField {
                    id: filedPawd
                    Layout.preferredHeight:
                }
            }

            //登录按钮
            Rectangle {
                id: logBtn
                width:
                height:
                color: "#6facf9"
                radius:
                border.width:
                border.color: "black"
                Text {
                    color: "#ffffff"
                    text: qsTr("登录")
                    anchors.centerIn: parent
                    font.pointSize:
                }
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.top: grid.bottom
                anchors.topMargin: 

                MouseArea {
                    anchors.fill: parent
                    hoverEnabled: true
                    onEntered: {
                        logBtn.color = "#333333"
                    }
                    onPressed: {
                        logBtn.color = "#111111"
                    }
                    onReleased: {
                        logBtn.color = "#333333"
                    }

                    onExited: {
                        logBtn.color = "#6facf9"
                    }
                }
            }
        }

    }

}