Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

streamlit
streamlit widgets

How to use Streamlit and the implementation of its widgets

Educative Team

What is Streamlit?

Streamlit is an open source web application framework in Python. It is helpful in creating machine learning web applications in a given mean time. It is compatible with many Python libraries, namely:

  • Keras
  • Scikit-learn
  • PyCaret
  • Matplotlib
  • Pandas
  • Numpy

The command used to run a Streamlit web application is as follows:

streamlit run <yourscript.py>

Streamlit also has a cloud, where we can deploy our machine learning web applications. Anyone can access our application with the provided link.

Streamlit widgets

There are many widgets available in Streamlit that we can use to develop web applications. We will discuss some of these below.

Note: Streamlit encounters some issues when it is run with the Safari browser. So, we recommend the use of Google Chrome or Firefox.

Slider

import streamlit as stream
value = stream.slider('val')
stream.write(value, 'cube is', value * value * value)

Code explanation

  • Line 1: We import streamlit.
  • Line 2: We use the slider() function, and we assign the value of the slider to the variable value.
  • Line 3: We print the value and its cube, which we select from the slider.

Dataframe table

import pandas as pd
import streamlit as stream

stream.title("Welcome!")

stream.write("Our first DataFrame is")

stream.write(
  pd.DataFrame({
      'Ali': [99, 87, 66, 54],
      'Usman': [55, 96, 77, 98]
    })
)

Code explanation

  • Lines 1–2: We import pandas and streamlit.

  • Line 4: We set the title of our Streamlit web application using the title() method.

  • Lines 8–13: We use the pandas Dataframe() function, along with the Streamlit write() function, to display the dataframe in a table.

Selectbox

import streamlit as stream

stream.title("Welcome!")

select = stream.selectbox(
    "Select Developer or Engineer",
    ["Developer", "Engineer"]
)
stream.write(f"You selected {select}")

Code explanation

  • Line 1: We import streamlit.

  • Line 3: We set the title of our Streamlit web application using the title() method.

  • Lines 5–8: We use the selectbox() function. The first argument that we pass to the function is a string to display and the second argument is a list of options to select from.

  • Line 9: We display the selected value using the write() function.

Checkbox

import streamlit as stream
stream.title("Select your skills!")
checkbox = stream.checkbox("C++")

if checkbox:
    val = "C++"
else:
    val = "No value selected"

stream.write(f"You selected: {val}")

Code explanation

  • Line 1: We import streamlit.

  • Line 2: We set the title of our Streamlit web application using the title() method.

  • Lines 3: We create a variable called checkbox that contains a boolean value.

  • Lines 5–8: We write conditions for the values that we selected from the checkbox.

  • Line 10: We display the selected value using the write() function.

Radio button

import streamlit as stream
select = stream.radio(
     "What's your favorite IT job",
     ('Developer', 'Designer', 'Engineer'))

if select == 'Developer':
     stream.write('You selected Developer.')
else:
     stream.write("You didn't select Developer.")

Code explanation

  • Line 1: We import streamlit.

  • Lines 2–4: We use the radio() function. The first argument that we pass to this function is a string to display and the second argument is a list of options to select from.

  • Lines 6-9: We use conditions to display the value that is selected from the checkbox.

Sidebar

import streamlit as stream

stream.title("Welcome!")

selectbox = stream.sidebar.selectbox(
    "Select Male or Female",
    ["Male", "Female"]
)
stream.write(f"You selected {selectbox}")

Code explanation

  • Line 1: We import streamlit.

  • Line 3: We set the title of our Streamlit web application using the title() method.

  • Lines 5–8: We use the sidebar.selectbox() function. The first argument that we pass to the function is a string to display and the second argument is a list of options to select from.

  • Line 9: We display the value that is selected from the sidebar selectbox.

Color picker

import streamlit as stream
color = stream.color_picker('Choose any Color from dialog', '#00f900')
stream.write('The current selected color is', color)

Code explanation

  • Line 1: We import streamlit.
  • Line 2: We use the color_picker() function to choose the color from the colors dialogue box.
  • Line 3: We print the selected color value.

RELATED TAGS

streamlit
streamlit widgets
Copyright ©2022 Educative, Inc. All rights reserved
RELATED COURSES

View all Courses

Keep Exploring