Page Collapse, initial_sidebar_state

🎈 Using Streamlit
1

I have a streamlit app with two pages. How could I make both of my pages’ sidebar collasped at first after clicking into?

I tried initial_sidebar_state=‘collapsed’ on both page. However it seems only the first one is collapsed, and when I moved to page 2, the sidebar for page 2 is expanded.

First page setting:

st.set_page_config(
    page_title='page1',
    page_icon='📋',
    layout='wide',
    initial_sidebar_state='collapsed'
)

Second page setting:

st.set_page_config(
    page_title='page2',
    page_icon='📋',
    layout='wide',
    initial_sidebar_state='collapsed'
)

I wonder how could I solve this problem.

Thanks.

2

Hi @Jenny, is this what you are looking for?

import streamlit as st

if 'sbstate' not in st.session_state:
    st.session_state.sbstate = 'collapsed'

def Page01():
    st.set_page_config(page_title='page1', page_icon='📋', layout='wide', initial_sidebar_state=st.session_state.sbstate)
    st.subheader('Page01')
    st.sidebar.write("I am in the sidebar pg01")
    if st.button("Return to Main Page"):
        st.session_state.runpage = Page_Main
        st.experimental_rerun()

def Page02():
    st.set_page_config(page_title='page2', page_icon='📋', layout='wide', initial_sidebar_state=st.session_state.sbstate)
    st.subheader('Page02')
    st.sidebar.write("I am in the sidebar pg02")
    if st.button("Return to Main Page"):
        st.session_state.runpage = Page_Main
        st.experimental_rerun()

def Page_Main():
    st.set_page_config(layout='wide', initial_sidebar_state=st.session_state.sbstate)
    st.subheader('Main Page')

    sc1, sc2 = st.columns(2)
    if sc1.button("Goto Page1"):
        st.session_state.runpage = Page01
        st.experimental_rerun()

    if sc2.button("Goto Page2"):
        st.session_state.runpage = Page02
        st.experimental_rerun()

if 'runpage' not in st.session_state:
    st.session_state.runpage = Page_Main
st.session_state.runpage()

Cheers

1 Like
3

Hi @Shawn_Pereira , thanks for your code. However I want the user to be able to switch page and have the page set as collapsed when they click on the default streamlit’s side bar settings instead of defining two buttons to achieve it. Materials under my page are also stored in two seperate python files as 1_page01.py, 2_page02.py as suggest from streamlit website instead of in two functions. Is there any possibility we do it that way?

Thanks.

4

Hi @Jenny,

  1. I currently write application pages with functions only - I haven’t tried the page option because I have complete flexibility with functions. Maybe someone who is using something like st.pages can comment.
  2. Maybe you can use a similar logic to get your application running

Cheers

5

Hi @Shawn_Pereira ,
I think your code also fails if I move the button(‘Return to main page’) for both pages in to st.sidebar.button.(So page 1 changes to collapsed, and when you go back to the main page, it goes to ‘expanded’ again). Do you know why this happend or how to fix it?

//For both page1 and 2,
def Page01():
    st.set_page_config(page_title='page1', page_icon='📋', layout='wide', initial_sidebar_state=st.session_state.sbstate)
    st.subheader('Page01')
    st.sidebar.write("I am in the sidebar pg02")
    if st.sidebar.button("Return to Main Page"):
        st.session_state.runpage = Page_Main
        st.experimental_rerun()

Thanks.

6

Hi @Jenny, please check your sidebar state. I don’t think you can output to the sidebar if it is collapsed.

Read the docs on session state and debug your variable values.

Cheers

7

Hi @Shawn_Pereira,

I don’t need the user to switch pages or see text messages on the side bar when the side bar is collapsed. The page switch and any text display should only be done when the side bar is opened. And when they jump to a new page, the side bar is closed by default. All my sbstate is set to ‘collapsed’ as I tested when a new page opens, however, the side bar still shows up as expanded.

8

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.