Hide/collapse/fold a section

[drorata]

Is it possible to fold a section and all its nested sections, items, plots etc.?

[Marc]

Sort of. You can use a st.checkbox. If it’s checked you run the code otherwise not.

[drorata]

This approach I already used, but I was wondering whether there’s something more canonical.

[nthmost]

At the moment I’d say @Marc’s comment reflects the state of Streamlit as a whole: You can use widgets to trigger running one section of code, which means you could potentially use a multiselect or even a slider, theoretically speaking.

At the moment we don’t have anything that fully speaks to the idea of controls that hide/show particular widgets.

I’ve made a feature request for show/hide controls here.

[stdevRulo]

Think that situation:
I want to have a c++ editable code, but code components are not editable, then I add a button edit to put the code into a text_area to edit it, I dont want to show both components at the same time.

Today I lost a lot of time trying to do that, but I think that if streamlit had a hide/show property that situacion wil became easy to implement.

[godot63]

I find it tricky in Streamlit to work with buttons if clicking on them should trigger something that is reflected in the GUI afterwards. I came up with the following example using radio buttons and the SessionState module that should come close to what you are trying to do. You will find SessionState module here, in case you don’t have it: https://gist.github.com/tvst/036da038ab3e999a64497f42de966a92
Hope that helps.

import streamlit as st
import SessionState

session = SessionState.get(code='some c++ code')
a = st.radio("Edit or show", ['Edit', 'Show'], 1)
if a == 'Edit':
    session.code = st.text_input('Edit code', session.code)
else:
    st.write(session.code)

[stdevRulo]

@godot63 thank you, I like your solution, it is the exactly behaivior that I need.
I am amazed at the simplicity of SessionState implementation, so easy to understand and modify. I think that the idea diserve a star.

A lot of thanks.

[stdevRulo]

I found another way to solve my situation, using streamlit.empty as a hideable object.

import streamlit as st

code = read()
edit = st.checkbox("Edit")
ph = st.empty()
code = ph.text_area("Your code here 👇", code)
if not edit:
    ph.empty()
    save(code)
    st.code(code, "c++")

read and save are methods to read and write a file where the code is being persisted.
If I do not add the persistence I lose the information when unchecking the checkbox

[godot63]

hi @stdevRulo, I think this is a very good solution as well. I had something similar in mind too but then thought that you might want to have the user choose if he wants to save the text. Maybe you combine the session state solution and add a save button which then saves the code interactively, using your save function?

[lucasrla]

I really wanted the ability to collapse and expand content. Thank you for implementing it!

[horiz-layout] Add collapsible_container

I was playing with the nightly release and I got two suggestions about the feature as it is implemented today. Not sure if I should comment on GitHub – anyway, here it goes:

1. Although the cursor changes to pointer when hovering anywhere across the entire collapsible_container, the toggle only works after clicking specifically on Show/Hide. It seems desirable to have it toggle after a click anywhere on the container.

2. I would love to have the ability to collapse/expand under either a st.header or a st.subheader. Right now the collapsible_container seems to take only “normal” text as label.

Thanks!

[karriebear]

@lucasrla

• Although the cursor changes to pointer when hovering anywhere across the entire collapsible_container , the toggle only works after clicking specifically on Show/Hide. It seems desirable to have it toggle after a click anywhere on the container.
• I would love to have the ability to collapse/expand under either a st.header or a st.subheader . Right now the collapsible_container seems to take only “normal” text as label.

Thanks for the feedback @lucasrla! Both of these sounds like great ideas. Unfortunately it will unlikely make it into the upcoming release but it’s something we’ll add to our backlog!

Check out our github if you’d like to follow along for updates.
Make expander header container togglable
Make expander header formatting configurable

As always, if there’s something you’d like to see, feel free to create a feature request in Github We love seeing requests from the community!

[StefanBrand]

We now have this functionality with st.beta_expander() available as of 0.68.0

Source: Add controls to Show/Hide individual sections or widgets · Issue #958 · streamlit/streamlit · GitHub