Qt5 动态载入 *.ui 文件,及使用其图元对象(基于pyqt5描述)

参考:《PyQt5:uic 官方教程

工具 pyuic5 的使用

如果没有安装,则可以通过以下指令安装 pyuic5:

sudo apt-get install pyqt5-dev-tools

Usage: pyuic5 [options] <ui-file>

Options:
  -p, --preview  show a preview of the UI instead of generating code
  -o FILE      write generated code to FILE instead of stdout
  -x, --execute   generate extra code to test and display the class
  -d, --debug    show debug output
  --from-imports  generate imports relative to '.'
  --resource-suffix=SUFFIX  append SUFFIX to the basename of resource files  [default: _rc]

 

动态载入UI文件及图元对象

import 模块

import PyQt5.uic

其内容如下:

  • PACKAGE CONTENTS
    • Compiler (package)
    • Loader (package)
    • driver
    • exceptions
    • icon_cache
    • objcreator
    • port_v3 (package)
    • properties
    • pyuic
    • uiparser
  • SUBMODULES
    • compiler
    • indenter

how to use it

常用方法包括:

compileUi(uifile, pyfile, execute=False, indent=4, from_imports=False, resource_suffix='_rc')

compileUiDir(dir, recurse=False, map=None, **compileUi_args)

loadUi(uifile, baseinstance=None, package='') -> widget

loadUiType(uifile, from_imports=False) -> (form class, base class)

 注意后两个函数,功能强大——它们首先动态编译了ui文件并存储在内存;然后

  • 对于loadUiType(),它导出一个tuple,装载着ui的图元类及其基类;
  • 对于loadUi(),它导出一个ui图元类的实例对象。

(请忽略崩溃的bug,它要求QApplication已经运行……)

在Qt5中应用MVC模式并调取 *.ui 文件(作为View)

使用uic动态载入 *.ui 的窗口对象

拓展:创建自定义Widget,并在UI Designer中载入新控件

模块化:页面嵌套的积木设计

复用性:使用容器窗口类封装自定义Widget

Qt5的容器窗口(Containers Widgets)

以上控件从上到下依次是:

  • 组合框
  • 滚动区
  • 工具箱
  • 切换卡
  • 控件栈
  • 框架
  • 组件
  • MDI窗口显示区
  • 停靠窗口
  • ActiveX...(呃,这个怎么表达)

这里仅对 QStackedWidget 加以说明:

The QStackedWidget class provides a stack of widgets where only one widget is visible at a time. QStackedWidget can be used to create a user interface similar to the one provided by QTabWidget. It is a convenience layout widget built on top of the QStackedLayout class.

Like QStackedLayout, QStackedWidget can be constructed and populated with a number of child widgets ("pages"):

QWidget *firstPageWidget = new QWidget;
QWidget *secondPageWidget = new QWidget;

QStackedWidget *stackedWidget = new QStackedWidget;
stackedWidget->addWidget(firstPageWidget);
stackedWidget->addWidget(secondPageWidget);

QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(stackedWidget);
setLayout(layout);

// 连接槽函数
connect(pageComboBox, SIGNAL(activated(int)),
        stackedWidget, SLOT(setCurrentIndex(int)));

When populating a stacked widget, the widgets are added to an internal list. The indexOf() function returns the index of a widget in that list. The widgets can either be added to the end of the list using the addWidget() function, or inserted at a given index using the insertWidget() function. The removeWidget() function removes a widget from the stacked widget. The number of widgets contained in the stacked widget can be obtained using the count() function.

The widget() function returns the widget at a given index position. The index of the widget that is shown on screen is given by currentIndex() and can be changed using setCurrentIndex(). In a similar manner, the currently shown widget can be retrieved using the currentWidget() function, and altered using the setCurrentWidget() function.

Whenever the current widget in the stacked widget changes or a widget is removed from the stacked widget, the currentChanged() and widgetRemoved() signals are emitted respectively.

示例

效果预览

(读者们,忽略这个丑陋的界面吧,关注技术实现即可……)

Qt Designer 设计页面

  

这是主窗口,就一个自上而下的三层结构……在这里这三个层次的比例如何失调都没关系——它会根据实际的填充而自动调整的。

需要注意的是:

  • 主显示区(中间部分)是通过QWidget代表的,它将在运行时被一个子页面的 “自定义组合控件” (管理对象)所替代。
  • 下侧的frame是一个QFrame容器,我们将通过代码在运行时动态向这个容器里填充Button图元。

  

这就是Page页面,在View设计中,只管利用Designer工具把图形绘制的尽可能详尽(越接近需求越好,这样View的内容尽量多的通过Designer而不是代码实现。要知道,我们的目标是MVC,代码尽量少的参与View的设计与显示控制,除非显示样式与交互相关)。这里用到最多的操作是:

  • 拖控件
  • 添加布局
  • 编辑样式表

  

测试页面布局(显示效果)

我们可以使用 pyuic5 预览设计效果,并调整页面尺寸来观察Layout的实际效果。

$ pyuic5.exe -p ui/editorpage.ui

组合控件(View + Controller)的接口设计

我们希望设计一个全新的组合控件,它包含了从ui文件继承来的页面图元,并增加了该控件的自定义动作(通过信号槽实现)。对于ui文件,我们需要将其载入接口类;对于信号槽,我们需要实现槽函数,并connnect到响应的signal上面:

from PyQt5.QtWidgets import QWidget, QFrame
from PyQt5.uic import loadUi

UI_Mapping = {}

class IVacWidget(QFrame):  # component of view and controller
    def __init__(self, parent=None):
        super().__init__(parent)
        self._load_ui_file(self)  # to use cls.__name__

    @classmethod
    def _load_ui_file(cls, parent):
        # print("-->>> {} ".format(cls.__name__))  # 验证:cls.__name__呈现多态(子类类名)
        try:
            loadUi(UI_Mapping[cls.__name__], parent)
        except KeyError:
            print(UI_Mapping)
            logging.error("Unable to find the Page[{}]".format(cls.__name__))


    def _active(self):
        """ 连接信号槽,激活widget模块的功能 """
        pass

    def _import(self):
        """ 载入数据 """
        pass

这里将 ui 文件的路径通过UI_Mapping映射确定,而该映射则在运行时读取配置文件载入数据。它的内容可以是这样的(json格式):

{
    "MainWndVac"        : "ui/mainwnd.ui",
    "BasePageVac"       : "ui/basepage.ui",
    "EditorPageVac"     : "ui/editorpage.ui"
}

那么解析它也很容易了:

# 以下内容用于动态改写 src.vacwx.UI_Mapping 值
import json
import src.vacwx

with open("uimap.json") as fp:
    src.vacwx.UI_Mapping = json.load(fp)

组合控件的实现(编写UI控制器)

如果我们仅仅需要把当前的页面载入我们的程序中, 那很简单:

from PyQt5.QtWidgets import QPushButton
from src.vacwx import IVacWidget

class BasePageVac(IVacWidget):
    def __init__(self, parent=None):
        super().__init__(parent)

    def _active(self):
        self.test_btn.pressed.connect(self.test_slot)

    def test_slot(self):
        # anything you want to do...
        pass


class EditorPageVac(IVacWidget):
    def __init__(self, parent=None):
        super().__init__(parent)

如上,Editor仅仅是显示了页面,于是就有了我们开头看到的那个丑陋的小页面。

当然,你也可以通过实现 _active() 和自定义槽函数,绑定标准控件的各种行为……

由于MainWnd需要依赖子页面的实现,我们将它作为独立文件设计,并添加页面下方的动态按钮,以及实现页面切换的效果:

import logging
from PyQt5.QtWidgets import QPushButton
from src.vacwx import IVacWidget, UI_Mapping
from wx.pagevac import *

logging.basicConfig(level=logging.INFO,  # filename="test.log",
                    format="[%(asctime)s] %(levelname)s --> %(message)s")
LOG = logging.getLogger(__file__)


class MainWndVac(IVacWidget):
    page_mapping = [
        {"首页": BasePageVac},
        {"PLC": BasePageVac},
        {"编辑模式": EditorPageVac},
    ]

    def __init__(self):
        super().__init__()

        self.create_pages()
        self._active()
        self.show()

    def create_pages(self):
        self.page_list = []
        self.page_btn_list = []
        for dict_page in self.page_mapping:
            page_name = list(dict_page)[0]
            page_class = dict_page[page_name]

            page = page_class()
            # LOG.info("(1) page_id->{}".format(id(page)))  # check Page ID first.

            page_btn = QPushButton(page_name)
            # page_btn.clicked.connect(lambda: self.switch_page(page))  # ?? while the index++, the connect-map is changed.
            # self.page_btn_list[index].clicked.connect(lambda: self.switch_page(self.page_list[index]))  # failed again...
            self.page_btn_layout.addWidget(page_btn)

            self.page_list.append(page)
            self.page_btn_list.append(page_btn)

        # 初始化首页
        self.switch_page(self.page_list[0])
        # for page in self.page_list:  # check Page ID second.
        #     LOG.info("(2) page_id->{}".format(id(page)))

    def switch_page(self, switch_to: IVacWidget):
        """ switch_to is an IVacWidget """
        # LOG.info("VacMainCtrller::switch_page({}) is called...Page[{}] is activated.".format(switch_to, id(switch_to)))
        for page in self.page_list:
            if not page.isHidden():
                if page != switch_to:
                    self.page_layout.removeWidget(page)
                    page.hide()
                else:  return
        self.page_layout.addWidget(switch_to)
        switch_to.show()

    def _active(self):
        self.page_btn_list[0].clicked.connect(lambda: self.switch_page(self.page_list[0]))
        self.page_btn_list[1].clicked.connect(lambda: self.switch_page(self.page_list[1]))
        self.page_btn_list[2].clicked.connect(lambda: self.switch_page(self.page_list[2]))

最后是整个程序的入口:

if __name__ == '__main__':
    try:
        app = QApplication(sys.argv)
        mainwin = MainWndVac()
        sys.exit(app.exec_())
    except Exception as e:
        LOG.error(e)
        traceback.print_exc()
        sys.exit(-1)

OK,至此功能完成。

总结

这个过程并不复杂,封装也很简单,只是如果实现容器对 ui 的载入等操作有着 pyuic 自定义的组合逻辑。既然趟了路,就把经验罗列出来,其他人也可以省下点时间。

另外,这个模式的应用场景和价值却很大——

  1. 首先,查询GUI的API是一件繁琐的事情,而Qt Designer已经把这个工作做到了“尽可能完善”;
  2. 其次,当你设计一个组合控件,其中不再涉及View对象(这里只适用于静态图元对象)的创建、管理时,你的代码将更具条理——都是在处理控制过程;
  3. 对于动态图元的创建,也适用于上一条:它也属于控制过程的一部分——你总得根据环境的特殊性或变化触发动态对象的创建事件;
  4. 最后,你完全解耦了Data与View层——这二者的耦合是造成代码混乱的直接原因。

本篇博文的内容还没有经过足够的验证,欢迎大家指正。我也将持续更新这个流程,以待完善。

转载于:https://www.cnblogs.com/brt3/p/9804838.html

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值