1.1 Eel是python的轻量级桌面GUI程序开拓库。
1.2 已先容，暂时略。讲一个用Python写个Metro风格的桌面程序。
1.3 资料来源，对代码进行注释。
https://www.jianshu.com/p/625da69a1d38https://baijiahao.baidu.com/s?id=1613452977046555462
1.4 环境：deepin-linux深度操作系统，python3.8，谷歌浏览器，微软vscode编辑器。
学习李敖大师，作品必配美女图，吸引把稳力。
2 文件构造：大略，一个main.py和一个web文件夹（里面有一个main.html）
3 main.py代码：
#---导出模块---import eel#---初始化，指定web文件夹，便于启动main.html文件eel.init('web')#---利用装饰器,类似flask里面对路由的定义---@eel.expose#---定义函数：python与html的联动设置---def hello1(): return '你好，python的eel'#把稳每一个函数都必须重新利用装饰器@eel.exposedef hello2(): return 'Eel很大略呀！
'#---启动的函数---调用放在末了,port=0表示利用随机端口,size=(宽,高)#eel.start('main.html', port=0, size=(600,300))eel.start('main.html')
4 main.html代码：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>用Python写个Metro风格的桌面程序</title> <link href="https://cdn.metroui.org.ua/v4/css/metro-all.min.css" rel="stylesheet"> <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <script type="text/javascript" src="https://cdn.metroui.org.ua/v4/js/metro.min.js"></script> <!--把稳eel.js文件的导入；是eel的一大特点，与常见的js导入不同和vue也不同--> <!--这个"/eel.js"便是默认从你安装的eel模块中导出，也便是项目文件夹中无eel.js均可以，也就不存在本地和在线导入eel.js--> <script type="text/javascript" src="/eel.js"></script> <script> // 调用python中的函数,把稳须要在定义前加上async声明异步 async function show1val(){ //调出python代码函数，关键点 let text= await eel.hello1()(); $("#txt").val(text); } // 把稳onclick的按钮函数在这里逐步添加，也便是py中的装饰器下的def定义函数 async function show2val(){ let text= await eel.hello2()(); $("#txt").val(text); } </script></head><body><nav data-role='ribbonmenu'> <ul class='tabs-holder'> <li><a href="#section-1-1">文件</a></li> <li><a href="#section-1-1">设置</a></li> </ul> <div class='content-holder'> <div class='section' id='section-1-1'> <div class='group'> <button class='ribbon-button' onclick='show1val()'> <span class="mif-copy mif-5x fg-blue"></span> <span class="caption">显示1</span> </button> <button class='ribbon-button' onclick='show2val()'> <span class="mif-copy mif-5x fg-blue"></span> <span class="title">显示2</span> </button> <span class="title">文本显示</span> </div> <div class='group'> <button class='ribbon-button'> <span class="mif-copy mif-5x fg-blue"></span> <span class="caption">github</span> </button> <button class='ribbon-button'> <span class="mif-copy mif-5x fg-blue"></span> <span class="title">gitlab</span> </button> <span class="title">提交</span> </div> </div> </div></nav><textarea id="txt" rows="100"></textarea></body></html>
5 运行及效果图
很方面，如果和vue结合会更强大。整理并分享出来，喜好就收藏和转发。
