Search code examples
pythonjupyter-notebookipython

Scrollable VBox with buttons ipythonwidgets


I am trying to create a scrollable VBox filled with a list of Buttons. However I've tried to no avail.

import ipywidgets as ipw

import ipywidgets as widgets
from IPython.display import display


vbox = widgets.VBox(layout=widgets.Layout(height='100px', overflow_y='scroll'))


num_buttons = 20
button_list = [widgets.Button(description=f'Button {i+1}') for i in range(num_buttons)]

for button in button_list:
    vbox.children += (button,)


display(vbox)

result of code

I set the overflow_y='scroll' and also used the 'auto' command instead of making the VBox scrollable its simply "squishes" my buttons


Solution

  • It seems it automatically resizes all widgets to fit them inside VBox
    and Button needs min_height to keep some size.

    (It doesn't work for height)

    widgets.Button(
        description=f'Button {i+1}', 
        layout=widgets.Layout(min_height='30px')
    )
    

    Full working code:

    import ipywidgets as widgets
    from IPython.display import display
    
    vbox = widgets.VBox(layout=widgets.Layout(height='100px', overflow_y='scroll'))
    
    num_buttons = 20
    
    button_list = [
        widgets.Button(description=f'Button {i+1}', layout=widgets.Layout(min_height='30px'))
        for i in range(num_buttons)
    ]
    
    vbox.children += tuple(button_list)
    
    display(vbox)
    

    Chrome

    enter image description here

    Firefox

    enter image description here