How can i integrate multiple pages using top navigation bar

Using Streamlit
2

At present, Streamlit lacks a top navigation bar. However, you could explore a community-created custom component to achieve this functionality.

To install it, run:

pip install streamlit-navigation-bar

Below is an example of how you could use it in your Streamlit app with multiple file pages:

# pages/page_1.py

import streamlit as st

def show_page_1():
    st.title("Page 1")
    st.write("This is page 1")

# pages/page_2.py

import streamlit as st

def show_page_2():
    st.title("Page 2")
    st.write("This is page 2")

# app.py

import streamlit as st
from streamlit_navigation_bar import st_navbar

import pages as pg

st.set_page_config(initial_sidebar_state="collapsed")

pages = ['page1', 'page2']

options = {
    "show_menu": False,
    "show_sidebar": False,
}

page = st_navbar(
    pages,
    options=options,
)

functions = {
    'page1': pg.page_1.show_page_1,
    'page2': pg.page_2.show_page_2,
}
go_to = functions.get(page)
if go_to:
    go_to()
1 Like