知行编程网知行编程网  2022-05-10 08:00 知行编程网 |  隐藏边栏 |   抢沙发 |  23 
文章评分 0 次，平均分 0.0 ：

再见HTML ! 用纯Python就能写一个漂亮的网页

我们在写一个网站或者一个网页界面的时候，需要学习很多东西，对小白来说很困难！比如我要做一个简单的网页交互：
  • 要懂后端，比如Python里面的Django或者Flask，或者是Java里面的SpringBoot
  • 要懂前端，现在都叫大前端了(因为很复杂)，比如前端的框架Vue/React, 然后页面的美化框架Bootstrap ，还有html ,csss 和Javascript 三驾马车.
天啊，听听头都大呢！其实我就给老板做一个简单的交互的页面，而且我只会Python ,有没有很简单的办法可以做到呢。

今天小编在Github上逛的时候，找到一个非常酷的神器，名字叫remi ,目前收获了2300个赞。

再见HTML ! 用纯Python就能写一个漂亮的网页


star并不是很多，但是这个库可是选入2018年的十大明星库，号称是一个独立的GUI库，而且最牛逼的就是这个库竟然小于 100K，是否很神奇呢，我们一起来体验看一下特性：

  • 跟其他GUI库区别？ Kivy，PyQT和PyGObject都需要主机操作系统的本机代码，这意味着安装或编译大型依赖项。Remi只需要一个Web浏览器即可显示您的GUI。

  • 我需要懂HTML吗？ 不，只需要使用Python进行编码。

  • 它是开源的吗？ 当然！Remi是根据Apache许可发布的。开源，免费！

  • 我需要某种网络服务器吗？ 不，自带网络服务器。


 1 

安装


如何安装呢，因为是Python 库，直接用pip 即可

<span style="font-size: 16px;">pip install remi</span>

如果是没有网络的，或者服务器跟外网不通的，可以离线安装。下载这个包，然后用install 安装

<span style="font-size: 16px;">python setup.py install</span>



 2 

快速体验


我们来快速看一下，这个简单的Hello world网页。

再见HTML ! 用纯Python就能写一个漂亮的网页

这里面包含了一个 2个元素：

  • 文本Hello world ；

  • 一个Press me的按钮；


点击这个按钮还会改变Hello world的文本内容，看点一下就变成了Button pressed.

再见HTML ! 用纯Python就能写一个漂亮的网页

上面这个简单的效果，其实只用了20来行Python代码，都是原生的Python代码，没有用一行HTML .


我们来看一下源码：

再见HTML ! 用纯Python就能写一个漂亮的网页

整个的代码的结构层次还很清晰的：
  • 首先声明一个MyApp类，这个类会继承母框架App里面的功能，可以认为是一个网页画布；
  • 然后在这个画布里面有3个函数：
    init主要是做类的初始化工作；
    main主要对这个画布布局进行设计，包含一个文本和一个按钮。
    on_button_pressed主要是控件的相应，点击触发函数
  • 最后是start来启动这个类，就会生成一个本地的网站链接


再见HTML ! 用纯Python就能写一个漂亮的网页



 3 

更多复杂的网页元素



看完上面的设计是不是就觉得跟Python里面大名鼎鼎的tk库很相似啊，上面的只是开胃菜，这个remi还能提供更复杂的gui界面元素。


再见HTML ! 用纯Python就能写一个漂亮的网页


上面的是一个完整的demo页面,基本上常见的控件元素的都包含了，比如有菜单栏，文本，按钮，单选框，进度栏，下拉框，表格，弹出框，按钮选取文件路径，文件树形结构，日期等几十种控件。



再见HTML ! 用纯Python就能写一个漂亮的网页


有了这个神器，是不是可以告别Python里面的tk库，也可以省去学习HTML的时间，还等啥，赶紧下载尝鲜一下吧。


链接:

https://github.com/dddomodossola/remi



本文转载来自 程序员GitHub, 转载请联系小编



<p style="text-align: left;"><span style="color: rgb(255, 41, 65);font-size: 16px;"><strong>近期十大热门：</strong></span></p><p style="text-align: left;"><span style="color: rgb(255, 41, 65);font-size: 16px;"><strong><br  /></strong></span></p><ul class="list-paddingleft-2" style="list-style-type: disc;"><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="text-decoration: underline;color: rgb(0, 0, 0);font-size: 15px;"><strong>我总结的80页《菜鸟学Python精选干货.pdf》,都是干货<br  /></strong></span></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="text-decoration: underline;color: rgb(0, 0, 0);font-size: 15px;"><strong style="white-space: pre-wrap;color: rgb(255, 41, 65);">笑喷了，我用Python帮韦小宝选最佳老婆组合</strong></span></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="text-decoration: underline;color: rgb(0, 0, 0);font-size: 15px;">用Python一键生成炫酷九宫格图片，火了朋友圈<br  /></span></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="color: rgb(0, 0, 0);font-size: 15px;">菜鸟也疯狂！8分钟用Python做一个酷炫的家庭随手记</span><br  /></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="color: rgb(0, 0, 0);font-size: 15px;">Github获8300星！用Python开发的一个命令行的网易云音乐</span><br  /></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="text-decoration: underline;color: rgb(0, 0, 0);font-size: 15px;">一道Python面试题，硬是没憋出来，最后憋出一身汗！</span></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="color: rgb(0, 0, 0);font-size: 15px;">Python高手进阶|实战4大并发秘籍</span><br  /></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="color: rgb(0, 0, 0);font-size: 15px;">让你纵横 GitHub 的五大神器</span><br  /></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="color: rgb(0, 0, 0);font-size: 15px;">值得收藏！8大技巧，带你了解菜鸟和高手的区别！</span><br  /></p></li><li style="text-align: left;font-size: 15px;"><p style="line-height: 2em;"><span style="text-decoration: underline;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);cursor: pointer;color: rgb(0, 0, 0);font-size: 15px;">卧槽！Pdf转Word用Python轻松搞定！</span></p></li></ul><p style="line-height: 2em;"><br  /></p><section style="text-align: left;line-height: 1.75em;"><br  /></section>
<pre style="letter-spacing: 0.544px;line-height: inherit;"><section data-mpa-template="t" mpa-from-tpl="t"><section data-id="94086" data-color="#276ca3" data-tools="135编辑器" mpa-from-tpl="t"><section><section mpa-from-tpl="t"><pre style="color: rgb(63, 63, 63);letter-spacing: 0.544px;line-height: inherit;"><section data-mpa-template="t" mpa-from-tpl="t"><section data-id="94086" data-color="#276ca3" data-tools="135编辑器" mpa-from-tpl="t"><section style="text-align: right;"><section mpa-from-tpl="t" style="display: inline-block;"><pre style="letter-spacing: 0.544px;line-height: inherit;"><pre data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-style="letter-spacing: 0.544px; background-color: rgb(255, 255, 255); text-align: center; color: rgba(230, 230, 230, 0.9); font-size: 16px; line-height: 25.6px; overflow-wrap: break-word !important;" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgba(230, 230, 230, 0.9)" data-darkmode-original-color-15882396318564="rgba(230, 230, 230, 0.9)" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgba(230, 230, 230, 0.9)" data-darkmode-original-color-15900529136199="rgba(230, 230, 230, 0.9)" class="js_darkmode__5" style="letter-spacing: 0.544px;text-align: center;color: rgba(230, 230, 230, 0.9);line-height: 25.6px;"><section class="js_darkmode__7"><section data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" style="display: inline-block;clear: both;"><section data-tools="135编辑器" data-id="91842" data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" style="letter-spacing: 0.544px;border-width: 0px;border-style: none;border-color: initial;"><section data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" style="display: inline-block;clear: both;"><section data-brushtype="text" data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgimage-15860613985508="1" data-style="padding: 18px 15px 20px 10px; color: rgb(86, 146, 214); text-align: center; letter-spacing: 1.5px; background-image: url('https://www.zkxjob.com/wp-content/uploads/2022/05/wxsync-2022-05-a2a8a5e1e58f30392066a170034ee027.png'); background-size: 100% 100%; background-repeat: no-repeat; overflow-wrap: break-word !important;" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgimage-15870356070738="1" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgimage-15870356071023="1" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgimage-15882384789136="1" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgimage-15882396318564="1" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" data-darkmode-bgimage-15900529136199="1" class="js_darkmode__bg__0 js_darkmode__8" style="padding: 18px 15px 20px 10px;background-size: 100% 100%;background-image: url('https://www.zkxjob.com/wp-content/uploads/2022/05/wxsync-2022-05-a2a8a5e1e58f30392066a170034ee027.png');color: rgb(86, 146, 214);letter-spacing: 1.5px;background-repeat: no-repeat;"><section data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgimage-15860613985508="1" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgimage-15870356070738="1" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgimage-15870356071023="1" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgimage-15882384789136="1" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgimage-15882396318564="1" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" data-darkmode-bgimage-15900529136199="1" style="display: flex;justify-content: center;align-items: center;"><section data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(230, 230, 230)" data-darkmode-original-color-15860613985508="rgb(0, 0, 0)" data-darkmode-bgimage-15860613985508="1" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(230, 230, 230)" data-darkmode-original-color-15870356070738="rgb(0, 0, 0)" data-darkmode-bgimage-15870356070738="1" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(230, 230, 230)" data-darkmode-original-color-15870356071023="rgb(0, 0, 0)" data-darkmode-bgimage-15870356071023="1" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(230, 230, 230)" data-darkmode-original-color-15882384789136="rgb(0, 0, 0)" data-darkmode-bgimage-15882384789136="1" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(230, 230, 230)" data-darkmode-original-color-15882396318564="rgb(0, 0, 0)" data-darkmode-bgimage-15882396318564="1" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(230, 230, 230)" data-darkmode-original-color-15900529136199="rgb(0, 0, 0)" data-darkmode-bgimage-15900529136199="1" style="margin-left: 2px;widows: 1;caret-color: rgb(255, 0, 0);width: 20px;"></section><section data-brushtype="text" data-darkmode-bgcolor-15860613985508="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15860613985508="rgb(255, 255, 255)" data-darkmode-color-15860613985508="rgb(51, 51, 51)" data-darkmode-original-color-15860613985508="rgb(51, 51, 51)" data-darkmode-bgimage-15860613985508="1" data-darkmode-bgcolor-15870356070738="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356070738="rgb(255, 255, 255)" data-darkmode-color-15870356070738="rgb(51, 51, 51)" data-darkmode-original-color-15870356070738="rgb(51, 51, 51)" data-darkmode-bgimage-15870356070738="1" data-darkmode-bgcolor-15870356071023="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15870356071023="rgb(255, 255, 255)" data-darkmode-color-15870356071023="rgb(51, 51, 51)" data-darkmode-original-color-15870356071023="rgb(51, 51, 51)" data-darkmode-bgimage-15870356071023="1" data-darkmode-bgcolor-15882384789136="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882384789136="rgb(255, 255, 255)" data-darkmode-color-15882384789136="rgb(51, 51, 51)" data-darkmode-original-color-15882384789136="rgb(51, 51, 51)" data-darkmode-bgimage-15882384789136="1" data-darkmode-bgcolor-15882396318564="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15882396318564="rgb(255, 255, 255)" data-darkmode-color-15882396318564="rgb(51, 51, 51)" data-darkmode-original-color-15882396318564="rgb(51, 51, 51)" data-darkmode-bgimage-15882396318564="1" data-darkmode-bgcolor-15900529136199="rgb(36, 36, 36)" data-darkmode-original-bgcolor-15900529136199="rgb(255, 255, 255)" data-darkmode-color-15900529136199="rgb(51, 51, 51)" data-darkmode-original-color-15900529136199="rgb(51, 51, 51)" data-darkmode-bgimage-15900529136199="1" style="widows: 1;caret-color: rgb(255, 0, 0);font-size: 14px;color: rgb(51, 51, 51);text-align: right;"><span style="font-family: 楷体, 楷体_GB2312, SimKai;font-size: 16px;">点的“在看”，否则就看不到我了555</span></section></section></section></section></section></section></section>

本篇文章来源于: 菜鸟学Python

本文为原创文章，版权归所有，欢迎分享本文，转载请保留出处！

分享到：
扫一扫，分享本文
知行编程网
知行编程网 关注：1    粉丝：1
这个人很懒，什么都没写

你可能也喜欢

热评文章

上一篇
下一篇

发表评论

表情 格式 链接 私密 签到
扫一扫二维码分享
 繁