强烈推荐一个Python库!制作Web Gui也太简单了!

简介: 强烈推荐一个Python库!制作Web Gui也太简单了!

前言


之前小编用Python做GUI界面,首选就是Tkinter、PyQt5 。但是它们实现起来工作量及代码量太大,还要一步步设计调试界面排版等问题,而且界面最终呈现也不是特别美观,还有就是打包后太大等一系列问题。


最近公司同事刚好有个相关界面开发需求,给我推荐了Python的新型Gui库,不仅可以做本地GUI程序,还可以同步生成一个Web Gui 服务,将Gui界面同步到浏览器上展示。它就是 nicegui


NiceGui介绍


NiceGui 是一个简单易用的基于Python的Web-UI框架,其目的是使在Python中开发前端应用程序变得容易。


小编也看了下其源代码,Web相关服务/路由等是基于Python FastAPI 框架构建的。而 UI 元素基于 Vue 和 Quasar。NiceGui 带有许多现成的元素。它甚至允许不同元素之间的值绑定。可以轻松显示各种图表。


主要功能:

  • 预加载了随时可用的 GUI 元素,如按钮、标签、复选框、滑块、开关
  • 表情符号图标、SVG 和 base64 支持
  • 提供简单的数据绑定
  • 用于刷新数据的内置定时器
  • 能够渲染 3D 场景,绘制图表
  • 可以轻松显示图像和视频
  • 它使自定义页面和布局变得容易,并且内置了对 Tailwind CSS 的支持


NiceGui的安装和使用


1、安装


使用 pip 下载 NiceGui(仅支持3.7及以上版本

pip install nicegui

2、编写一个简单代码,测试其功能是否正常

from nicegui import ui
# 创建一个标签
ui.label('Welcome to NiceGui!')  
# 创建一个按钮,设置回调函数,调用niceui的弹窗消息通知
ui.button('Click Here', on_click=lambda: ui.notify('Button Pressed'))
# niceui 运行
ui.run()

点击运行后,终端会输出web url访问地址,自动打开浏览器

NiceGUI ready to go on http://localhost:8080, and http://192.168.0.102:8080


NiceGui 常用API


1、图标和链接


  • icon() :此函数允许我们在 UI 上显示图标。要显示一个图标,我们需要提供一个图标名称。此功能依赖于 Quasar 的 QIcon。可以使用 CSS、Quasar 或 Tailwind 颜色指定颜色选项。大小选项由 classes() 方法使用 CSS 单位确定。
  • link() 此函数使我们能够将链接分配给 UI 中的文本。首先,我们指定应链接的文本,然后是相应的网站 URL。


效果展示:


2、选择元素


NiceGui 有不同的选择元素,如切换框、单选框和复选框

  • toggle():此函数可以生成一个切换框,我们在其中通过包含值到标签的映射的字典值列表传递选项。当用户选择一个选项时,它被保存在toggle变量中。
  • radio():这类似于 toggle() 函数,但在这里我们可以选择单选选项。
  • select():此函数生成一个下拉列表以选择特定选项。与上述函数相比,此函数的输入和存储的输出值相同。
  • checkbox():当用户选中复选框时,checkbox 变量被分配一个布尔值 True。


效果展示:

在这里,我们看到了我们创建的所有选择元素。单击 Dropdown Select,出现下拉操作,允许我们选择其中一个选项。这些只是我们研究过的部分元素。NiceGui 提供了广泛的元素以在各种场景中使用。


而且 NiceGui 支持不同 UI 元素之间的绑定值,允许无缝集成。

在上面的代码中,我们使用 ui.row() 元素将两个元素(radio 和 toggle)水平分组。要将它们垂直分组,我们可以使用 ui.column()。toggle() 函数包含变量 bind_values(),它将单选选项连接到切换选项。

在上面的图片中,我们可以清楚地看到两个 UI 元素之间的值绑定。同样,bind_value() 函数能够在 NiceGUI 提供的不同 UI 元素中工作。


3、用户输入和值绑定


允许用户在 UI 中输入文本或数字数据的功能。

上面代码中的函数包括:

  • input():使用此函数时,将创建一个空文本框,用户可以在其中键入数据。它有一个名为“ label ”的变量,它告诉用户它期望的输入类型。每当用户在输入框中输入内容时,ui.label() 的 .set_text() 函数就会激活并在屏幕上显示键入的文本。
  • number():此函数的工作方式与 input() 函数类似,唯一的区别是此函数接受数字而不是文本


效果展示:


4、数据元素和图表


通过 NiceGui显示表格数据。

要显示表格,请在列列表中指定列名。每列由列表中的字典表示。包括每列的名称、标签和字段值(通常所有列都相同)。可以根据需要提供额外的键值对。


例如,“required:True”键值对确保名称列需要添加到表中的任何新元素的值。“align”:”center” 将整个行对齐到该列名称下的居中对齐方式。


接下来是行列表。行列表是包含上述列值的字典列表。这里使用字段名称,我们在字典中提供field:value对。然后使用 ui.table() 函数,我们将表格显示到 UI。在这里我们可以给表格命名。row_key 的列名包含唯一值。


效果展示:

带有 NiceGui的 Pandas DataFrame


使用 table() 函数本身可以显示 Pandas 数据。

使用 NiceGUI 在屏幕上显示图形


使用 NiceGUI 中的 pyplot() 函数,它在 UI 上显示 matplotlib 图形。

在这里,我们使用 with 命令,然后使用 ui.pyplot() 函数。我们甚至将图的大小传递给函数。


现在,在with下面,我们编写通过matplotlib绘制图形的代码。这里我们编写了一个简单的图,其中x轴包含从0到10000的值,步长为10,y轴包含它们的对数值。


代码运行时的输出将是:


结论


开发人员使用 NiceGui(一种 Python Web 框架)来创建网站应用程序。其提供了必要的工具来开发一个完整的网站,所有的前端部分都完全在 Python 中。我们甚至看到了 NiceGUI 的不同元素以及如何接受用户输入。最后,我们通过绑定值了解了我们可以在不同的 UI 元素之间进行绑定的方法。

相关文章
|
1月前
|
存储 人工智能 测试技术
如何使用LangChain的Python库结合DeepSeek进行多轮次对话?
本文介绍如何使用LangChain结合DeepSeek实现多轮对话,测开人员可借此自动生成测试用例,提升自动化测试效率。
309 125
如何使用LangChain的Python库结合DeepSeek进行多轮次对话?
|
1月前
|
监控 数据可视化 数据挖掘
Python Rich库使用指南:打造更美观的命令行应用
Rich库是Python的终端美化利器,支持彩色文本、智能表格、动态进度条和语法高亮,大幅提升命令行应用的可视化效果与用户体验。
118 0
|
16天前
|
数据可视化 关系型数据库 MySQL
【可视化大屏】全流程讲解用python的pyecharts库实现拖拽可视化大屏的背后原理,简单粗暴!
本文详解基于Python的电影TOP250数据可视化大屏开发全流程,涵盖爬虫、数据存储、分析及可视化。使用requests+BeautifulSoup爬取数据,pandas存入MySQL,pyecharts实现柱状图、饼图、词云图、散点图等多种图表,并通过Page组件拖拽布局组合成大屏,支持多种主题切换,附完整源码与视频讲解。
105 4
【可视化大屏】全流程讲解用python的pyecharts库实现拖拽可视化大屏的背后原理,简单粗暴!
|
25天前
|
传感器 运维 前端开发
Python离群值检测实战:使用distfit库实现基于分布拟合的异常检测
本文解析异常(anomaly)与新颖性(novelty)检测的本质差异,结合distfit库演示基于概率密度拟合的单变量无监督异常检测方法,涵盖全局、上下文与集体离群值识别,助力构建高可解释性模型。
220 10
Python离群值检测实战:使用distfit库实现基于分布拟合的异常检测
|
2月前
|
运维 Linux 开发者
Linux系统中使用Python的ping3库进行网络连通性测试
以上步骤展示了如何利用 Python 的 `ping3` 库来检测网络连通性,并且提供了基本错误处理方法以确保程序能够优雅地处理各种意外情形。通过简洁明快、易读易懂、实操性强等特点使得该方法非常适合开发者或系统管理员快速集成至自动化工具链之内进行日常运维任务之需求满足。
158 18
|
2月前
|
机器学习/深度学习 API 异构计算
JAX快速上手:从NumPy到GPU加速的Python高性能计算库入门教程
JAX是Google开发的高性能数值计算库,旨在解决NumPy在现代计算需求下的局限性。它不仅兼容NumPy的API,还引入了自动微分、GPU/TPU加速和即时编译(JIT)等关键功能,显著提升了计算效率。JAX适用于机器学习、科学模拟等需要大规模计算和梯度优化的场景,为Python在高性能计算领域开辟了新路径。
243 0
JAX快速上手:从NumPy到GPU加速的Python高性能计算库入门教程
|
2月前
|
存储 监控 安全
Python剪贴板监控实战:clipboard-monitor库的深度解析与扩展应用
本文介绍了基于Python的剪贴板监控技术,结合clipboard-monitor库实现高效、安全的数据追踪。内容涵盖技术选型、核心功能开发、性能优化及实战应用,适用于安全审计、自动化办公等场景,助力提升数据管理效率与安全性。
129 0
|
17天前
|
算法 Java Go
【GoGin】(1)上手Go Gin 基于Go语言开发的Web框架,本文介绍了各种路由的配置信息;包含各场景下请求参数的基本传入接收
gin 框架中采用的路优酷是基于httprouter做的是一个高性能的 HTTP 请求路由器,适用于 Go 语言。它的设计目标是提供高效的路由匹配和低内存占用,特别适合需要高性能和简单路由的应用场景。
123 4
|
4月前
|
缓存 JavaScript 前端开发
鸿蒙5开发宝藏案例分享---Web开发优化案例分享
本文深入解读鸿蒙官方文档中的 `ArkWeb` 性能优化技巧,从预启动进程到预渲染,涵盖预下载、预连接、预取POST等八大优化策略。通过代码示例详解如何提升Web页面加载速度,助你打造流畅的HarmonyOS应用体验。内容实用,按需选用,让H5页面快到飞起!
|
4月前
|
JavaScript 前端开发 API
鸿蒙5开发宝藏案例分享---Web加载时延优化解析
本文深入解析了鸿蒙开发中Web加载完成时延的优化技巧,结合官方案例与实际代码,助你提升性能。核心内容包括:使用DevEco Profiler和DevTools定位瓶颈、四大优化方向(资源合并、接口预取、图片懒加载、任务拆解)及高频手段总结。同时提供性能优化黄金准则,如首屏资源控制在300KB内、关键接口响应≤200ms等,帮助开发者实现丝般流畅体验。

热门文章

最新文章

推荐镜像

更多