tkinter画图(丢弃Tkinter简单配置快速生成超酷炫)

tkinter画图(丢弃Tkinter简单配置快速生成超酷炫)(1)

作者:豆豆

来源:Python 技术

Python 届的 GUI 有很多库,像鼎鼎大名的 Tkinter、PyGUI 等,但问题是他们生成的 GUI 都不够好看,有种上世纪应用程序的风格,完全不像是互联网时代的产品。

今天给大家推荐一个超级棒的工具 Electron,只需要懂一些简单的 html、css 和 js 知识就能写出跨平台的,互联网风格的应用。

大名鼎鼎的 Visual Studio Code 就是使用 Electron 来编写的。

安装

正式开始之前,需要安装 Node 环境,直接从官网下载 Node.js 安装即可。

安装完成之后请使用以下命令来确保自己的 Node 环境是正常的。

node -v npm -v

之后开始初始化项目。

mkdir electron-app && cd electron-app npm init

至此,在 electron-app 文件夹中会生成一个 package.json 的文件,它看起来应该是下面这个样子,每个字段代表什么含义暂时先不用管,继续往下走。

{ "name": "my-electron-app", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC" }

最后,将 electron 添加到应用的开发依赖中。

npm install --save-dev electron

修改 package.json 文件,添加运行应用的命令。

{ "scripts": { "start": "electron ." } }

至此,环境我们是搭建完成了。

GUI

上面说了,Electron 是通过 html、css 和 js 来构建应用的,那我们首先来建一个 html 页面。

在根目录下创建 index.html 页面。

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World!</title> </head> <body> <h1>Hello World!</h1> </body> </html>

页面写好了,还需要一个启动入口文件来加载我们的页面。

在根目录下新建 index.js 文件。

const { app, BrowserWindow } = require('electron') const path = require('path') function createWindow () { const win = new BrowserWindow({ width: 800, height: 600, }) win.loadFile('index.html') } app.whenReady().then(() => { createWindow() })

在 js 文件中我们通过创建一个 BrowserWindow 来加载我们指定的页面 index.html。

通过 npm 来启动我们的项目。

npm start

不出意外,你应该可以看到如下页面了。

tkinter画图(丢弃Tkinter简单配置快速生成超酷炫)(2)

总结

Electron 是一款非常成熟且好用的可跨平台桌面应用程序开发神器,虽说我们今天只实现了简单版本的 Hello World,但在前端的加持下,写出酷炫的紧跟时代潮流的 GUI 那就是分分钟的事。

那这个 GUI 如何和我们的 Python 程序做交互呢,其一通过 http 接口,其二可以直接执行 Python 的脚本,小伙伴们感兴趣的可以跟着官方文档继续深入研究。

,

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com

    分享
    投诉
    首页