pywidget 组件用法总结

492 阅读1分钟
from ipywidgets import widgets
from ipywidgets import interact, interactive, fixed, interact_manual
from ipywidgets import FloatSlider
import numpy as np
import io
import pandas as pd
# 1. 上传数据、加载数据
file = widgets.FileUpload()
file

image.png

FileUpload(value=(), description='Upload')
data = pd.read_csv(io.BytesIO(file.value[0].content))
data.shape
# 2. 选择时间、返回时间
select_time = widgets.NaiveDatetimePicker(description='Pick a Time')
box = widgets.VBox([select_time])
display(widgets.HBox([box]))

image.png

print(select_time.value)
# 3. 滑块、返回数字
num = widgets.FloatSlider(    # 可选  IntRangeSlider、FloatLogSlider、IntSlider 
            value=7.5,
            min=0,
            max=10.0,
            step=0.1,
            description='Test:',
            disabled=False,
            continuous_update=False,
            orientation='horizontal',   # 可选 'vertical'
            readout=True,
            readout_format='.1f',
        )
num

image.png

print(num.value)
# 4. 进度条
val = widgets.IntProgress(
                value=3,
                min=0,
                max=10,
                description='Loading:',
                bar_style='', # 'success', 'info', 'warning', 'danger' or ''
                style={'bar_color': 'maroon'},  # 可选 '#ffff00'
                orientation='horizontal'
            )
val

image.png

print(val.value)
# 5. 数字输入 
n = widgets.BoundedFloatText(   # 可选 BoundedIntText、IntText、FloatText
                value=7.5,
                min=0,
                max=10.0,
                step=0.1,
                description='Text:',
                disabled=False
            )
n

image.png

print(n.value)
# 6. 下拉框选择
char = widgets.Dropdown(
                options=[('One', 1), ('Two', 2), ('Three', 3)],  # ['1','2','3']
                value=3,    # '2'    # 默认位置
                description='Number:',
                disabled=False,
            )
char

image.png

print(char.value)
# 7. 选择模式
f = widgets.ToggleButtons(
    options=['Slow', 'Regular', 'Fast'],
    description='模式:',
    disabled=False,
    button_style='info', # 'success', 'info', 'warning', 'danger' or ''
    tooltips=['Description of slow', 'Description of regular', 'Description of fast'],
#     icons=['check'] * 3
)
f

image.png

print(f.value)
# 8. 输出文字
text = widgets.Textarea(      # 可选 Text
            value='Hello World',
            placeholder='Type something',
            description='String:',
            disabled=False   
        )
text

image.png

print(text.value)
# 9. 输入密码
password = widgets.Password(
                value='password',
                placeholder='Enter password',
                description='Password:',
                disabled=False
            )
password

image.png

print(password.value)

实时交互 interact

def f1(a):
    display(a)
a = widgets.IntSlider(value=5, min=0, max=10)  
out1 = widgets.interactive_output(f1, {'a': a})
display(a)
display(out1)

image.png

value = int(list(out1.outputs[0]['data'].values())[0])
print(value, "\n", type(value))
# 10. 输入输出交互
def f(x):
    return x * 2
func = interact(f, x=2)

image.png

# 函数和slider的深度交互 滑动输出交互
def slow_function(i):
    print(int(i))
    return
slow = interactive(
    slow_function, 
#     {'manual': True},     # 是否需要点击,还是自动变化
    i=widgets.FloatSlider(min=1e4, max=1e6, step=1e4, continuous_update=True), 
)
slow

image.png

# 11. 图像交互
def f(m, b):
    plt.figure(figsize=(12, 5))
    x = np.linspace(-m, m, num=1000)
    y = np.sin(x)*3.5 + b
    plt.plot(x, y)
    plt.ylim(-5, 5)
    plt.show()

interactive_plot = interactive(f, m=(-100, 100), b=(-1.2, 1.2))
output = interactive_plot.children[-1]
output.layout.height = '350px'
interactive_plot

image.png