自动调整IPython小部件布局
我正在使用创建一个交互式jupyter笔记本,并希望用户从一定数量的复选框中进行选择。我使用下面的代码来可视化包含复选框的自动调整IPython小部件布局,python,ipython,jupyter,jupyter-notebook,ipywidgets,Python,Ipython,Jupyter,Jupyter Notebook,Ipywidgets,我正在使用创建一个交互式jupyter笔记本,并希望用户从一定数量的复选框中进行选择。我使用下面的代码来可视化包含复选框的 num_checks = 10 cb_cont = widgets.HBox(background_color='red',height='100px',width='100%') checkboxes = [] for f in range(num_checks): checkboxes.append(\ widgets.Checkbox(de
num_checks = 10
cb_cont = widgets.HBox(background_color='red',height='100px',width='100%')
checkboxes = []
for f in range(num_checks):
checkboxes.append(\
widgets.Checkbox(description = 'Checkbox [%d]'%(f), \
value=False, width=50))
cb_cont.children=[i for i in checkboxes]
display(cb_cont)
以下是上述代码输出的屏幕截图:
如您所见,框中的内容溢出并超出容器的宽度
我可以通过将overflow_x属性设置为以下属性之一来更改行为:[“可见”、“隐藏”、“滚动”、“自动”、“初始”、“继承”和]
例如,cb_cont.overflow_x='scroll'将在以下输出窗口中显示:
其中的内容不会溢出,但会变得不可见,并且可以滚动
如何设置框的属性以可视化不适合换行符的内容
显然,我可以使用多个HBox对象,每个对象都包含适合窗口大小的最大数量的复选框,但是这不是所需的解决方案,原因如下:
根据屏幕分辨率,该数字可能会发生变化。
要从中选择的复选框的数量取决于以前的计算,并且事先不知道它。
您可以使用宽度和高度的百分比:
cb_cont = widgets.HBox(background_color='red',height='100px',width='100%')
设置cb_cont.overflow_x='auto'我对小部件也有同样的问题,在玩弄了各种盒子属性之后,我想到了以下几点: 您需要设置以下属性: 显示:“内联flex” flex_流程:“行换行” 这对我来说非常有效,我尝试了多达100个复选框。另一方面,设置height属性不是很有用。您需要根据复选框的数量或屏幕分辨率调整高度
import ipywidgets as widgets
from ipywidgets import *
from IPython.display import display
num_checks = 50
cb_cont = HBox(layout=Layout(width='100%',display='inline-flex',flex_flow='row wrap'))
#cb_cont.overflow_x = 'scroll'
checkboxes = []
for f in range(num_checks):
checkboxes.append(\
widgets.Checkbox(description = 'Checkbox [%d]'%(f), \
value=False, width=50))
cb_cont.children=[i for i in checkboxes]
display(cb_cont)
我已经使用flex\u flow和flex\u wrap属性有一段时间了,当项目是下拉元素时,我无法让框包装项目。它只适用于按钮等其他元素。你的回答很有效,很准确!谢谢