跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客GitHub 精选镜像AI 生图工具UI配色美学隐私政策关于联系
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
PythonAI算法

基于 PySide6 实现 YOLOv8 目标检测可视化 GUI 界面

如何使用 PySide6 和 OpenCV 构建 YOLOv8 目标检测的图形用户界面(GUI)。内容包括环境配置、依赖安装、主窗口创建、布局设计(视频展示区、日志区)、模型加载、置信度阈值调节、文件上传及实时检测功能实现。通过定时器机制处理视频流,支持图片和视频文件的检测,并提供操作日志记录。最终实现了跨平台的桌面应用程序,方便直观地展示检测结果。

草莓泡芙发布于 2026/4/6更新于 2026/7/2451 浏览
基于 PySide6 实现 YOLOv8 目标检测可视化 GUI 界面

使用 PySide6 实现 YOLOv8 可视化 GUI 页面

在人工智能和计算机视觉领域,YOLO(You Only Look Once)是一种广泛使用的实时目标检测算法。为了直观地展示 YOLO 算法的检测效果,我们可以使用 Python 中的 PySide6 库来创建一个简单的 GUI 应用程序,将检测结果实时可视化。

本文将指导你如何使用 PySide6 实现这一功能。

  1. 原视频/图片区:上半部分左边区域为原视频/图片展示区;
  2. 检测区:上半部分右边区域为检测结果输出展示区;
  3. 日志文本框:打印输出操作日志;
  4. 加载模型:从本地选择模型 pt 文件进行加载;
  5. 置信度阈值:自定义检测区的置信度阈值;
  6. 文件上传:选择目标文件;
  7. 开始检测:执行检测程序;
  8. 停止:终止检测程序;

一、工具介绍

1. PySide6

PySide6 是一款功能强大的 GUI(图形用户界面)开发框架,它允许 Python 开发者使用 Qt 库的功能来构建跨平台的桌面应用程序。PySide6 作为 Qt 的 Python 绑定版本,继承了 Qt 的跨平台特性,支持在 Windows、macOS、Linux 等多种操作系统上开发和部署应用程序。其具有以下特点:

  1. 丰富的组件库:PySide6 提供了大量的 GUI 控件和布局管理器,如按钮、文本框、下拉框、复选框等,以及 QGridLayout、QFormLayout、QStackedLayout 等多种布局方式,方便开发者快速构建用户界面。
  2. 高性能:基于 Qt 6 的底层实现,PySide6 保证了应用程序的性能和响应速度,能够处理大型复杂的 GUI。
  3. 灵活的事件处理机制:PySide6 能够处理各种用户输入事件,如鼠标点击、键盘输入等,实现丰富的交互功能。
  4. 官方维护与支持:PySide6 是 Qt 公司官方维护的 Python 绑定版本,享有官方的技术支持和更新服务,确保了框架的稳定性和可靠性。
2. OpenCV

OpenCV(Open Source Computer Vision Library)是一个广泛使用的开源计算机视觉库,它提供了丰富的图像和视频处理功能,以及一些机器学习算法。

OpenCV 具有广泛的应用领域,包括但不限于:

  • 人脸识别和物体识别:使用 OpenCV 可以实现人脸检测和识别,以及目标检测等,可应用于人脸门禁系统、人脸支付、安全监控等场景。
  • 图像和视频分析:可用于视频压缩、视频稳定、行人跟踪、行为分析等。
  • 图像合成和 3D 重建:通过多个视角的图像来重建场景的三维结构。
  • 机器学习:OpenCV 也提供了针对神经网络和深度学习的高级功能,支持常见的深度学习框架,如 TensorFlow、PyTorch 和 Caffe,使开发者能够利用神经网络进行人脸检测、物体识别和语义分割等任务。

二、环境准备

利用 pip 工具进行依赖项安装(也可以利用 Anaconda 进行依赖包安装),要求 python≥3.8。具体步骤如下:

1. 安装 ultralytics 包

打开 CMD:Win 键 + R 打开<运行>,输入**"cmd"**,回车,输入以下代码,即可快速安装 YOLO。

也可以在 PyCharm 编辑器里打开终端进行安装。

# 安装 ultralytics 工具包
pip install ultralytics
# 如果安装速度比较慢可以换成清华源的镜像
pip install ultralytics -i https://pypi.tuna.tsinghua.edu.cn/simple

在 ultralytics 包里,会自动安装适配当前 ultralytics 版本的 torch。

也可以根据自己的需要安装对应的 torch 版本:

pip install torch==2.1.0 -i https://pypi.tuna.tsinghua.edu.cn/simple
2. 安装 PySide6 工具包

使用 pip 或者 conda 安装 PySide6,打开你的终端或命令提示符,然后运行以下命令来安装 PySide6:

# 安装 PySide6 工具包
pip install PySide6 -i https://pypi.tuna.tsinghua.edu.cn/simple
3. 安装 OpenCV 工具包

使用 pip 或者 conda 安装 OpenCV,打开你的终端或命令提示符,然后运行以下命令来安装 OpenCV:

# 安装 opencv 工具包
pip install opencv-python -i https://pypi.tuna.tsinghua.edu.cn/simple

这个命令会安装 OpenCV 的核心功能,包括图像处理、视频捕获等。如果你还需要额外的功能,比如对 OpenCV 的贡献模块(如 xfeatures2d、stitching 等),你可以安装 opencv-contrib-python:

# 安装 opencv-contrib-python 工具包
pip install opencv-contrib-python -i https://pypi.tuna.tsinghua.edu.cn/simple

三、导入必要的库

在你的 Python 脚本中,导入所需的库:

import os
from datetime import datetime
import json
import cv2
import torch
from PySide6.QtCore import pyqtSlot
from PySide6.QtGui import QIcon
from PySide6 import QtWidgets, QtCore, QtGui
from PySide6.QtCore import Qt, QDir
from ultralytics import YOLO

四、创建主窗口,初始化相关参数

class MyWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        self.init_gui()
        self.model = None
        self.timer = QtCore.QTimer()
        self.timer1 = QtCore.QTimer()
        self.cap = None
        self.video = None
        self.file_path = None
        self.base_name = None
        self.timer1.timeout.connect(self.video_show)

    def init_gui(self):
        self.folder_path = "./model_file" # 自定义修改:设置模型文件夹路径
        self.setFixedSize(1300, 650)
        self.setWindowTitle('目标检测') # 自定义修改:设置窗口名称
        self.setWindowIcon(QIcon("logo.jpg")) # 自定义修改:设置窗口图标
        central_widget = QtWidgets.QWidget(self)
        self.setCentralWidget(central_widget)
        main_layout = QtWidgets.QVBoxLayout(central_widget)

更换窗口背景图片:

# 自定义修改:设置窗口背景图
self.set_background_image('bg.jpg') 

五、编写页面布局

1. 创建图片/视频展示区域

如上图所示,左侧是文件上传之后原图、原视频的展示区域;右侧是经模型加载并执行开始检测之后,用来展示预测结果的检测区。

页面布局代码如下:

# 界面上半部分:视频框
topLayout = QtWidgets.QHBoxLayout()
self.oriVideoLabel = QtWidgets.QLabel(self)
self.detectlabel = QtWidgets.QLabel(self)
self.oriVideoLabel.setFixedSize(530, 400)
self.detectlabel.setFixedSize(530, 400)
self.oriVideoLabel.setStyleSheet('border: 2px solid #ccc; border-radius: 10px; margin-top:75px;')
self.detectlabel.setStyleSheet('border: 2px solid #ccc; border-radius: 10px; margin-top: 75px;')
topLayout.addWidget(self.oriVideoLabel)
topLayout.addWidget(self.detectlabel)
main_layout.addLayout(topLayout)

在这段代码中,包含一个水平布局(QHBoxLayout),用于放置两个视频显示的标签(QLabel)。这两个标签分别用于显示原始视频(oriVideoLabel)和处理后的视频或检测结果(detectLabel)。

2. 创建日志打印区域

在基于 YOLO 的目标检测当中,我们需要记录一些操作日志,从而方便后续维护。此外,在实际生产环境中,如果置信度大于我们所设定的阈值,需要产生告警信息,而这些信息需要记录标签预测框的坐标信息、产生告警的时间以及告警的标签内容。

在日志打印区当中会生成 JSON 字符串格式的日志信息,信息内容为当前预测框中的告警信息,包括:

  • 标签名称:"name": "道路积水",
  • 置信度:"confidence": 0.9243840575218201,
  • 横坐标:"x": 452.06036376953125,
  • 纵坐标:"y": 409.8131103515625,
  • 预测框宽度:"width": 1142.6134033203125,
  • 预测框高度:"height": 571.2572021484375

可以将上述告警信息封装之后以接口的形式传入相关数据平台进行分析和处理。

日志区域的页面布局代码如下:

# 创建日志打印文本框
self.outputField = QtWidgets.QTextBrowser()
self.outputField.setFixedSize(530, 180)
3. 加载 YOLO 模型

下载 YOLO 预训练模型,选择自己的预测模型进行加载。

修改模型本地路径:

def init_gui(self):
    self.folder_path = "./models" # 自定义修改:设置文件夹路径
    self.setFixedSize(1300, 650)
    self.setWindowTitle('目标检测') # 自定义修改:设置窗口名称
    self.setWindowIcon(QIcon("logo.jpg")) # 自定义修改:设置窗口图标
    central_widget = QtWidgets.QWidget(self)
    self.setCentralWidget(central_widget)
    main_layout = QtWidgets.QVBoxLayout(central_widget)

代码如下:

# 遍历文件夹并添加文件名到下拉框
for filename in os.listdir(self.folder_path):
    file_path = os.path.join(self.folder_path, filename)
    if os.path.isfile(file_path) and filename.endswith('.pt'): # 确保是文件且后缀为.pt
        base_name = os.path.splitext(filename)[0]
        self.selectModel.addItem(base_name) # 添加加载模型按钮
        self.loadModel = QtWidgets.QPushButton('🔄️加载模型') # 新建加载模型按钮
        self.loadModel.setFixedSize(100, 50)
        self.loadModel.setStyleSheet("""
            QPushButton {
                background-color: white; /* 正常状态下的背景颜色 */
                border: 2px solid gray; /* 正常状态下的边框 */
                border-radius: 10px;
                padding: 5px;
                font-size: 14px;
            }
            QPushButton:hover {
                background-color: #f0f0f0; /* 悬停状态下的背景颜色 */
            }
        """)
        self.loadModel.clicked.connect(self.load_model) # 绑定 load_model 函数进行模型加载
        selectModel_layout.addWidget(self.selectModel) # 将下拉框加入到页面布局当中
        selectModel_layout.addWidget(self.loadModel) # 将按钮加入到页面布局当中

load_model 函数代码如下:

def load_model(self):
    filename = self.selectModel.currentText()
    full_path = os.path.join(self.folder_path, filename + '.pt')
    self.base_name = os.path.splitext(os.path.basename(full_path))[0]
    if full_path.endswith('.pt'): # 加载预训练模型
        self.model = YOLO(full_path)
        self.start_detect.setEnabled(True)
        self.stopDetectBtn.setEnabled(True)
        self.openImageBtn.setEnabled(True)
        self.confidence_slider.setEnabled(True)
        self.outputField.append(f'{datetime.now().strftime("%Y-%m-%d %H:%M:%S")} - 模型加载成功:{filename}')
        self.outputField.append(f'{datetime.now().strftime("%Y-%m-%d %H:%M:%S")} - 请选择置信度阈值')
    else:
        self.outputField.append(f'{datetime.now().strftime("%Y-%m-%d %H:%M:%S")} - 请重新选择模型文件!')
        print("Reselect model")
4. 创建置信度阈值滑动条

你可以根据自己的需求自定义置信度阈值,value 值会绑定模型预测的 conf,在预测过程中实时生效。

页面布局代码如下:

# 创建一个置信度阈值滑动条
self.con_label = QtWidgets.QLabel('置信度阈值', self)
self.con_label.setStyleSheet('font-size: 14px; font-family: "Microsoft YaHei";')
# 创建一个 QSlider,范围从 0 到 99(代表 0.01 到 0.99)
self.slider = QtWidgets.QSlider(Qt.Horizontal, self)
self.slider.setMinimum(1) # 0.01
self.slider.setMaximum(99) # 0.99
self.slider.setValue(50) # 0.5
self.slider.setTickInterval(10)
self.slider.setTickPosition(QtWidgets.QSlider.TicksBelow)
self.slider.setFixedSize(170, 30)
# 创建一个 QDoubleSpinBox 用于显示和设置滑动条的值
self.spinbox = QtWidgets.QDoubleSpinBox(self)
self.spinbox.setButtonSymbols(QtWidgets.QAbstractSpinBox.NoButtons)
self.spinbox.setMinimum(0.01)
self.spinbox.setMaximum(0.99)
self.spinbox.setSingleStep(0.01)
self.spinbox.setValue(0.5)
self.spinbox.setDecimals(2)
self.spinbox.setFixedSize(60, 30)
self.spinbox.setStyleSheet('border: 2px solid gray; border-radius: 10px; padding: 5px; background-color: #f0f0f0; font-size: 14px;')
self.confidence_slider = QtWidgets.QWidget()
layout = QtWidgets.QVBoxLayout()
hlayout = QtWidgets.QHBoxLayout()
self.confidence_slider.setFixedSize(250, 64)
layout.addWidget(self.con_label)
hlayout.addWidget(self.slider)
hlayout.addWidget(self.spinbox)
layout.addLayout(hlayout)
self.confidence_slider.setLayout(layout)
self.confidence_slider.setEnabled(False) # 连接信号和槽
self.slider.valueChanged.connect(self.updateSpinBox)
self.spinbox.valueChanged.connect(self.updateSlider)
5. 文件上传

文件上传操作包括图片上传、视频上传,支持 JPG 格式和 MP4 格式,以文件流的形式读取需要被检测的文件。

# 对上传的文件根据后缀名称进行过滤
file_path, file_type = file_dialog.getOpenFileName(self, "选择检测文件", filter='*.jpg *.mp4')

修改图片/视频上传路径:

def upload_file(self):
    self.outputField.append(f'{datetime.now().strftime("%Y-%m-%d %H:%M:%S")} - 请选择检测文件')
    file_dialog = QtWidgets.QFileDialog()
    file_dialog.setDirectory(QDir("./valid_file")) # 修改上传文件路径 

页面布局代码如下:

# 文件上传按钮
self.openImageBtn = QtWidgets.QPushButton('🖼️文件上传')
self.openImageBtn.setFixedSize(100, 65)
self.openImageBtn.setStyleSheet("""
    QPushButton {
        background-color: white; /* 正常状态下的背景颜色 */
        border: 2px solid gray; /* 正常状态下的边框 */
        border-radius: 10px;
        padding: 5px;
        font-size: 14px;
        margin-bottom: 15px;
    }
    QPushButton:hover {
        background-color: #f0f0f0; /* 悬停状态下的背景颜色 */
    }
""")
self.openImageBtn.clicked.connect(self.upload_file) # 绑定 upload_file 事件
self.openImageBtn.setEnabled(False) # 初始化按钮默认不可操作,加载模型之后可以操作

文件上传成功之后会呈现在左侧的展示区域。

上传视频效果如下:

6. 执行预测

使用 OpenCV(cv2)库进行视频抽帧是一个常见的任务,可以用于从视频中提取特定的帧进行进一步处理或分析。

页面布局代码如下:

# 执行预测按钮
self.start_detect = QtWidgets.QPushButton('🔍开始检测')
self.start_detect.setFixedSize(100, 50)
self.start_detect.setStyleSheet("""
    QPushButton {
        background-color: white; /* 正常状态下的背景颜色 */
        border: 2px solid gray; /* 正常状态下的边框 */
        border-radius: 10px;
        padding: 5px;
        font-size: 14px;
    }
    QPushButton:hover {
        background-color: #f0f0f0; /* 悬停状态下的背景颜色 */
    }
""")
self.start_detect.clicked.connect(self.show_detect) # 绑定 show_detect 函数事件
self.start_detect.setEnabled(False)

模型预测的核心代码:

将视频帧进行抽取之后转为 QImage 格式对预测结果进行展示。

frame = self.model(frame, imgsz=[448, 352], device='cuda', conf=self.value) if torch.cuda.is_available() \
else self.model(frame, imgsz=[448, 352], device='cpu', conf=self.value)
7. 停止检测

在视频检测的过程中可能发现上传错误,此时为了防止视频一直在后台检测导致占用内存,需要及时中断检测程序。

日志打印区会输出'检测中断!',检测区也会停在该视频的当前帧。

代码如下:

# 停止检测按钮
self.stopDetectBtn = QtWidgets.QPushButton('🛑停止')
self.stopDetectBtn.setFixedSize(100, 50)
self.stopDetectBtn.setEnabled(False)
self.stopDetectBtn.clicked.connect(self.stop_detect) # 绑定 stop_detect 中断检测事件
# 中断检测事件
def stop_detect(self):
    if self.timer.isActive():
        self.timer.stop()
    if self.timer1.isActive():
        self.timer1.stop()
    if self.cap is not None:
        self.cap.release()
        self.cap = None
        self.video = None
        self.ini_labels()
        self.outputField.append(f'{datetime.now().strftime("%Y-%m-%d %H:%M:%S")} - 检测中断!')
        self.file_path = None

六、程序完整代码

(注:以上代码片段已涵盖核心逻辑,实际项目中需整合类定义与入口函数)

目录

  1. 使用 PySide6 实现 YOLOv8 可视化 GUI 页面
  2. 一、工具介绍
  3. 1. PySide6
  4. 2. OpenCV
  5. 二、环境准备
  6. 1. 安装 ultralytics 包
  7. 安装 ultralytics 工具包
  8. 如果安装速度比较慢可以换成清华源的镜像
  9. 2. 安装 PySide6 工具包
  10. 安装 PySide6 工具包
  11. 3. 安装 OpenCV 工具包
  12. 安装 opencv 工具包
  13. 安装 opencv-contrib-python 工具包
  14. 三、导入必要的库
  15. 四、创建主窗口,初始化相关参数
  16. 自定义修改:设置窗口背景图
  17. 五、编写页面布局
  18. 1. 创建图片/视频展示区域
  19. 界面上半部分:视频框
  20. 2. 创建日志打印区域
  21. 创建日志打印文本框
  22. 3. 加载 YOLO 模型
  23. 遍历文件夹并添加文件名到下拉框
  24. 4. 创建置信度阈值滑动条
  25. 创建一个置信度阈值滑动条
  26. 创建一个 QSlider,范围从 0 到 99(代表 0.01 到 0.99)
  27. 创建一个 QDoubleSpinBox 用于显示和设置滑动条的值
  28. 5. 文件上传
  29. 对上传的文件根据后缀名称进行过滤
  30. 文件上传按钮
  31. 6. 执行预测
  32. 执行预测按钮
  33. 7. 停止检测
  34. 停止检测按钮
  35. 中断检测事件
  36. 六、程序完整代码
  • 免费图片AI生成工具免费生成了解详情
  • Magick API 一键接入全球大模型注册送1000万token查看
  • 免费图片视频在线生成30秒,将你的创意变成现实开始设计
  • X/Twitter免费视频下载器免登陆无限额度免费视频解析下载了解详情
  • 100+免费在线小游戏爽一把
极客日志微信公众号二维码

微信扫一扫,关注极客日志

微信公众号「极客日志V2」,在微信中扫描左侧二维码关注。展示文案:极客日志V2 zeeklog

更多推荐文章

查看全部
  • ASP.NET Core 主机模型详解:Host、WebHost 与 WebApplication 对比与实践
  • Qwen3 模型 LoRA 微调实战:使用 LLaMA-Factory
  • 腾讯混元大模型业务落地实践与技术方案
  • ClawdBot 语音翻译:Whisper tiny 带口音英语与粤语 WER 对比
  • CentOS 系统定时执行 Python 邮件发送任务的五种方案
  • 如何使用 py-spy 进行 Python 程序调试与死锁分析
  • 攻防世界 Web 题解:SQL 注入与文件包含漏洞分析
  • Git-AI:追踪 AI 生成代码的实用工具
  • 开源机器人 AI 框架 LeRobot 入门与实践
  • OpenClaw 对接飞书机器人常见问题与 Gateway 稳定性排查
  • B 站转型 AI 创新孵化器:开发者生态观察
  • ToDesk ToClaw 评测:零门槛体验 OpenClaw 级 AI 自动化
  • Gemini 2.5 Pro 技术突破与实战应用深度解析
  • Trae IDE 安装与使用教程
  • Dify Web 前端二次开发:隐藏探索功能与自定义 Logo
  • Windows 系统下 PyCharm IDE 安装与配置指南
  • Agentic Workflow 解析:技术挑战与未来趋势
  • LangChain Agent 详解:原理、类型与实战应用
  • 基于 Cursor 开发 Spring Boot 项目指南
  • 使用 MCP-Server 插件将 Dify 工作流发布为第三方服务

相关免费在线工具

  • 加密/解密文本

    使用加密算法(如AES、TripleDES、Rabbit或RC4)加密和解密文本明文。 在线工具,加密/解密文本在线工具,online

  • RSA密钥对生成器

    生成新的随机RSA私钥和公钥pem证书。 在线工具,RSA密钥对生成器在线工具,online

  • Mermaid 预览与可视化编辑

    基于 Mermaid.js 实时预览流程图、时序图等图表,支持源码编辑与即时渲染。 在线工具,Mermaid 预览与可视化编辑在线工具,online

  • 随机西班牙地址生成器

    随机生成西班牙地址(支持马德里、加泰罗尼亚、安达卢西亚、瓦伦西亚筛选),支持数量快捷选择、显示全部与下载。 在线工具,随机西班牙地址生成器在线工具,online

  • Gemini 图片去水印

    基于开源反向 Alpha 混合算法去除 Gemini/Nano Banana 图片水印,支持批量处理与下载。 在线工具,Gemini 图片去水印在线工具,online

  • curl 转代码

    解析常见 curl 参数并生成 fetch、axios、PHP curl 或 Python requests 示例代码。 在线工具,curl 转代码在线工具,online