快捷導(dǎo)航

pycharm開(kāi)發(fā)一個(gè)簡(jiǎn)單界面和通用mvc模板(操作方法圖解)

更新時(shí)間：2020年05月27日 11:20:04 作者：teamlet

這篇文章主要介紹了pycharm開(kāi)發(fā)最簡(jiǎn)單的界面和通用mvc模板的方法，本文通過(guò)圖文并茂的形式給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

文章首先使用pycharm的 PyQt5 Designer 做一個(gè)簡(jiǎn)單的界面，然后引入所謂的“mvc框架”。

一、設(shè)計(jì)登錄界面

下面開(kāi)始第一個(gè)話題，使用pycharm的 PyQt5 Designer 做一個(gè)簡(jiǎn)單的界面。

上一篇最后，在pycharm中配置了PyQt5 Designer 和 uic，接下來(lái)，使用這些工具，開(kāi)發(fā)一個(gè)界面。

1、首先打開(kāi) Designer1) 在左側(cè)任意位置（下圖桔色框內(nèi)）點(diǎn)擊右鍵，彈出菜單，在External Tools 選中 PyQt5 Designer

在這里插入圖片描述

2) 打開(kāi) Designer

在這里插入圖片描述

3) 選擇Main Windows ，點(diǎn)擊創(chuàng)建

在這里插入圖片描述

4）新窗口

在這里插入圖片描述

5）修改窗口標(biāo)題

在這里插入圖片描述

6）保存到項(xiàng)目的main目錄下，名稱為 Main.ui

在這里插入圖片描述

7) 轉(zhuǎn)換圖形文件為源代碼

右鍵選中 Main.ui ，彈出菜單，選中 External Tools --> uic

在這里插入圖片描述

生成源代碼 Ui_Main.py
底部提示：Process finished with exit code 0 ，其中 0 表示成功。
如果是 -1 表示執(zhí)行失敗。

在這里插入圖片描述

8）查看源代碼

Designer圖形工具設(shè)計(jì)后生成的源代碼，圖像定義的核心代碼是 setupUi()方法。

# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'D:\projects\pycharm\p377test\main\Main.ui'
#
# Created by: PyQt5 UI code generator 5.13.0
#
# WARNING! All changes made in this file will be lost!
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_MainWindow(object):
 def setupUi(self, MainWindow):
  MainWindow.setObjectName("MainWindow")
  MainWindow.resize(800, 600)
  self.centralwidget = QtWidgets.QWidget(MainWindow)
  self.centralwidget.setObjectName("centralwidget")
  MainWindow.setCentralWidget(self.centralwidget)
  self.menubar = QtWidgets.QMenuBar(MainWindow)
  self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 26))
  self.menubar.setObjectName("menubar")
  MainWindow.setMenuBar(self.menubar)
  self.statusbar = QtWidgets.QStatusBar(MainWindow)
  self.statusbar.setObjectName("statusbar")
  MainWindow.setStatusBar(self.statusbar)
  self.retranslateUi(MainWindow)
  QtCore.QMetaObject.connectSlotsByName(MainWindow)
 def retranslateUi(self, MainWindow):
  _translate = QtCore.QCoreApplication.translate
  MainWindow.setWindowTitle(_translate("MainWindow", "登錄"))

9）總結(jié)

前面，用 PyQt5 Designer 設(shè)計(jì)了一個(gè)界面，保存為 ui 文件；
通過(guò) uic 將 ui 文件轉(zhuǎn)換成 py 代碼。

這個(gè)py代碼還不能執(zhí)行，因?yàn)檫@些代碼只是創(chuàng)建了界面的組件。

需要編寫(xiě)控制代碼，才能顯示界面。

二、通用mvc框架

引入mvc框架的可以解決圖形界面代碼覆蓋的問(wèn)題，實(shí)現(xiàn)界面和控制邏輯分離。

界面生成后，如果把控制邏輯也寫(xiě)進(jìn)界面代碼，下一次修改保存界面就會(huì)把控制邏輯代碼覆蓋。

因此，防止代碼覆蓋的角度，需要將控制邏輯和界面代碼分離，這樣無(wú)論如何怎樣修改界面代碼，也不影響控制邏輯的代碼。

第二點(diǎn)，從設(shè)計(jì)模式為出發(fā)點(diǎn)，考慮客戶端應(yīng)用以及組件的控制方式，mvc模式是最佳的實(shí)踐。通過(guò)將代碼按照界面(View)、數(shù)據(jù)模型(Model)和控制邏輯(Control)進(jìn)行劃分，每一個(gè)部分關(guān)注應(yīng)用的不同功能，代碼分工清晰，責(zé)任明確。

1）新建控制代碼

右鍵點(diǎn)擊 main 目錄，彈出菜單，選擇 New -> Python File

在這里插入圖片描述

2)通用模板

在Main.py中，增加如下內(nèi)容：

# -*- coding: utf-8 -*-
from PyQt5 import QtWidgets
import sys
from Ui_Main import Ui_MainWindow
class MainWindow(QtWidgets.QMainWindow, Ui_MainWindow):
 # ---------------------------------------------------------------------------------
 #
 #  初始化
 #
 # ---------------------------------------------------------------------------------
 def __init__(self):
  super(MainWindow, self).__init__()
  self.setupUi(self)
if __name__ == '__main__': # 判斷本文件是否是啟動(dòng)入口，__main__是系統(tǒng)賦給啟動(dòng)模塊的變量值；
 app = QtWidgets.QApplication(sys.argv) # 如果是啟動(dòng)文件，則創(chuàng)建 Application 實(shí)例 app
 window = MainWindow()     # 創(chuàng)建 MainWindow 的實(shí)例 window
 window.show()       # 顯示窗口
 sys.exit(app.exec_())     # 捕獲 app 退出狀態(tài)

這是一個(gè)通用的、最簡(jiǎn)單的模板。
通過(guò) from Ui_Main import Ui_MainWindow導(dǎo)入圖形界面的定義類。
通過(guò)繼承的方式使用界面類，class MainWindow(QtWidgets.QMainWindow, Ui_MainWindow)，并在初始化方法中，調(diào)用圖形定義代碼 setupUi()

3) 設(shè)置源代碼根目錄

右鍵點(diǎn)擊 main 目錄，選擇 Make Directory as --> Sources Root
在這里插入圖片描述

4) 運(yùn)行

在這里插入圖片描述

上面第3）、4）步圖中的 main.py 應(yīng)為 Main.py。

總結(jié)

到此這篇關(guān)于pycharm開(kāi)發(fā)一個(gè)簡(jiǎn)單界面和通用mvc模板(操作方法圖解)的文章就介紹到這了,更多相關(guān)pycharm開(kāi)發(fā)界面和通用mvc模板內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: