简介

嗨开发人员,我是 Yash Makan,今天我们将讨论如何在 python 中制作漂亮的 UI 应用程序。我知道当我在 python 的上下文中说“漂亮的 UI”时这听起来有点奇怪,因为我个人觉得标准的 Tkinter 库不足以开发令人惊叹的 UI。今天我们将介绍 4 种不同的方式在 python 中制作现代应用程序,所以事不宜迟,让我们开始吧,

https://i.giphy.com/media/3BUYbmXltgQ4zu0Tv5/giphy.webp

之前

https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cj3guv1g8ku69j50la5v.png

之后

https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7a5f3tplukh7tucr5blm.png

1.使用鳗鱼

我们列表中的第一种方法适用于了解 HTML 和 CSS(如果您不了解,那么我也强烈推荐它)以及 javascript 基础知识的开发人员。

它是如何工作的?

基本上,您将使用 HTML 和 CSS 开发前端,并在 python 中编写您的计算或后端部分。 nd eel 充当 python 和 javascript 之间的桥梁并传递数据。

https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d2irr9ptvtvo4c1pslxv.png

安装

pip install Eel

目录结构

└── Folder
    ├── templates
    |   ├── index.html
    |   ├── main.js
    |   └── style.css
    └── main.py

猫main.py

import eel

# name of folder where the html, css, js, image files are located
eel.init('templates')

@eel.expose
def demo(x):
    return x**2

# 1000 is width of window and 600 is the height
eel.start('index.html', size=(1000, 600))

猫 main.js

function compute() {
    var data = document.getElementById("data").value
    eel.demo(data)(setValue) // call the demo function which we have created in the main.py file
}

function setValue(res) {
    document.getElementById("abc").src = res
}

猫 index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>sample</title>
        <link href="style.css" rel="stylesheet">
        <script type="text/javascript" src="/eel.js"></script
        <script type="text/javascript" src="main.js"></script>
</head>
<body>
<!--
have to call compute() from here for example when user clicks any button or something like that.
-->
</body>
</html>

Github 参考

<https://github.com/ChrisKnott/Eel>

2. Figma 和 Python

好吧,你一定在想,Figma 和 python 的结合是什么?而且 Figma 是一个 UI 开发工具,而不是用 python 编写的库......是的!我知道你是对的,但让我们继续阅读这篇文章。

安装

pip install tkdesigner

工作原理

用户唯一需要做的就是用 Figma 设计一个界面,然后将 Figma 文件 URL 和 API 令牌粘贴到 Tkinter Designer 中。 Tkinter Designer 将自动生成在 Tkinter 中创建 GUI 所需的所有代码和图像。

https://user-images.githubusercontent.com/42001064/119832620-fb88c980-bf1b-11eb-8e9b-4affe7b92ba2.jpg

For complete procedure do watch [this](https://www.youtube.com/watch?v=mFjE2-rbpm8&t=66s&ab_channel=Parthjadhav) video on youtube from Parth Jadhav

Github 参考

https://github.com/ParthJadhav/Tkinter-Designer

3. Pywebview

pywebview 是围绕 webview 组件的轻量级跨平台包装器,允许在其自己的本机 GUI 窗口中显示 HTML 内容。 pywebview 由Roman Sirokov创建。

安装

pip install pywebview

示例代码

import webview

if __name__ == '__main__':
    window = webview.create_window('Load HTML Example', 'index.html')
    webview.start(window)

Github 参考

https://github.com/r0x0r/pywebview/

4. PyQT5

PyQt 是一个很棒的库,用于在 python 中开发现代平面 GUI。您可以使用 python 编码创建应用程序,这可能有点困难和压倒性,但由于我们介绍了最简单的方法,您甚至可以使用称为 PyQt5Designer 的拖放构建器制作 GUI。通过生成作为拖放程序的 .ui 文件来构建应用程序是一种很好的方式,然后您可以将此 .ui 文件转换为 .py 文件。

安装

pip install PyQt5Designer

步骤

安装后设计器将安装在您的系统中。只需在命令提示符下键入designer,designer.exe 就会弹出。它看起来像这样

PyQT5Designer

现在,您可以在画布中拖放元素。设计您的应用程序后,只需将其导出为 .ui 文件。稍后您可以使用 .py 文件转换此 .ui 文件,

pyuic5 -x [NAME_OF_UI_FILE].ui [NAME_OF_PY_FILE].py

结论

所以你看,这里有 4 种在 python 中制作令人印象深刻的 GUI 的简单方法。我希望你喜欢我的博客,如果这篇文章增加了任何价值,那么如果你留下一个喜欢并确保也加入书签,那就太好了。另外,与您的朋友分享帖子,以便他们也可以学到新的东西(不要自私......)。此外,您可以在Twitter上关注我,了解更多技术和 python 相关内容。希望再次出现在您的脑海中,直到那时再见!

再见

其他文章

  • 4 个免费的 python web 应用程序托管平台,分步过程

  • 18 个 Python 单行代码,可加快您的编码过程。

  • 可以回答你问题的人工智能机器人

  • 使用python生成自己喜欢的电视剧

社交

  • 我的网站

  • 推特

  • 横幅

Logo
向您推荐>>百度飞桨AI Studio社区

学AI，认准AI Studio！GPU算力，限时免费领，邀请好友解锁更多惊喜福利 >>>

更多推荐

cover

求助！为什么用InsCode部署会出现无限重定向？

avatar Python

如何重塑熊猫。系列

问题:如何重塑熊猫。系列 在我看来,它就像 pandas.Series 中的一个错误。 a = pd.Series([1,2,3,4]) b = a.reshape(2,2) b b 有类型 Series 但无法显示,最后一条语句给出异常,非常冗长,最后一行是“TypeError: %d format: a number is required, not numpy.ndarray”。 b.sha

avatar Python

在哪里可以找到有关 Keras 中默认权重初始化器的文档? [复制]

问题:在哪里可以找到有关 Keras 中默认权重初始化器的文档? [复制] 我刚刚在这里](https://keras.io/initializers/)中阅读了有关[中的 Keras 权重初始化器的信息。在文档中,只介绍了不同的初始化程序。如: model.add(Dense(64, kernel_initializer='random_normal')) 当我没有指定kernel_initia

avatar Python