快速搭建web见面

Rodja Trappe 2a7dbad36d tailwind styling in markdown element 4 سال پیش
.github fc127dc4fe trying to make automated pypi releases with poetry 4 سال پیش
.vscode 852faab6b1 do not set blank lines 4 سال پیش
nicegui 2a7dbad36d tailwind styling in markdown element 4 سال پیش
sceenshots 02e770f4c1 adding docs for some interactive elements 4 سال پیش
.gitignore 11844e40cc cleanup 4 سال پیش
Dockerfile aa720926d5 moving more documentation into the new format (and further improving styling) 4 سال پیش
LICENSE 0cb68ea25c Adding license 4 سال پیش
README.md aa720926d5 moving more documentation into the new format (and further improving styling) 4 سال پیش
docker-compose.yml 72d4c24e8b do not show reloading popups 4 سال پیش
docker.sh 627296fbd6 simplified docker.sh 4 سال پیش
examples.py 4c49010f39 allow activating and deactivating a timer 4 سال پیش
main.py 2a7dbad36d tailwind styling in markdown element 4 سال پیش
nicegui.code-workspace e11050e6f3 made dev container debuggable 4 سال پیش
poetry.lock 2d87b5c281 adding binding dependency 4 سال پیش
pyproject.toml 2d87b5c281 adding binding dependency 4 سال پیش

README.md

NiceGUI

We like Streamlit but find it does to much magic when it comes to state handling. In search for an alernative nice library to write simple graphical user interfaces in Python we discovered justpy. While too "low-level-html" for our daily usage it provides a great basis for "NiceGUI".

Purpose

NiceGUI is intended to be used for small scripts and user interfaces with a very limited user base. Custom "Smart-Home Control" solutions or "Robotics" for example. It's also helpful for development like tweaking/configuring a machine learning training or tuning motor controllers.

Features

  • browser-based GUI
  • shared state between multiple browser windows
  • implicit reload on code change
  • clean set of GUI elements (label, button, checkbox, switch, slider, input, ...)
  • simple grouping with rows, columns and cards
  • genral-purpose html and markdown elements
  • built-in timer to refresh data in intervals (even every 10 ms)
  • straight-forward data bindings to write even less code

Install

python3 -m pip install nicegui

Usage

Write your nice GUI in a file main.py:

from nicegui import ui

ui.label('Hello NiceGUI!')
ui.button('BUTTON', on_click=lambda: print('button was pressed'))

Launch it with:

python3 main.py

Note: The script will automatically reload the GUI if you modify your code.

Styling & Design

NiceGUI use the Quasar Framework and hence has their full design power. Each NiceGUI element provides a design property which content is passed as props the Quasar component:

ui.radio(['x', 'y', 'z'], design='inline color=green')
ui.button(icon='touch_app', design='outline round')

Have a look at the Quasar documentation for all styling "props".

API

API Reference is hosted at https://nicegui.io. Also have a look at examples.py for an extensive demonstration what you can do with NiceGUI.

Plots

To render a simple plot you create a new context and call the neccessary Matplotlib functions:

from nicegui import ui
from matplotlib import pyplot as plt
import numpy as np

with ui.plot():
    x = np.linspace(0.0, 5.0)
    y = np.cos(2 * np.pi * x) * np.exp(-x)
    plt.plot(x, y, '-')
    plt.xlabel('time (s)')
    plt.ylabel('Damped oscillation')

To update a plot in regular intervals, have look at main.py.

To simplify live updating line plots even more, NiceGUI provides ui.line_plot with useful parameters and a push method:

lines = ui.line_plot(n=2, limit=20).with_legend(['sin', 'cos'], loc='upper center', ncol=2)
ui.timer(0.1, lambda: lines.push([datetime.now()], [
    [np.sin(datetime.now().timestamp()) + 0.02 * np.random.randn()],
    [np.cos(datetime.now().timestamp()) + 0.02 * np.random.randn()],
]))