Streamlit is an amazing technology that turns python scripts into shareable web apps in minutes. Streamlit enables developers to easily create beautiful web apps that can create great experiences for the users.
Let us learn about a few of the layout-style tips on Organizing the Streamlit application to make streamlit apps look even more visually appealing to the users.
Streamlit now supports side-by-side columns where we can insert any Streamlit elements.
streamlit.columns()method is used to create columns in the streamlit application.
We can put columns anywhere in our app. We have to just declare each column as a new variable and then we can add any element or components from the streamlit library in the column.
streamlit.columns()takes an integer value as a parameter. The integer value specifies the number of columns to be created.
import streamlit as st from PIL import Image img = Image.open("file_name") col_one, col_two = st.columns(2) #Creating two columns col_one.header("Column 1") col_one.image(img) col_two.header("Column 2") col_two.image(img)
Columns created by the
st.columns() – method are responsive, that is the size of the columns changes with the width of the device in which the streamlit application has been opened.
We can create as many columns as we want. In fact, by calling
st.columns() inside a loop, we can get a grid layout!
import streamlit as st from PIL import Image img = Image.open("file_name") st.write("Grid Layout") for _ in range(5): cols = st.columns(4) cols.image(img) cols.image(img) cols.image(img) cols.image(img)
Spaced Out Elements
We can also Space out the elements in columns. That is we can mention the width of elements respective to the total width available.
streamlit.columns()also takes tuple data type as input mentioning the respective width.
st.write("Spaced Out elements") for _ in range(2): cols = st.columns((2, 1, 1)) cols.image(img) cols.image(img) cols.image(img)