1 2 Tabs Explained

Key Concepts

• Tabs: A UI element that allows users to switch between different sections of content within the same page.
• st.tabs: A Streamlit function to create and manage tabs in your application.
• Tab Content: The content displayed within each tab.
• Tab Navigation: The process of switching between tabs.

Explanation

1. Tabs

Tabs are a common UI element used to organize content into separate sections. Each tab represents a different section, and users can switch between these sections by clicking on the corresponding tab.

2. st.tabs

st.tabs is a Streamlit function that allows you to create and manage tabs in your application. This function takes a list of tab names and returns a list of tab objects that you can use to display content.

3. Tab Content

Tab content refers to the information or elements displayed within each tab. This can include text, charts, images, or any other Streamlit components. The content of each tab is defined using the tab objects returned by st.tabs.

4. Tab Navigation

Tab navigation is the process of switching between different tabs. In Streamlit, users can navigate between tabs by clicking on the tab headers. The content of the selected tab is displayed, while the content of other tabs is hidden.

Examples

Example 1: Basic Tabs

import streamlit as st

tabs = st.tabs(["Tab 1", "Tab 2", "Tab 3"])

with tabs[0]:
    st.write("This is content for Tab 1.")

with tabs[1]:
    st.write("This is content for Tab 2.")

with tabs[2]:
    st.write("This is content for Tab 3.")
    

Example 2: Tabs with Different Content

import streamlit as st

tabs = st.tabs(["Home", "About", "Contact"])

with tabs[0]:
    st.write("Welcome to the Home page.")

with tabs[1]:
    st.write("Learn more about us on the About page.")

with tabs[2]:
    st.write("Contact us using the information on the Contact page.")
    

Analogies

Think of tabs as folders in a filing cabinet. Each folder contains different documents, and you can switch between folders to access different sets of documents. Similarly, tabs in Streamlit allow you to switch between different sections of content within the same application.

By mastering the use of tabs in Streamlit, you can create organized and user-friendly applications that make it easy for users to navigate and find the information they need.