网罗开发 （小红书、快手、视频号同名）

  大家好，我是 展菲，目前在上市企业从事人工智能项目研发管理工作，平时热衷于分享各种编程领域的软硬技能知识以及前沿技术，包括iOS、前端、Harmony OS、Java、Python等方向。在移动端开发、鸿蒙开发、物联网、嵌入式、云原生、开源等领域有深厚造诣。

图书作者：《ESP32-C3 物联网工程开发实战》
图书作者：《SwiftUI 入门，进阶与实战》
超级个体：COC上海社区主理人
特约讲师：大学讲师，谷歌亚马逊分享嘉宾
科技博主：华为HDE/HDG

我的博客内容涵盖广泛，主要分享技术教程、Bug解决方案、开发工具使用、前沿科技资讯、产品评测与使用体验。我特别关注云服务产品评测、AI 产品对比、开发板性能测试以及技术报告，同时也会提供产品优缺点分析、横向对比，并分享技术沙龙与行业大会的参会体验。我的目标是为读者提供有深度、有实用价值的技术洞察与分析。

展菲：您的前沿技术领航员
👋 大家好，我是展菲！
📱 全网搜索“展菲”，即可纵览我在各大平台的知识足迹。
📣 公众号“Swift社区”，每周定时推送干货满满的技术长文，从新兴框架的剖析到运维实战的复盘，助您技术进阶之路畅通无阻。
💬 微信端添加好友“fzhanfei”，与我直接交流，不管是项目瓶颈的求助，还是行业趋势的探讨，随时畅所欲言。
📅 最新动态：2025 年 3 月 17 日
快来加入技术社区，一起挖掘技术的无限潜能，携手迈向数字化新征程！

前言

最近我折腾了一个特别实用的小工具：一个 AI 智能截图解答应用。

它可以随时在屏幕上框选任意区域，自动识别截图里的内容（包括数学题、截图里的文字、甚至接口报错日志），然后直接给出 AI 解答或解释。整个工具是基于 Python + PyQt5 + OpenAI 多模态 API 开发的，目前已经能满足日常学习、工作中的快速截图+解答需求。

文章里我会把完整的实现思路拆开讲清楚，顺便放一个能直接运行的 Demo 代码模块，你想二次开发成自己的小应用也完全没问题。

这个小工具能做什么？

我先简单说说它的功能，避免大家误会这只是一个“带界面的 ChatGPT”。

这个应用的特点其实非常硬核：

1. 任意区域截图

像 QQ 截图一样，按快捷键后拖个框就能截图，不用切换窗口，不用复制到剪贴板。

2. 多模态识别 + 自动答题

把截图丢到模型里，模型会自动识别文字、公式、图形，再给出解答。

可以轻松应对：

• 数学选择题、填空题
• 英语阅读理解
• 截图里的报错日志
• UI 图设计稿解释
• 表格、代码截图
• 论文截图里的公式

3. Markdown 渲染 + 数学公式渲染

不再是生硬的一段纯文本，而是完全可以展示：

• 标题
• 代码块
• 数学公式（LaTeX）
• 列表、引用等结构化内容

4. 简单易用的 GUI

基于 PyQt5 做了一个很轻量的界面：

• 输入 API Key
• 选择模型
• 自定义提示词
• 点击截图
• 自动返回渲染后的答案

你甚至可以把它打包成 exe，发给同事、同学、家人都能用。

实际使用场景举几个例子

场景 1：学生党 —— 一键截图数学题自动解答

比如你做题做到某道解析看不懂，直接一个截图，AI 自动识别题目并给出详细步骤，非常爽。

场景 2：程序员 —— 截报错日志让 AI 帮你定位问题

你写项目总会遇到那种密密麻麻的 stack trace，复制粘贴又麻烦。

截一下：

TypeError: object NoneType can't be used in 'await' expression

AI 就会告诉你：

• 出错的原因
• 哪一行触发
• 可能的修复方式

你甚至能加自定义 prompt：

解释得更口语化一点
用我的代码风格回答
给 3 种修复方案，不要废话

场景 3：运营/设计 —— 看不懂 UI 素材的内容

直接截图 → AI 自动解说界面布局。

场景 4：阅读英文说明书

看到一段英文标注、英语图片，懒得敲字就截图，让 AI 翻译并总结。

总之，场景有很多，你肯定能找到属于自己的用法。

给你一个可跑的最小 Demo：截图 + 模型识别 + 显示结果

下面的代码就是一个简化版 Demo，可直接运行，它包含：

• PyQt GUI
• 截图选区
• 多模态 API 调用
• 显示结果

你可以先跑通，再往上叠加自己的 UI 和功能。

Demo 代码

运行前需要安装依赖：

pip install PyQt5 Pillow openai

main.py

import sys
from PyQt5.QtWidgets import (
    QApplication, QWidget, QPushButton,
    QVBoxLayout, QTextBrowser, QLabel
)
from PyQt5.QtGui import QPixmap, QGuiApplication
from PyQt5.QtCore import Qt, QRect
from openai import OpenAI
import base64

class ScreenCapture(QWidget):
    """一个简单的截图区域选择工具"""
    def __init__(self):
        super().__init__()
        self.begin = None
        self.end = None
        self.setWindowOpacity(0.3)
        self.setWindowState(Qt.WindowFullScreen)
        self.setWindowFlag(Qt.FramelessWindowHint)

    def paintEvent(self, event):
        from PyQt5.QtGui import QPainter, QPen

        qp = QPainter(self)
        qp.setPen(QPen(Qt.red, 2))
        qp.drawRect(QRect(self.begin, self.end))

    def mousePressEvent(self, event):
        self.begin = event.pos()
        self.end = self.begin
        self.update()

    def mouseMoveEvent(self, event):
        self.end = event.pos()
        self.update()

    def mouseReleaseEvent(self, event):
        self.close()

    def get_rect(self):
        return QRect(self.begin, self.end).normalized()


class App(QWidget):
    def __init__(self):
        super().__init__()
        self.client = OpenAI(api_key="你的API Key")

        self.setWindowTitle("AI 截图解答 Demo")
        self.resize(600, 500)

        layout = QVBoxLayout()

        self.btn = QPushButton("截图并解答")
        self.btn.clicked.connect(self.capture_screen)

        self.result = QTextBrowser()
        self.result.setPlaceholderText("截图后的结果会显示在这里…")

        layout.addWidget(self.btn)
        layout.addWidget(self.result)
        self.setLayout(layout)

    def capture_screen(self):
        # 启动截图工具
        cap = ScreenCapture()
        cap.show()
        cap.exec_() if hasattr(cap, "exec_") else None  # 兼容性调用

        rect = cap.get_rect()

        screenshot = QGuiApplication.primaryScreen().grabWindow(0)
        cropped = screenshot.copy(rect)

        # 保存临时文件
        save_path = "temp.png"
        cropped.save(save_path)

        # 调用多模态模型
        with open(save_path, "rb") as f:
            img_data = base64.b64encode(f.read()).decode("utf-8")

        response = self.client.chat.completions.create(
            model="gpt-4o-mini",
            messages=[
                {"role": "system", "content": "请识别图片内容并进行解释或解答"},
                {"role": "user", "content": [
                    {"type": "input_image", "image_base64": img_data}
                ]}
            ]
        )

        answer = response.choices[0].message["content"]

        self.result.setMarkdown(answer)


if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = App()
    window.show()
    sys.exit(app.exec_())

代码解析（重点讲一下关键部分）

1. 截图选区的实现

核心用的是 PyQt 的全屏透明窗体：

self.setWindowOpacity(0.3)
self.setWindowState(Qt.WindowFullScreen)
self.setWindowFlag(Qt.FramelessWindowHint)

鼠标拖拽过程动态绘制矩形：

qp.drawRect(QRect(self.begin, self.end))

这是和 QQ 截图基本一致的思路，简单干净。

2. 截图抓取并裁剪

PyQt 有现成的接口：

screenshot = QGuiApplication.primaryScreen().grabWindow(0)
cropped = screenshot.copy(rect)

这样你能拿到用户框选区域的确切像素内容。

3. 多模态 API 调用

使用 OpenAI API 时需要注意：

多模态输入格式为：

{"type": "input_image", "image_base64": img_data}

模型可以自由换成：

• gpt-4o
• gpt-4o-mini
• qwen-vl-plus
• glm-4v
• 兼容 OpenAI 格式的任何第三方推理

完全可以让用户自己在 GUI 里配置。

4. Markdown 输出 + 数学公式

QTextBrowser 原生支持 Markdown，渲染体验不错。

你想加 LaTeX 数学公式的话，可以加上：

• MathJax（嵌入 WebEngineView）
• Katex
• PyMarkdown + MathRender

打造一个“AI 题解助手”完全不是梦。

实际运行效果会怎样？

用户点击“截图并解答” → 选框 → 等几秒 → 页面自动渲染答案。

比如你截一段数学题，展示：

已知函数 f(x)=x²+1，求 f(3)

模型回答会变成：

### 解题步骤

1. 将 x = 3 代入函数  
2. f(3) = 3² + 1 = 9 + 1 = 10

**最终答案：10**

非常清爽。

你可以把这个 Demo 升级成什么？

下面是一些扩展功能，我自己做过或正在准备做的：

热键触发截图（不打开窗口）

比如按下 Ctrl+Shift+A 就能截图。

任务栏常驻图标

双击图标即可截图。

自定义 Prompt 面板

比如：

• 解题请用步骤 + 公式
• 遇到英文请翻译
• 对代码截图自动输出修复建议

使用本地模型

比如：

• llava
• minicpm-v
• qwen2-vl

支持 OpenAI 函数格式即可替换。

输出到剪贴板

方便你粘贴到 Word、微信、Notion。

总结

这个 Python + PyQt5 的 AI 截图解答工具，虽然是一个小项目，但它结合了多模态模型、截图交互、Markdown 渲染等功能，真正能提高效率。

你完全可以把它变成：

• AI 数学作业助手
• AI 网页内容总结工具
• AI 报错诊断助手
• AI 论文 PDF 截图解析助手
• AI 代码截图解释工具