使用wxPython实现逐行加载HTML内容并实时显示效果

 更新时间:2024年11月11日 10:05:41   作者:winfredzhang  
这篇博客中,我们将详细分析如何使用 wxPython 构建一个简单的桌面应用程序,用于逐行加载并显示 HTML 文件的内容,并在加载完成后通过浏览器组件呈现最终页面,通过该应用,我们可以体验到逐行加载 HTML 内容的视觉效果,类似于模拟代码输入,需要的朋友可以参考下

C:\pythoncode\new\simulateClaudeGenHtml.py

全部代码

import wx
import wx.html2
import time

class HtmlViewerApp(wx.Frame):
    def __init__(self, *args, **kw):
        super(HtmlViewerApp, self).__init__(*args, **kw)

        # 创建界面布局
        panel = wx.Panel(self)
        vbox = wx.BoxSizer(wx.HORIZONTAL)

        # 创建Memo文本区域,并设置黑色背景和白色文字
        self.memo = wx.TextCtrl(panel, style=wx.TE_MULTILINE | wx.TE_READONLY)
        self.memo.SetBackgroundColour("#000000")
        self.memo.SetForegroundColour("#FFFFFF")
        vbox.Add(self.memo, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

        # 创建右侧WebView组件用于显示HTML效果
        self.browser = wx.html2.WebView.New(panel)
        vbox.Add(self.browser, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

        panel.SetSizer(vbox)

        # 创建菜单栏选择HTML文件
        menubar = wx.MenuBar()
        fileMenu = wx.Menu()
        openItem = fileMenu.Append(wx.ID_OPEN, 'Open', 'Open HTML File')
        menubar.Append(fileMenu, "&File")
        self.SetMenuBar(menubar)  # 修改为 self.SetMenuBar

        # 绑定打开文件事件
        self.Bind(wx.EVT_MENU, self.OnOpenFile, openItem)

        self.lines = []  # 用于存储HTML文件的行内容
        self.line_index = 0  # 当前行的索引
        self.timer = wx.Timer(self)  # 创建定时器
        self.Bind(wx.EVT_TIMER, self.OnTimer, self.timer)  # 绑定定时器事件

    def OnOpenFile(self, event):
        """打开并读取HTML文件"""
        with wx.FileDialog(self, "Open HTML file", wildcard="HTML files (*.html;*.htm)|*.html;*.htm",
                           style=wx.FD_OPEN | wx.FD_FILE_MUST_EXIST) as dialog:
            if dialog.ShowModal() == wx.ID_OK:
                file_path = dialog.GetPath()
                with open(file_path, 'r', encoding='utf-8') as file:
                    self.lines = file.readlines()
                
                self.memo.Clear()  # 清空Memo内容
                self.line_index = 0  # 重置行索引
                self.timer.Start(100)  # 每100毫秒加载一行

    def OnTimer(self, event):
        """定时器事件:逐行加载HTML内容"""
        if self.line_index < len(self.lines):
            line = self.lines[self.line_index]
            self.memo.AppendText(line)  # 在Memo中添加当前行
            self.line_index += 1  # 增加行索引
        else:
            self.timer.Stop()  # 停止定时器
            self.DisplayHtml()  # 加载完成后显示HTML

    def DisplayHtml(self):
        """在WebView中显示HTML内容"""
        html_content = ''.join(self.lines)  # 将所有行合并为完整HTML
        self.browser.SetPage(html_content, "")

# 主应用程序
if __name__ == '__main__':
    app = wx.App(False)
    frame = HtmlViewerApp(None, title="HTML Viewer", size=(800, 600))
    frame.Show()
    app.MainLoop()

1. 项目目标

本项目实现的目标是:

  1. 选择并打开一个 HTML 文件。
  2. 将 HTML 文件的内容逐行加载到一个文本框(Memo)中,背景色为黑色,文字为白色,给人一种逐行“输入”的效果。
  3. 在加载完所有内容后,在右侧的浏览器组件中显示完整的 HTML 页面效果。

2. 代码实现

让我们逐步分析实现该功能的完整代码:

import wx
import wx.html2
import time

首先导入 wxPython 模块 wx 和 wx.html2。 wx.html2 提供了 WebView 类,可以用于在应用程序中嵌入一个浏览器,适合用来显示 HTML 内容。

2.1 创建主窗口类

class HtmlViewerApp(wx.Frame):
    def __init__(self, *args, **kw):
        super(HtmlViewerApp, self).__init__(*args, **kw)

定义一个主窗口类 HtmlViewerApp,它继承自 wx.Framewx.Frame 是 wxPython 中用于创建主窗口的类。

        panel = wx.Panel(self)
        vbox = wx.BoxSizer(wx.HORIZONTAL)

创建一个 wx.Panel 和一个水平布局管理器 wx.BoxSizer。 Panel 是窗口内的容器控件,用于放置其他控件,而 BoxSizer 允许我们灵活控制控件的布局。

2.2 创建文本框和浏览器组件

        self.memo = wx.TextCtrl(panel, style=wx.TE_MULTILINE | wx.TE_READONLY)
        self.memo.SetBackgroundColour("#000000")
        self.memo.SetForegroundColour("#FFFFFF")
        vbox.Add(self.memo, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

在这里,我们创建一个 wx.TextCtrl 作为 Memo 文本区域,用于逐行显示 HTML 代码。设置了黑色背景和白色文字,样式指定为多行不可编辑。接着将文本框添加到水平布局管理器中。

        self.browser = wx.html2.WebView.New(panel)
        vbox.Add(self.browser, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

创建一个 wx.html2.WebView 浏览器组件并添加到布局中。WebView 用于显示 HTML 文件的最终效果。

        panel.SetSizer(vbox)

将水平布局管理器设置为 panel 的布局。

2.3 设置菜单栏并绑定事件

        menubar = wx.MenuBar()
        fileMenu = wx.Menu()
        openItem = fileMenu.Append(wx.ID_OPEN, 'Open', 'Open HTML File')
        menubar.Append(fileMenu, "&File")
        self.SetMenuBar(menubar)

创建菜单栏和文件菜单,并添加一个 Open 选项用于选择 HTML 文件。self.SetMenuBar(menubar) 将菜单栏绑定到主窗口。

        self.Bind(wx.EVT_MENU, self.OnOpenFile, openItem)

将菜单项绑定到 OnOpenFile 方法,用于处理文件打开事件。

2.4 定义定时器与初始化属性

        self.lines = []  # 用于存储HTML文件的行内容
        self.line_index = 0  # 当前行的索引
        self.timer = wx.Timer(self)  # 创建定时器
        self.Bind(wx.EVT_TIMER, self.OnTimer, self.timer)  # 绑定定时器事件

定义 self.lines 用于存储 HTML 文件的行,self.line_index 表示当前行索引,self.timer 为定时器,用于逐行加载 HTML 内容。 wx.EVT_TIMER 事件绑定到 OnTimer 方法。

2.5 打开并读取 HTML 文件

    def OnOpenFile(self, event):
        with wx.FileDialog(self, "Open HTML file", wildcard="HTML files (*.html;*.htm)|*.html;*.htm",
                           style=wx.FD_OPEN | wx.FD_FILE_MUST_EXIST) as dialog:
            if dialog.ShowModal() == wx.ID_OK:
                file_path = dialog.GetPath()
                with open(file_path, 'r', encoding='utf-8') as file:
                    self.lines = file.readlines()
                
                self.memo.Clear()  # 清空Memo内容
                self.line_index = 0  # 重置行索引
                self.timer.Start(100)  # 每100毫秒加载一行

在 OnOpenFile 方法中,打开一个文件对话框选择 HTML 文件,成功选择后读取文件内容到 self.lines 列表中。清空 memo 的内容,重置行索引,并启动定时器,每100毫秒调用 OnTimer 一次。

2.6 定时器方法:逐行加载 HTML 内容

    def OnTimer(self, event):
        if self.line_index < len(self.lines):
            line = self.lines[self.line_index]
            self.memo.AppendText(line)  # 在Memo中添加当前行
            self.line_index += 1  # 增加行索引
        else:
            self.timer.Stop()  # 停止定时器
            self.DisplayHtml()  # 加载完成后显示HTML

OnTimer 方法负责逐行加载 HTML 内容。当 line_index 小于 lines 长度时,将当前行内容追加到 memo 中并更新索引。所有行加载完毕后,停止定时器并调用 DisplayHtml

2.7 在浏览器中显示 HTML 内容

    def DisplayHtml(self):
        html_content = ''.join(self.lines)  # 将所有行合并为完整HTML
        self.browser.SetPage(html_content, "")

DisplayHtml 将 lines 列表中的内容合并为完整 HTML 字符串,并在浏览器中显示。

3. 完整代码

以下是完整的代码:

import wx
import wx.html2
import time

class HtmlViewerApp(wx.Frame):
    def __init__(self, *args, **kw):
        super(HtmlViewerApp, self).__init__(*args, **kw)

        panel = wx.Panel(self)
        vbox = wx.BoxSizer(wx.HORIZONTAL)

        self.memo = wx.TextCtrl(panel, style=wx.TE_MULTILINE | wx.TE_READONLY)
        self.memo.SetBackgroundColour("#000000")
        self.memo.SetForegroundColour("#FFFFFF")
        vbox.Add(self.memo, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

        self.browser = wx.html2.WebView.New(panel)
        vbox.Add(self.browser, proportion=1, flag=wx.EXPAND | wx.ALL, border=5)

        panel.SetSizer(vbox)

        menubar = wx.MenuBar()
        fileMenu = wx.Menu()
        openItem = fileMenu.Append(wx.ID_OPEN, 'Open', 'Open HTML File')
        menubar.Append(fileMenu, "&File")
        self.SetMenuBar(menubar)

        self.Bind(wx.EVT_MENU, self.OnOpenFile, openItem)

        self.lines = []
        self.line_index = 0
        self.timer = wx.Timer(self)
        self.Bind(wx.EVT_TIMER, self.OnTimer, self.timer)

    def OnOpenFile(self, event):
        with wx.FileDialog(self, "Open HTML file", wildcard="HTML files (*.html;*.htm)|*.html;*.htm",
                           style=wx.FD_OPEN | wx.FD_FILE_MUST_EXIST) as dialog:
            if dialog.ShowModal() == wx.ID_OK:
                file_path = dialog.GetPath()
                with open(file_path, 'r', encoding='utf-8') as file:
                    self.lines = file.readlines()
                
                self.memo.Clear()
                self.line_index = 0
                self.timer.Start(100)

    def OnTimer(self, event):
        if self.line_index < len(self.lines):
            line = self.lines[self.line_index]
            self.memo.AppendText(line)
            self.line_index += 1
        else:
            self.timer.Stop()
            self.DisplayHtml()

    def DisplayHtml(self):
        html_content = ''.join(self.lines)
        self.browser.SetPage(html_content, "")

if __name__ == '__main__':
    app = wx.App(False)
    frame = HtmlViewerApp(None, title="HTML Viewer", size=(800, 600))
    frame.Show()
    app.MainLoop()

运行结果

4. 总结

本文演示了如何使用 wxPython 创建一个逐行加载 HTML 内容并显示的应用程序。通过定时器控制逐行加载的速度,用户可以获得一种逐步显示的体验。

到此这篇关于使用wxPython实现逐行加载HTML内容并实时显示效果的文章就介绍到这了,更多相关wxPython加载HTML内容并显示内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Python文件处理与垃圾回收机制详情

    Python文件处理与垃圾回收机制详情

    这篇文章主要介绍了Python文件处理与垃圾回收机制详情,文件是操作系统提供给用户应用程序操作硬盘的一个虚拟的概念接口,需要的朋友可以参考下面文章内容
    2022-09-09
  • python服务器中发送外部请求的基本步骤

    python服务器中发送外部请求的基本步骤

    在Python中,服务器发送外部请求是一个常见的操作,尤其是在需要集成不同服务或API时,有多种库可以帮助你完成这项任务,但最流行和广泛使用的库之一是requests,下面给大家分享python服务器中发送外部请求的基本步骤,感兴趣的朋友一起看看吧
    2024-08-08
  • python中reload重载实例用法

    python中reload重载实例用法

    在本篇文章里小编给大家整理的是一篇关于python中reload重载实例用法相关知识点,有兴趣的朋友们可以参考下。
    2020-12-12
  • Python中的getattr、__getattr__、__getattribute__、__get__详解

    Python中的getattr、__getattr__、__getattribute__、__get__详解

    这篇文章主要为大家介绍了Python中的getattr,__getattr__,__getattribute__和__get__,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2021-12-12
  • Python迭代器和生成器定义与用法示例

    Python迭代器和生成器定义与用法示例

    这篇文章主要介绍了Python迭代器和生成器定义与用法,结合实例形式详细分析了Python迭代器和生成器的概念、原理、定义、使用方法及相关操作注意事项,需要的朋友可以参考下
    2018-02-02
  • Flask SocketIO实现动态绘图的示例详解

    Flask SocketIO实现动态绘图的示例详解

    Flask-SocketIO 是基于 Flask 的一个扩展,用于简化在 Flask 应用中集成 WebSocket 功能,本文主要介绍了Flask SocketIO如何实现动态绘图,需要的可以参考下
    2023-11-11
  • python获取微信企业号打卡数据并生成windows计划任务

    python获取微信企业号打卡数据并生成windows计划任务

    由于公司的系统用的是Java版本,开通了企业号打卡之后又没有预算让供应商做数据对接,所以只能自己捣鼓这个,以下是个人设置的一些内容,仅供大家参考
    2019-04-04
  • Python构建图像分类识别器的方法

    Python构建图像分类识别器的方法

    今天小编就为大家分享一篇Python构建图像分类识别器的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-01-01
  • Django框架实现逆向解析url的方法

    Django框架实现逆向解析url的方法

    这篇文章主要介绍了Django框架实现逆向解析url的方法,结合实例形式分析了Django逆向解析URL的原理、步骤、相关实现技巧与注意事项,需要的朋友可以参考下
    2018-07-07
  • python中的iterator和"lazy iterator"区别介绍

    python中的iterator和"lazy iterator"区别介绍

    这篇文章主要介绍了python中的iterator和 “lazy iterator“之间有什么区别,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-04-04

最新评论