Jupyter notebook最简原型界面设计 - ipywidgets与lineup_widget

Tkinter的GUI设计 和 django页面设计，那么笔者只是想快速做个demo原型，以上的内容能不能结合着来，有一些简单的交互 + web可以快速访问的到，于是就看到了jupyter notebook这两个库，非常简单的玩具，来看看呗~
ipywidgets比较强调输入项的各式花样，但是其对输出内容的格式的花样非常少。

---

---

文档：https://ipywidgets.readthedocs.io/en/stable/index.html
github：https://github.com/jupyter-widgets/ipywidgets

安装：

来看一些组件与模块。

主要参考：Widget List

1.1.1 button 按钮

1.1.2 IntSlider、FloatSlider

1.1.3 FloatProgress / IntProgress

1.1.4 Text、Textarea

1.1.5 图片Image

代表交互，第一个代表函数，与都代表f函数的参数。

• segx代表滑条
• opt = True/False代表选项框

注意，相当于给函数赋值，除了第一个，之后的参数都是第一个函数的参数，名字需对齐。

可以把两个组件独立的链接在一起，而不是如交互影响。

1.8.1 图形 + 滑块

第二个案例：
来着：Mastering widgets in the Jupyter Notebook

1.8.2 一个可控的进度读条

1.8.3 颜色筛选器

1.8.4 复杂输入框

统一的Box布局，
Dropdown是下拉框，一个Box是一个独立组件。
form_items是多个Box的组合，Box( [Label(),Textarea()] , layout ) => Box( [前缀名,控件函数] , 布局 )

.

---

github：https://github.com/datavisyn/lineup_widget

这是一个专门为展示dataframe + ipywidgets而来的包。

参考：Jupyter Widget

w = lineup_widget.LineUpWidget(df, options=dict(rowHeight=20))

其中options之中有非常多的参数，由于文档也没具体说明，笔者这边只对几个参数有了解。
其中：代表侧边的面板是否打开，笔者觉得很碍人，一般是

案例一：

非常简单，唯一需要整理的就是df，一个DataFrame的格式作为输入，其他不用调整任何东西，就可以使用了。

案例二：

如下图，里面的内容就是可以单独对df这个数据框进行筛选，用display展示出来。

参考于：Authoring Custom Jupyter Widgets

This custom d3-slider widget wraps a simple custom slider based on the fantastic d3.js library. You can run and try it on the Binder repo or watch it on nbviewer.

This all drawing pad app, is inspired from this codepen. You can run and try it on the Binder repo or watch it on nbviewer.

The ipypivot widget, wraps the convenient PivotTable.js library. You can run and try it on the binder repo or watch it on nbviewer.