NiceGUI 是一个基于 Python 的现代 Web 应用框架

NiceGUI 是一个基于 Python 的现代 Web 应用框架,它允许开发者直接使用 Python 构建交互式 Web 界面,而无需编写前端代码。以下是 NiceGUI 的主要功能和特点:

核心功能

1.简单易用的 UI 组件

提供按钮、文本框、下拉菜单、滑块、图表等常见 UI 元素

支持布局管理(水平、垂直、卡片式等)

可自定义样式和交互行为

  1. 实时交互

支持双向数据绑定

事件驱动编程模型(点击、输入变化等)

实时更新 UI 内容

  1. 数据可视化

集成 Plotly、Matplotlib 等图表库

支持实时数据图表

可展示 3D 图形和复杂数据可视化

  1. 多平台支持

可以作为 Web 应用运行

也可以打包为桌面应用(通过 PyInstaller 等工具)

支持移动设备访问

  1. 扩展性

可集成自定义 JavaScript 代码

支持与其他 Python 库(如 Pandas、NumPy)无缝协作

可扩展自定义组件

示例代码

下面是一个简单的 NiceGUI 应用示例,展示了基本的 UI 组件和交互功能: UI组件可输出Markdown、HTML、可运行script脚本

复制代码
from nicegui import ui, Client

name = ui.input(label='你的名字')
button = ui.button('打招呼', on_click=lambda: result.set_text(f'你好,{name.value}!'))
result = ui.label()

# 嵌入JavaScript
def run_js():
    # Execute JavaScript code
    ui.run_javascript('alert("这是来自JavaScript的弹窗!")')

# 嵌入JavaScript
def get_window_width():
    # Execute JavaScript to get window width
    width = ui.run_javascript('return window.innerWidth')
    ui.notify(f'窗口宽度: {width}px')
with ui.row():
    ui.button('运行JS', on_click=run_js)
    ui.button('获取窗口宽度', on_click=get_window_width)



# 嵌入HTML内容
html_content = """
<div style="background-color:#f0f0f0; padding:10px; border-radius:5px;">
    <h3>HTML内容展示</h3>
    <p>这是一段嵌入的<strong>HTML</strong>代码</p>
    <button onclick="alert('HTML按钮被点击!')",color="blue">HTML按钮</button>
</div>
"""

ui.html(html_content)

# 嵌入Markdown内容
markdown_content = """
# Markdown示例

这是一个展示**Markdown**功能的示例:

1. 列表项1
2. 列表项2
3. 列表项3

> 这是一段引用

[NiceGUI官网](https://nicegui.io)

代码示例:
```python
def hello_world():
    print("Hello from Markdown!")

- **aaa**
- **bbb**
- **ccc**

表格1:
|姓名  |  年龄    |城市|
|---|---|---|
|张三|    25     |  北京|
|李四    |30      | 上海|

表格2:
| 姓名 | 年龄 | 职业 |
| --- | --- | --- |
| 张三 | 28 | 工程师 |
| 李四 | 32 | 设计师 |
| 王五 | 45 | 产品经理 |

"""
ui.markdown(markdown_content)

ui.html('<p>-------控件绑定属性-----------</p>') 

# 绑定属性

class Demo:
    def __init__(self):
        self.number = 1
demo = Demo()

v = ui.checkbox('visible', value=True)
with ui.column().bind_visibility_from(v, 'value'):
    ui.slider(min=1, max=3).bind_value(demo, 'number')
    ui.toggle({1: 'A', 2: 'B', 3: 'C'}).bind_value(demo, 'number')
    ui.number().bind_value(demo, 'number')

ui.run()

应用场景

  • 数据仪表板:实时显示和分析数据
  • 交互式工具:构建科学计算、工程或数据分析工具
  • 快速原型开发:无需前端知识即可快速构建 Web 应用原型
  • 桌面应用替代方案:使用 Web 技术构建跨平台桌面应用

NiceGUI 特别适合 Python 开发者快速构建功能丰富的 Web 界面,尤其在数据科学和自动化领域有很大优势。

复制代码
相关推荐
周周爱喝粥呀20 小时前
【基础】Three.js 实现 3D 字体加载与 Matcap 金属质感效果(附案例代码)
前端·javascript·vue.js·3d
克喵的水银蛇20 小时前
Flutter 通用输入框封装实战:带校验 / 清除 / 密码切换的 InputWidget
前端·javascript·flutter
2501_9159090620 小时前
Fiddler抓包与接口调试实战,HTTPHTTPS配置、代理设置与移动端抓包详解
前端·测试工具·ios·小程序·fiddler·uni-app·webview
dongdeaiziji21 小时前
PyTorch自动微分系统(Autograd)深度解析:从原理到源码实现
人工智能·pytorch·python
我命由我1234521 小时前
微信小程序开发 - 为 tap 事件的处理函数传递数据
开发语言·前端·javascript·微信小程序·小程序·前端框架·js
百万蹄蹄向前冲1 天前
Trae Genimi3跟着官网学实时通信 Socket.io框架
前端·后端·websocket
狂炫冰美式1 天前
TRAE SOLO 驱动:重构AI模拟面试产品的复盘
前端·后端·面试
生信大表哥1 天前
单细胞测序分析(五)降维聚类&数据整合
linux·python·聚类·数信院生信服务器
故事不长丨1 天前
C#定时器与延时操作的使用
开发语言·c#·.net·线程·定时器·winform
1024肥宅1 天前
JavaScript 拷贝全解析:从浅拷贝到深拷贝的完整指南
前端·javascript·ecmascript 6