Why progress bar inside a tab is not updating?

[Ragesh]

I need to show progress bar per tabs independently in my Streamlit app.

I tried a demo code which updates the first tab’s progress bar, but it’s not working.

import streamlit as st
import time

def download_all_images():
    for i in range(100):
        print(f"value {i}")
        st.session_state.progress1 = i
        time.sleep(1)

def main():
    st.title("Image Viewer with Progress Bars")
    st.session_state.progress1,st.session_state.progress2,st.session_state.progress3 = 1,1,1
    if st.button("Generate"):
        download_all_images()
    # Create tabs
    tab1, tab2, tab3 = st.tabs(["Image 1", "Image 2", "Image 3"])
    # Display content in each tab
    with tab1:
        st.progress(st.session_state.progress1)
    with tab2:
        st.progress(st.session_state.progress2)
    with tab3:
        st.progress(st.session_state.progress3)
if __name__ == "__main__":
    main()

After clicking generate button, it looks like this:

That is, it looks like a disabled screen and progress bar is not moving. But the log “value {i}” prints correctly means it’s updating the status.

I am new to streamlit. please assist me.

[edsaac]

You need to call the progress method to update the bar value (st.progress - Streamlit Docs). Something like:

with tab1:
    bar = st.progress(0)  # <-- Bar starts at zero
    if st.button("Press to load"):
        for i in range(101):
            bar.progress(i)  # <-- Updates bar

Having a single button to trigger all progress bars will not make them run at the same time. In your example, the bar in tab2 won’t start until the bar in tab1 is finished.

[Ragesh]

@edsaac

bar = st.progress(0)  # <-- Bar starts at zero
    if st.button("Press to load"):
        for i in range(101):
            bar.progress(i)

Your code works @edsaac . But I need to update it from external function.

My goal is, I am creating an Image Generation app that supports multi models and each model has a separate tab for it’s respective image.

The models are executed sequentially, so when a model image , say SDXL model is being generated , the SDXL tab need to show a progress bar, meanwhile the completed tabs need to show the image.

[edsaac]

You could pass the DeltaGenerator object that st.progress returns to the function in charge of updating it, something like:

import streamlit as st
import time


def move_progress_bar(bar):
    for i in range(1, 101):
        bar.progress(i, text=f"Step {i}/100")
        time.sleep(0.1)

    st.write("Done!")


def main():
    st.title("Image Viewer with Progress Bars")

    tab1, tab2, tab3 = st.tabs(["Image 1", "Image 2", "Image 3"])

    with tab1:
        button_1 = st.button("Run bar 1")
        bar_in_tab_1 = st.progress(0, text="Bar in tab 1")

        if button_1:
            move_progress_bar(bar_in_tab_1)

    with tab2:
        button_2 = st.button("Run bar 2")
        bar_in_tab_2 = st.progress(0, text="Bar in tab 2")

        if button_2:
            move_progress_bar(bar_in_tab_2)

    with tab3:
        ...


if __name__ == "__main__":
    main()

[Ragesh]

@edsaac

this seems better. But if I run two tabs’ progress bars at same time, another one freezes and disabled.

Like this:

Why this happens ?