Skip to main content

Tabs

Use the tab card to navigate between two or more distinct content categories.

You can see the API for ui.tab_card or check the interactive example in the Tour app.

Basic tabs

tabs-0

q.page['example'] = ui.tab_card(box='1 1 4 1', items=[
ui.tab(name='#menu/spam', label='Spam'),
ui.tab(name='#menu/ham', label='Ham'),
ui.tab(name='#menu/eggs', label='Eggs'),
ui.tab(name='#about', label='About'),
]
)

With a selection

tabs-1

q.page['example'] = ui.tab_card( box='1 1 4 1', value='#menu/ham', items=[
ui.tab(name='#menu/spam', label='Spam'),
ui.tab(name='#menu/ham', label='Ham'),
ui.tab(name='#menu/eggs', label='Eggs'),
ui.tab(name='#about', label='About'),
]
)

tabs-2

q.page['example'] = ui.tab_card( box='1 1 4 1', link=True, value='#about', items=[
ui.tab(name='#menu/spam', label='Spam'),
ui.tab(name='#menu/ham', label='Ham'),
ui.tab(name='#menu/eggs', label='Eggs'),
ui.tab(name='#about', label='About'),
]
)