QT界面的登录界面以及注册界面的构建以及连接

最新推荐文章于 2024-05-17 06:04:14 发布

charming70

最新推荐文章于 2024-05-17 06:04:14 发布

阅读量1.1k

点赞数 26

文章标签： qt 开发语言

本文链接：https://blog.csdn.net/weixin_62533671/article/details/136790153

版权

QT界面的登录界面以及注册界面构建

一、登录界面

我的登录界面是这样设计的，可以供大家参考，先使用qt designer将这个图片的样子建立好

1、登录界面的qt designer设计过程

其中“password lock”以及“login now”他们的类型是Qlabel，选中label将其拖到对应位置，然后将对应的内容进行输入，如果想要改变文字的样式，可以点击label然后右击，选择“改变样式表”

其中“password lock”对应的样式为“color: rgb(156, 182, 255);”“login now”对应的样式为“font: 87 20pt "Arial Black";”

其中输入ID和密码的框为QLineEdit，选中该控件并将其拖到适当的位置以及大小，然后选择属性编辑器找见placehotext，在后边输入你想要输入的文字即可，当你对密码框进行设计时，需要找见属性编辑器里边的echoMode选择为Password，这样就可以实现，你输进去密码的时候，他是加密的状态。
“sign in”以及“sign up”为pushbutton控件，选择好后将其拖到对应的位置，然后修改其样式，我采用的样式为
"background-color: qlineargradient(spread:pad, x1:0.52, y1:1, x2:0.54, y2:0,

stop:0.0112994 rgba(156, 182, 255, 255),

stop:1 rgba(255, 255, 255, 255));

color: rgb(255, 255, 255);

border:0px groove gray;border-radius:

7px;padding:2px 4px;

font: 14pt "Candara";"
右边的图片为QFrame控件，将该控件修改成该对应的大小，然后右击改变样式表-添加资源-background image选择对应的照片即可，这样登录界面就设计完成了。

二、注册界面

注册界面的样式如下图所示

由于本界面使用的控件和登录界面相同，所以我只介绍，文字的样式即可

“hello welcome to us”的样式为：“font: 87 20pt "Arial Black";”
确定以及返回登录两个按钮的样式为：
“background-color: rgb(29, 123, 255);

color: rgb(255, 255, 255);

font: 25 9pt "Bahnschrift Light";”

三、将.ui文件转化为.py文件

当界面设计好之后，将其进行保存，保存完毕后打开pycharm会出现一个.ui的文件，右击该文件，

点击QT UIC就可以将其转化为.py文件，生成的.py文件，需要在代码最后添加这些语句，代码才能出现界面

if __name__ == '__main__':
    app = QApplication(sys.argv)
    main = 你的界面名称()
    main.show()
    sys.exit(app.exec_())

四、登录界面和注册界面的切换

当点击登录界面的“sign up”时会跳转到注册界面，点击注册界面的“click there to return login”时，会跳转到登录界面，我将介绍如何点击“sign up”跳转到注册界面

首先找见，sign up这个按钮的名称是什么，我这里的名称叫做self.zhuce,在和sefl.zhuce有关的最后一行添加一句，然后我们建立一个show_register_window的函数，其函数如下所示，这样就可以实现登录界面到注册界面的转化了

self.zhuce.clicked.connect(self.show_register_window)

def retranslateUi(self, MainWindow):
    _translate = QtCore.QCoreApplication.translate
    MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
    self.label2image.setText(_translate("MainWindow", "Login now"))
    self.username.setPlaceholderText(_translate("MainWindow", "Please input your ID"))
    self.password.setPlaceholderText(_translate("MainWindow", "Please input your password"))
    self.zhuce.setText(_translate("MainWindow", "Sign up"))
    self.denglu.setText(_translate("MainWindow", "Sign in"))
    self.label.setText(_translate("MainWindow", "<html><head/><body><p><span style=\" font-size:12pt; font-weight:600; color:#9cb6ff;\">Password Lock</span></p></body></html>"))

注册界面的程序有点复杂，不好介绍，如果有需要可以评论，到时候发给大家