pyqt+qml学习实战demo，简单登录窗口界面-CFANZ编程社区

这次，学习了基本的布局和一些布局属性，我打算搞个登录窗口界面了。有了一点基本的基础之后，实战是提升最快的了。

同理啊，我们先进行百度，我们需要一个文本框，一个按钮，一个输入框的代码，这些我都不知道怎么写，如此，我们便需要进行百度学习了。

首先，百度，qtquick 输入框

很明显第一个非常符合我的要求。打开第一篇文章

继续上节课的代码，将代码删至如图所示。我就得到了一个居中显示的浅蓝色背景的方块框框。

然后我就将现在搜索到的这个文字的代码融入我的代码中

TextInput {
                anchors.fill: parent
                anchors.margins: 2
                font.pointSize: 15
                focus: true
                 onAccepted: console.log("accepted")
            }

这段代码，一看就是个文本输入框的控件，于是我把它放在Text控件下方

可以看到，这样也是可以的，虽然我不知道是不是这么做，但是先复制进去运行一下，看看效果，既然能运行，说明没问题可以这么写，那么我就开始来改下位置布局的代码了

我的想法是，将输入框的左边定在标签的右边，运行之后发现跟想象的一样，但是输入框好像还差点东西，没有背景和边框，于是回到文章中，

我发现它是用父级框框的颜色来设置的，于是我就想，直接把边框的属性放进TextInput里面，

运行发现，不能这么设置，那么就只好把文章的代码复制过来了，哈哈

按照我自己的想法，将代码改成这样

如此一来就符合了，但是我想账号：这个文本，跟右边的文本框上下能居中

经过自己的改造发现这样了，报错了，说明我们的写法有毛病，这时候我看到了这篇文章用到了row这个对象，来让他们处于同一行，于是乎直接复制他们的代码。

将row的代码替换我们Rectangle里面的全部代码，发现非常完美。。。。。

如法炮制，多复制了一个Row的全部代码，放在下面，然后设置对应的Id，接着将位置固定在第一个Row的下方。如此我们便可以得到一个

现在缺少一个按钮，我想让它放在他们右下方。同样的百度搜素

这边我看的是这个文章

 Button{
        x:100  // 设置按钮的横坐标
        y:100  // 设置纵坐标
        text:"我是按钮"   // 按钮文本
 
        // 信号槽连接
        onClicked: {
            console.log("我被点击了")
        }
    }

我将这段代码复制到密码的Row下方，然后运行。。提示这个