使用PySide6/PyQt6实现系统图标的展示和选择处理

在我们的基于PySide6/PyQt6的前端应用中,为了方便和重用,我们收集一些系统图标作为界面的使用,另外PySide/PyQt内部也有内置的图标,我们可以结合起来对图标进行统一的展示和选择处理,如在系统定义动态菜单的时候,我们可以为它指定具体的图标,从而灵活定义菜单的相关展示效果。

1、使用PySide6/PyQt6实现系统图标的展示和选择处理

如上面所示,我们在菜单管理中需要汇总系统的相关图标,以便在菜单编辑中选择具体的图标效果。

选择图标会弹出一个可缩放的对话框出来,如下界面所示。

上面的图标对话框,我们为了更好的展现效果,使用一个自己封装好的可伸缩调整大小的对话框基类,如下关系

复制代码
class MySizedDialog(QDialog):
    """自定义对话框基类"""

    def __init__(
        self,
        parent,
        title="默认对话框标题",
        can_scroll=True,
        show_btn_ok=True,
        size=(400, 600),
        pos=None,
    ):
        super().__init__(parent)

        self.log = settings.log.get_logger()
        self.setWindowTitle(title)
        self.setWindowIcon(images.catalog["appIcon"])
        self.show_btn_ok = show_btn_ok
        self.can_scroll = can_scroll

关于可伸缩的对话框基类,我们在控件界面的底部,根据配置创建OK、Cancel的标准按钮集合,如下代码所示。

复制代码
    def _add_buttons(self) -> QDialogButtonBox:
        """创建按钮"""

        if self.show_btn_ok:  # OK按钮、Cancel按钮都显示
            # 创建标准按钮框(包括 OK 和 Cancel)
            button_box = QDialogButtonBox(
                QDialogButtonBox.StandardButton.Ok
                | QDialogButtonBox.StandardButton.Cancel
            )

        else:  # 只显示 Cancel 按钮
            button_box = QDialogButtonBox(QDialogButtonBox.StandardButton.Cancel)

        # 查找 OK 按钮
        ok_button = button_box.button(QDialogButtonBox.StandardButton.Ok)
        if ok_button:  # 检查按钮是否存在
            # 设置图标
            ok_button.setIcon(images.catalog["accept"])
            # 异步绑定事件
            ok_button.clicked.connect(self.on_ok)

        cancel_button = button_box.button(QDialogButtonBox.StandardButton.Cancel)
        if cancel_button:  # 检查按钮是否存在
            # 设置图标
            cancel_button.setIcon(images.catalog["cancel"])
            # 异步绑定事件
            cancel_button.clicked.connect(self.on_cancel)

        return button_box

然后再构建一个图标选择的控件类即可,如下所示。

复制代码
class MyImageDialog(ctrl.MySizedDialog):
    """图片选择对话框"""

    selected_name = ""
    selected_bitmap = None

    def __init__(
        self,
        parent,
        title="图片选择对话框",
        can_scroll=True,
        show_btn_ok=True,
        size=(800, 600),
        pos=None,
        return_icon_size=32,
    ):
        super().__init__(
            parent,
            title=title,
            can_scroll=can_scroll,
            show_btn_ok=show_btn_ok,
            size=size,
            pos=pos,
        )
        self.return_icon_size = return_icon_size

我们在图标选择的对话框,使用了选项卡控件来构建两个界面,一个是展示我们自定义的图标集合,一个是展示系统的内置图标集合。

复制代码
    def add_contents(self, panel: QWidget, grid_sizer: QGridLayout):
        """创建列表面板"""

        # 创建 QTabWidget
        self.notebook =QTabWidget(panel)
        self.notebook.setTabPosition(QTabWidget.TabPosition.North)

        self.first = self.create_first()
        self.second = self.create_second()

        self.notebook.addTab(self.first, get_bitmap("group"), "自定义内嵌图片")
        self.notebook.addTab(self.second, get_bitmap("group_key"), "系统图标")

        # 创建 QLabel,用于显示图片
        self.bmpCtrl = QLabel(panel)
        # self.bmpCtrl.setFixedSize(32, 32)  # 设置固定大小
        self.bmpCtrl.setStyleSheet("border: 1px solid black;")  # 设置边框样式
        self.bmpCtrl.setSizePolicy(QSizePolicy.Policy.Fixed, QSizePolicy.Policy.Fixed)  # 设置尺寸策略

        grid_sizer.addWidget(self.notebook)
        grid_sizer.addWidget(self.bmpCtrl)

我们以自定义的图表集合为例,我们创建的第一个create_first()函数 里面就是根据集合遍历进行展示,如下代码。

复制代码
    def create_first(self) -> QWidget:
        """创建自定义内嵌图片面板"""

        # 创建面板
        panel = self._create_window(self, True)
        # 创建 WrapSizer
        icon_layout = ctrl.FlowLayout()

        # 遍历图片目录,创建图标
        for idx, (key, value) inenumerate(images.catalog.items()):
            icon_panel = self.create_icon(panel, value, key)
            icon_layout.addWidget(icon_panel)

        child_panel = QWidget(panel)
        child_panel.setLayout(icon_layout)
        if isinstance(panel, QScrollArea):
           panel.setWidget(child_panel)

        return panel

而其中images是我们导入的系统全局图标集合,它是在系统初始化的时候进行内存加载,驻留全局使用的。

复制代码
from core.core_images import CoreImages as images

我们是在登录界面初始化的时候,就对系统全局图标集合进行加载的。

我们和WxPython 的做法类似,使用Base64编码进行图片处理,其中Base64编码我们通过辅助类来构建生成。

如果需要根据文件生成base64编码,单独运行辅助类即可,它运行提示输入文件,或者拖入文件即可获得文件名,运行后生成Base64编码和相关代码,拷贝过去使用即可。

对于PySide/PyQT的内置图标

我们可以通过遍历 QStyle.StandardPixmap 来获取并展示的

复制代码
        # 创建 WrapSizer
        icon_layout = ctrl.FlowLayout()

        # 获取所有标准图标
        i = 0
        for standard_icon in QStyle.StandardPixmap:
            icon = QApplication.style().standardIcon(standard_icon)  # 获取标准图标
            # 检查图标是否有效
            if icon.isNull():
                # print(f"跳过无效图标: {standard_icon.name}")
                continue

            pixmap_32 = icon.pixmap(32, 32)  # 生成 32x32 的 QPixmap
            icon_32 = QIcon(pixmap_32)  # 重新创建 QIcon
            name = standard_icon.name  # 获取图标名称

            icon_panel = self.create_icon(panel, icon_32, name)
            icon_layout.addWidget(icon_panel)

            i += 1

在图标展示后,每个图标都在接收单击事件后,传入对象的相关信息,因此选中并确认后返回图标的信息。

复制代码
   def on_item_selected(self, event, name: str):
        """鼠标左键单击事件处理"""
        icon = get_bitmap(name, self.return_icon_size)
        bitmap = icon.pixmap(32, 32)
        bitmap = bitmap.scaled(32, 32, Qt.AspectRatioMode.KeepAspectRatio, Qt.TransformationMode.SmoothTransformation)

        self.selected_name = name
        self.selected_bitmap = bitmap

        self.bmpCtrl.setPixmap(bitmap)
        print(f"你选择了: {name}")

这样我们就可以根据名称进行图标的展示了。

我们在bitmap_util.py的辅助类中定义获取图标为位图对象QIcon的转换,如下是根据名称生成对应的位图对象QIcon。

复制代码
def get_bitmap(name: str, icon_size: int = 32) -> QIcon:
    """获取位图,可以根据名称获取images里面的内容,或者是系统内置的图标SP_XXX"""

    if name is None or name == "":
        name = "appIcon"

    if name.startswith("SP_"):
        # 系统内置的图标
        icon = get_standard_icon(name, icon_size)
        return icon
    elif name.startswith("ic_fluent_"):
        # 微软Fluent系统图标
        icon = FluentSystemIconUtil.create_icon_by_name(name, icon_size)
        return icon
    else:
        # 自定义内置的图标
        icon = get_customed_icon_with_default(name, icon_size)
        return icon

以上就是基于PySide6/PyQt6的前端应用中,对自定义的图标资源以及内置图标资源进行整合的展示处理,以及如何生成base64编码,加载显示图标的一整个过程。

相关推荐
伍华聪2 天前
使用PySide6/PyQt6实现程序启动画面的处理
python开发·pyside6/pyqt6开发
伍华聪6 天前
使用PySide6/PyQt6或者WxPython实现对列表界面和树列表界面的整合处理
python开发
伍华聪5 个月前
在Python后端项目FastApi中使用MongoDB进行数据处理
python开发·mongodb数据库
伍华聪6 个月前
使用PySide6/PyQt6实现Python跨平台通用列表页面的基类设计
python开发
伍华聪6 个月前
使用PySide6/PyQt6实现Python跨平台表格数据分页打印预览处理
python开发
伍华聪7 个月前
使用PySide6/PyQt6实现Python跨平台GUI框架的开发
python开发
伍华聪8 个月前
一问一答学习PyQT6,对比WxPython和PyQt6的差异
python开发
伍华聪8 个月前
WxPython跨平台开发框架之使用PyInstaller 进行打包处理
python开发
伍华聪8 个月前
WxPython跨平台开发框架之模块字段权限的管理
python开发