Introducing PyWebIO: Build Browser‑Based GUI Applications with Python

When we first learn to program, we interact with the terminal using functions such as input() , scanf() , and print . Web development, however, requires additional front‑end code, state handling via sessions or hidden inputs, and polling to simulate real‑time output.

PyWebIO removes these hurdles by allowing developers to write web applications the same way they write terminal scripts, without needing HTML or JavaScript knowledge. It provides a set of imperative interaction functions that turn the browser into a rich text terminal, while also offering layout, event binding, and other conveniences.

Installation

<code>pip3 install -U pywebio</code>

Hello, World – BMI Calculator

The following script demonstrates a simple BMI calculator built with PyWebIO:

<code>from pywebio.input import input, FLOAT
from pywebio.output import put_text

def bmi(height, weight):
    bmi_value = weight / (height / 100) ** 2
    top_status = [
        (14.9, '极瘦'), (18.4, '偏瘦'), (22.9, '正常'),
        (27.5, '过重'), (40.0, '肥胖'), (float('inf'), '非常肥胖')
    ]
    for top, status in top_status:
        if bmi_value <= top:
            return bmi_value, status

def main():
    height = input("请输入你的身高(cm)：", type=FLOAT)
    weight = input("请输入你的体重(kg)：", type=FLOAT)
    bmi_value, status = bmi(height, weight)
    put_text('你的 BMI 值: %.1f，身体状态：%s' % (bmi_value, status))

if __name__ == '__main__':
    main()
</code>

Running this script opens a browser window where users can input their height and weight and receive the calculated BMI and health status.

To serve the application as a web service, replace the final call with pywebio.start_server(bmi, port=80) , which launches the BMI calculator on port 80 and can be integrated into existing web projects.

Basic Usage

PyWebIO offers many input functions (e.g., input() , select() , checkbox() , radio() , textarea() , file_upload() ) that block until the user submits a form, as well as output functions (e.g., put_text() , put_table() , put_image() , put_markdown() , toast() , put_file() , put_html() , popup() , put_buttons() , put_row() , put_processbar() ) that render content instantly in the browser.

Examples of input functions:

<code>from pywebio.input import *
# Text input
input("What's your name?")
# Dropdown selection
select('Select', ['A', 'B'])
# Multiple choice
checkbox('Checkbox', options=['Check me'])
# Radio buttons
radio('Radio', options=['A', 'B', 'C'])
# Multi‑line text
textarea('Text', placeholder='Some text')
# File upload
file_upload('Select a file:')
# Code editor
textarea('Code Edit', code={'mode':'python','theme':'darcula'}, value='import ...')
# Input group
input_group('Basic info', [input('Name', name='name'), input('Age', name='age')])
# Input validation
def check(p):
    if p != 2:
        return 'Wrong!'
input('1+1=?', type=NUMBER, validate=check)
</code>

Examples of output functions:

<code>from pywebio.output import *
# Text output
put_text('Hello world!')
# Table output
put_table([
    ['Product', 'Price'],
    ['Apple', '$5.5'],
    ['Banner', '$7']
])
# Image output
put_image(open('python-logo.png','rb').read())
# Markdown output
put_markdown('**Bold text**')
# Toast notification
toast('Awesome PyWebIO!!')
# File download
put_file('hello_word.txt', b'hello word!')
# HTML output
put_html('E = mc<sup>2</sup>')
# Popup window
with popup('Popup title'):
    put_text('Hello world!')
    put_table([
        ['Product', 'Price'],
        ['Apple', '$5.5'],
        ['Banner', '$7']
    ])
# Buttons with click handler
def on_click(btn):
    put_markdown('You click `%s` button' % btn)
put_buttons(['A','B','C'], onclick=on_click)
# Row layout
put_row([put_code('A'), None, put_code('B')])
# Progress bar
import time
put_processbar('bar1')
for i in range(1,11):
    set_processbar('bar1', i/10)
    time.sleep(0.1)
</code>

Beyond input and output, PyWebIO also supports layout management, coroutine integration, and data visualization using third‑party libraries, enabling developers to create sophisticated, interactive web applications with minimal code.