Status elements in Streamlit

In this article, we will talk about different status and progress elements available in Streamlit using Python.

Let’s see some different status and progress elements within Streamlite-

Progress Bars

Firstly we will see how we can add a progress bar to our Streamlit web app. Streamlit comes with a method known as progress() using which we can easily add a progress bar in our webapp.

Syntax: streamlit.progress(value)

value = it can be either float or int. If it is int then it ranges between 0 to 100, if float then 0.0 to 1.0 (both inclusive)

Example

Here firstly we are importing a CSV file using pandas, then using the multiselect method of sidebar class of Streamlit module. In the drop down we will see different columns of the dataframe we have imported. Then using a variable named prg in which we are initializing the progress bar from 0. Then run a for loop till 100 and pass the sleep method to show the progress a little slowly, then increase the value by 1 of the progress bar after 0.1 seconds. Then after the completion, we will just print our dataframe.

Python3

import streamlit as st
import pandas as pd
import time

df = pd.read_csv("iris.csv")

col = st.sidebar.multiselect("Select any column",
                             df.columns)

prg = st.progress(0)

for i in range(100):
    time.sleep(0.1)
    prg.progress(i+1)
st.dataframe(df[col])

Output:

Streamlit spinner

This adds a simple spinner in our web app, it is like the spinning version of the progress bar, and after completion of spinning it displays a message if prompted.

Syntax: st.spinner(text)

text : This is a string which should be shown till the spinner completes spinning.

Example 

Using the spinner() method of streamlit class we will show a spinner loading animation and as the parameter, we will pass a text. It can only be a string, we can’t pass any number. Also, we are passing the sleep method with a 1-second delay to show the animation properly. After completion, we will add a success message as ‘Done’. After that, we will print the dataframe.

Python3

import streamlit as st
import pandas as pd
import time

df = pd.read_csv("iris.csv")

col = st.sidebar.multiselect("Select any column",
                             df.columns)

with st.spinner("Just a moment ..."):
    time.sleep(1)
st.success('Done!')
st.dataframe(df[col])

Output:

Balloons celebration

We can also add the balloon celebration animation on our webapp. Using the inbuilt balloons() method we can add a simple balloons celebration animation in our webapp.

Python3

import streamlit as st
import pandas as pd

df = pd.read_csv("iris.csv")

col = st.sidebar.multiselect("Select any column",
                             df.columns)

st.balloons()

Output:

Falling Snow

We can also add the falling snow animation. Using the snow() method we can add falling snow animation in our webapp.

Python3

import streamlit as st
import pandas as pd

df = pd.read_csv("iris.csv")

col = st.sidebar.multiselect("Select any column",
                             df.columns)

st.snow()

Output:

Another way of adding snowflake rain animation using a method available in streamlit-extras library.

Python3

import streamlit as st
import pandas as pd
import time
from streamlit_extras.let_it_rain import rain



df = pd.read_csv("iris.csv")

col = st.sidebar.selectbox("Select any column", df.columns)


col = st.sidebar.multiselect("Select any column", df.columns)

prg = st.progress(0)

for i in range(100):
    time.sleep(0.001)
    prg.progress(i+1)

# Raining Snowflake.

rain(
    emoji="❄️",

      # the size of each snowflake
    font_size=20,
    # speed of raining
    falling_speed=3,


    # for how much time it will fall
    animation_length="infinite",
)

Output: