aspnet登录界面代码_PyQt5：使用QT设计师设计界面

一. 界面设计

登录预览：

图1.1 设计界面

二. 生成PyQt5代码

2.1 环境

为了使用PyQt5，需要安装PyQt5模块，这里使用pip进行安装：

pip3 install PyQt5

PyQt5安装完成之后，就可以运行.py文件了。为了方便打包文件成独立的可执行文件，还需要安装pyinstaller,使用pip安装即可：

pip3 install pyinstaller

以上环境基于window，Python版本为3.6.2

注：使用pip3安装只支持Python3.5往后的版本，如果使用使用2.x版本的python，需要下载源码进行安装

2.2 生成.py模块

这个步骤与Qt的qmake命令一样，根据ui文件生成对应的源码文件，除了ui文件,.qrc文件同样需要转为.py模块

1. 转换.ui为文件为.py文件，可以使用pyuic5命令来转换文件:

pyuic5 login.ui -o ui_login.py

-o ui_login.py表示输出到ui_login.py文件，如果没有-o参数，将会打印python代码到控制台。

资源文件(.qrc)使用pyrcc5命令来转换:

pyrcc5 qtdesigner.qrc -o qtdesigner_rc.py

转换资源文件，对文件名有命名规则：主文件名_rc.py。其中主文件名必须是.qrc的主文件名，否则在运行python文件的时候出现qtdesigner_rc模块找不到的问题。

2.3 扩展Ui_LoginDialog类

生成python代码后，需要把Ui_LoginDialog类与QMainWindow类绑定在一起(注：在设计登录界面时使用的是QMainWindow，因此在扩展时也需要使用QMainWindow), Login.py文件内容如下：

# coding:utf-8from PyQt5.QtWidgets import QMainWindowfrom PyQt5.QtGui import QMouseEventfrom PyQt5 import Qtimport ui_loginclass LoginDialog(QMainWindow, ui_login.Ui_MainWindow): def __init__(self): super().__init__() self.setupUi(self)

以上代码中，定义了一个LoginDialog类，这个类扩展了QMainWindow类以及ui_login.Ui_MainWindow,QMainWindow类是QtPy5提供的窗体类，ui_login.Ui_MainWindow则是使用pyuic5命令生成的界面类。代码self.setupUi(self)功能与C++版本的Qt一样。

2.4 启动界面

以上几上步骤仅仅是将界面类封装了，还没有启动界面的地方，这里使用app.py文件来作为程序入口：

import sysfrom PyQt5.QtWidgets import QApplicationimport Loginif __name__ == '__main__': app = QApplication(sys.argv) win = Login.LoginDialog() win.show() sys.exit(app.exec_())

1. app = QApplication(sys.argv):Qt程序的常规启动操作
2. win = Login.LoginDialog():创建登录窗口
3. win.show():显示窗口
4. sys.exit(app.exec_()):执行app

从以上四行代码可以看出，PyQt5开发的代码与Qt开发的代码有惊人的相似之处。

直接执行python app.py即可启动

图2.4.1 运行界面

2.5 为按钮添加响应事件

与Qt一样，PyQt5使用“信号和槽”来作为通信机制

2.5.1 为取消按钮添加事件

定义槽：

def onCancleClicked(self): self.close()

在__init()__中添加连接“信号和槽”:

def __init__(self): super().__init__() self.setupUi(self) self.mBtnCancel.clicked.connect(self.onCancleClicked)

以上代码实现点击取消按钮程序退出

2.5.2 为登录按钮添加事件

定义槽：

def onLoginClicked(self): name = self.mTextUserName.text() passwd = self.mTextPassword.text() QMessageBox.information(None, "登录提示