pywebview:用Python+Web技术打造轻量级桌面应用!

pywebview:用Python+Web技术打造轻量级桌面应用!
✍️作者:唐叔在学习
💡专栏:唐叔学python
关键词Python桌面开发pywebview教程WebView应用前后端分离JS与Python交互桌面应用打包Electron替代方案Python GUI

大家好,我是唐叔。今天我们来聊聊一个非常轻量且强大的Python库——pywebview。如果你曾经为开发一个简单的桌面应用而纠结于Electron的笨重、PyQt的复杂,或是Tkinter的界面简陋,那pywebview或许正是你一直在找的解决方案。

文章目录

一、介绍

pywebview 是一个轻量级的跨平台Python库,它允许你在一个原生窗口中嵌入Web技术(HTML/CSS/JS)来构建GUI界面。本质上,它就是一个迷你浏览器内核,让你可以用写网页的方式写桌面应用。

与其他桌面框架对比:

  • Electron:功能强大,但打包体积大、内存占用高。
  • PyQt/Tkinter:原生控件,但界面现代化程度低、开发效率不高。
  • pywebview轻量、跨平台、易上手,适合快速开发中小型桌面应用,尤其是已有Web前端的项目。

二、安装

安装全量版本

pip install pywebview 

安装指定环境版本

如果你希望控制依赖版本,可以使用:

pip install pywebview[qt]# 使用Qt后端 pip install pywebview[cef]# 使用CEF后端

三、使用入门

3.1 基本使用

来看一个最简单的例子:

import webview defmain(): window = webview.create_window('Hello pywebview','https://pywebview.flowrl.com') webview.start()if __name__ =='__main__': main()

函数说明

  • create_window():创建窗口,参数包括标题和初始URL或本地HTML路径。
  • start():启动GUI事件循环。

3.2 应用程序架构

纯网络服务架构

就如上文的基本使用,前端只需暴露应用服务器,后端调用即可

import webview if __name__ =='__main__': webview.create_window("My App","http://localhost:3000") webview.start(http_server=True, port=3000)
官网有完整的示例 基于 Flask 的应用程序 供参考学习。
无服务器架构

完全不使用网络服务器,通过 webview.create_window(...html='') 或者 window.load_html 加载 HTML。

import webview html=''' <!DOCTYPE html> <html> <body> <h1>Hello from HTML!</h1> </body> </html> ''' webview.create_window("Local App", html=html) webview.start()
根据官网说明:这种方法有一些限制,因为在加载的页面上下文中没有文件系统。图片和其他资源只能通过 Base64 内联加载。

3.3 JS与Python交互

pywebview 支持在JS中调用Python函数,也支持在Python中调用JS方法。

下述是JS中调用Python函数的代码示例:

Python端

import webview classApi:defget_message(self):return"Hello from Python!"if __name__ =='__main__': api = Api() window = webview.create_window('JS 接口 示例','index.html', js_api=api) webview.start()

JS端(在HTML中):

<!DOCTYPEhtml><html><body><buttononClick="greet()">打招呼</button></body><script>functiongreet(){ pywebview.api.get_message().then(function(message){alert(message);});}</script></html>
✅ 推荐将Python逻辑封装成API,JS中异步调用,保持前后端分离。

四、应用打包

使用 pyinstaller 打包你的应用:

pyinstaller --onefile --windowed your_script.py 

打包后会生成一个独立的可执行文件,可在没有Python环境的机器上运行。

有关 pyinstaller 的介绍,详情请查阅唐叔的这篇文章:告别Python环境依赖!用PyInstaller打包EXE的终极指南_python打包成exe-ZEEKLOG博客

五、常见使用场景

5.1 文件操作

文件下载

你可以使用Python控制文件下载路径,或由前端触发下载。

import webview if __name__ =='__main__':# 创建一个标准的 webview 窗口 webview.settings['ALLOW_DOWNLOADS']=True window = webview.create_window('Simple browser','https://pywebview.idepy.com/download') webview.start()
文件拖放

下述是常见的文件拖放效果,实际上是通过拖放后获取到文件路径,进而通过文件路径调用相关API再进一步操作文件。

import webview from webview.dom import DOMEventHandler defon_drag(e):passdefon_drop(e): files = e['dataTransfer']['files']iflen(files)==0:returnprint(f'事件类型: {e["type"]}。被拖入的文件:')forfilein files:print(file.get('pywebviewFullPath'))defbind(window): window.dom.document.events.dragenter += DOMEventHandler(on_drag,True,True) window.dom.document.events.dragstart += DOMEventHandler(on_drag,True,True) window.dom.document.events.dragover += DOMEventHandler(on_drag,True,True, debounce=500) window.dom.document.events.drop += DOMEventHandler(on_drop,True,True)if __name__ =='__main__': window = webview.create_window('拖放示例', html=''' <html> <body-> <h1>将文件拖放到此处</h1> </body> </html> ''') webview.start(bind, window)

5.2 自定义菜单

pywebview 支持自定义系统菜单:

import webview import webview.menu as wm defchange_active_window_content(): active_window = webview.active_window()if active_window: active_window.load_html('<h1>You changed this window!</h1>')defclick_me(): active_window = webview.active_window()if active_window: active_window.load_html('<h1>You clicked me!</h1>')defdo_nothing():passdefsay_this_is_window_2(): active_window = webview.active_window()if active_window: active_window.load_html('<h1>This is window 2</h2>')defopen_file_dialog(): active_window = webview.active_window() active_window.create_file_dialog(webview.SAVE_DIALOG, directory='/', save_filename='test.file')if __name__ =='__main__': window_1 = webview.create_window('Application Menu Example','https://pywebview.idepy.com/hello') window_2 = webview.create_window('Another Window', html='<h1>Another window to test application menu</h1>') menu_items =[ wm.Menu('Test Menu',[ wm.MenuAction('Change Active Window Content', change_active_window_content), wm.MenuSeparator(), wm.Menu('Random',[ wm.MenuAction('Click Me', click_me), wm.MenuAction('File Dialog', open_file_dialog),],),],), wm.Menu('Nothing Here',[wm.MenuAction('This will do nothing', do_nothing)]),] webview.start(menu=menu_items)
💡 你也可以完全用HTML+CSS在前端构建菜单,更灵活美观。

5.3 图标设置

使用 webview.start(icon=<file_path>) 设置窗口图标。

import webview if __name__ =='__main__': window = webview.create_window('Set window icon','https://pywebview.idepy.com/hello') webview.start(icon='../logo/logo.png')
此方法仅在 GTK 和 QT 平台上受支持。其他平台的图标将在冻结过程中设置。

六、总结

pywebview 是一个非常灵活且强大的工具,尤其适合:

  • 已有Web前端,想快速封装成桌面应用;
  • 希望用HTML/CSS/JS构建现代化界面;
  • 对应用体积和内存占用有要求的场景;
  • 需要跨平台运行(Windows/macOS/Linux)。

它的学习曲线平缓,社区活跃,文档完善,是Python开发者进军桌面应用开发的绝佳选择。

如果你正在寻找一个轻量、高效、易扩展的桌面开发方案,不妨试试 pywebview,相信它会给你带来惊喜。

唐叔说
技术选型没有绝对的好坏,只有适合与否。pywebview 在我多个中小项目中表现出色,尤其是在快速原型和内部工具开发中。希望这篇指南能帮你少走弯路,早日打造出属于自己的桌面应用!

如果有新的想法,欢迎在评论区留言,我们一起交流进步!🎉


参考资料

Read more

SLAM Toolbox终极指南:高效机器人定位与建图实践

SLAM Toolbox终极指南:高效机器人定位与建图实践 【免费下载链接】slam_toolboxSlam Toolbox for lifelong mapping and localization in potentially massive maps with ROS 项目地址: https://gitcode.com/gh_mirrors/sl/slam_toolbox SLAM Toolbox是一款基于ROS的先进开源框架,专为机器人定位与地图构建设计。它支持终身建图、多机器人协同作业等高级功能,能够在大规模环境中实现精准的SLAM操作。本文为您提供从入门到精通的完整解决方案。 为什么选择SLAM Toolbox?解决传统SLAM痛点 传统SLAM方案在面临大规模环境时常常遇到瓶颈:内存占用过高、建图速度缓慢、无法适应环境变化。SLAM Toolbox通过创新的架构设计,完美解决了这些问题: * 内存效率:优化的数据结构支持超大规模地图构建 * 实时性能:在标准硬件上可达5倍实时速率的建图 * 环境适应性:终身建图功能让机器人能够持续更新地图

树莓派4B连接大疆M300无人机全网最细教程

树莓派4B连接大疆M300无人机全网最细教程

注:本教程适用于树莓派4B连接大疆M300_RTK无人机,若是其余型号可以参考本文思路,但是具体细节请前往官方教程或大疆开发者论坛查找,第三方开发板连接大疆无人机,不同型号之间会有很多细节差异,请确认自己的型号然后针对性查找 官方教程网址:Payload SDK (官方的是树莓派4B连接M350!并非M300,实现细节完全不同,请慎重查看) 大疆开发者论坛网址:Payload SDK – 大疆创新SDK技术支持论坛 (优点:几乎能找到所有问题的解决方法;缺点:太零散了,找解决方法如同大海捞针) 1 硬件准备 1.1 硬件选型 * 无人机型号:M300_RTKM300顶部一共有三个接口,其中OSDK端口和云台口(Payload SDK Port)可以用来运行PSDK程序,TypeC调参口,则是用来与电脑连接,打开DJI Assistant2软件后,可以升级无人机固件,导出日志,使用模拟器,绑定负载等。 1.FPV摄像头13.左视和右视红外感知系统25.调参接口2.前视红外感知系统14.

小爱音乐Docker完全部署手册:打造智能家居音乐中心

小爱音乐Docker完全部署手册:打造智能家居音乐中心 【免费下载链接】xiaomusic使用小爱同学播放音乐,音乐使用 yt-dlp 下载。 项目地址: https://gitcode.com/GitHub_Trending/xia/xiaomusic 还在为小爱音箱的音乐资源受限而困扰吗?小爱音乐Docker项目为您带来突破性的解决方案,通过Docker容器化技术,让您的智能音箱瞬间升级为全功能音乐播放中心。只需简单几步部署,即可享受语音点歌、多房间同步的智能化音乐体验。 🎯 部署准备与环境检查 系统要求确认 开始部署前,请仔细核对以下环境配置: * Docker运行环境(版本20.10+) * 至少512MB可用内存空间 * 稳定的网络连接环境 快速部署方案 标准部署命令: docker run -d --name xiaomusic \ -p 58090:8090 \ -v /xiaomusic_data:/app/data \ -v /xiaomusic_config:/app/

宇树G1机器人强化学习训练完整实战教程

宇树G1机器人强化学习训练完整实战教程

0. 前言 人形机器人的运动控制一直是机器人领域的重要挑战,而强化学习为解决这一问题提供了强有力的工具。本教程将基于宇树G1人形机器人,从基础的强化学习环境搭建开始,逐步深入到高自由度模型的训练配置、奖励函数设计与优化,最终实现复杂动作的训练控制。作者看到一个很棒的系列,所以针对性的对文章内容进行了整理和二次理解,方便大家更好的阅读《不同自由度的宇树G1机器人强化学习训练配置及运行实战 + RSL-RL代码库问题修复》、《宇树G1机器人强化学习训练奖励函数代码架构 + 创建新的奖励函数(1)》、《RL指标分析与看板应用 — 宇树G1机器人高自由度模型强化学习训练实战(3)》、《调参解析 — 宇树G1机器人高自由度模型强化学习训练实战(4)》、《舞蹈训练?手撕奖励函数 — 宇树G1机器人高自由度模型强化学习训练实战(5)》。 1. 强化学习训练环境配置 1.1 基础环境搭建 宇树机器人的强化学习训练基于Isaac Gym物理仿真环境和RSL-RL强化学习框架。首先需要确保这两个核心组件正确安装和配置。 在开始训练之前,我们通过简单的命令来启动12自由度G1机器人的基础训练: