qml写一个自适应登录框

1、前言

写一个可自由伸缩的登录框，，（横向上）
关键：给相关控件赋予 Layout.fillWidth: true 属性 即可。

2、代码

//main.qml
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQml 2.12
import QtQuick.Layouts 1.12ApplicationWindow {id: windowvisible: truewidth: 500height: 320ColumnLayout {anchors.fill: parentanchors.bottomMargin: 50anchors.leftMargin: 50anchors.rightMargin: 50anchors.topMargin: 50spacing: 6Label {text: "登录"font.bold: truefont.family: "微软雅黑"font.pixelSize: 20horizontalAlignment: Text.AlignHCenterLayout.bottomMargin: 10Layout.fillWidth: true}RowLayout {Label {text: "用户名:"Layout.preferredWidth: 50Layout.fillWidth: trueLayout.maximumWidth: 50}TextField {Layout.fillWidth: trueLayout.preferredWidth: 200placeholderText: "请输入用户名"}}RowLayout {Label {text: "密码:"Layout.fillWidth: trueLayout.maximumWidth: 50Layout.preferredWidth: 50}TextField {Layout.fillWidth: trueLayout.preferredWidth: 200placeholderText: "请输入密码"}}RowLayout {spacing: 20Button {text: "登录"Layout.alignment: Qt.AlignHCenterLayout.fillWidth: true}Button {text: "取消"Layout.alignment: Qt.AlignHCenterLayout.fillWidth: true}}}
}