Tutorial introductorio de streamlit.

Ernesto Crespo
3 min readOct 31, 2020

--

En el artículo anterior sobre visualización de campos magnéticos con streamlit se menciona que en el siguiente artículo (este), se va a ser un tutorial de streamlit básico.

Este artículo se basa en en artículo Streamlit Python Tutorial(Crash Course) de jesse_jcharis.

El código de este artículo lo pueden revisar en el repositorio de github tutorial de streamlit.

Tutorial de Streamlit

A continuación se muestra el código que muestra cada componente de streamlit (se encuentra en el archivo app.py).

import datetime
import time
import pandas as pd
import streamlit as st
from PIL import Image
# Permite definir que la función este en cache.
@st.cache
def run_fxn(n: int) -> list:
return range(n)
def main():
"""Generación de la webapp con streamlit"""
# Definir título
st.title("Título: Tutorial de Streamlit")
# Definir Header/Subheader
st.header("Este es un header")
st.subheader("Este es un subheader")
# Definir un Texto
st.text("Texto: Hola Streamlit")
# Definición de Markdown
st.markdown("# Este es un markdown h1 \n ## Este es un h2 \n ### Este es un h3")
st.header("Colores de texto y mensajes de error")
st.success("Successful")
st.info("Información!")
st.warning("warning")
st.error("Error")
st.exception("NameError('no está definido')")
st.header("Obtener información de ayuda de Python")
st.help(range)
st.header("Widgets:")
st.subheader("Checkbox")
# Checkbox
if st.checkbox("Show/Hide"):
st.text("Mostrar u ocultar Widget")
st.subheader("Radio buttons")
# Radio Buttons
status = st.radio("Cual es su estatus", ("Activo", "Inactivo"))
if status == "Activo":
st.success("Estas activo")
else:
st.warning("Inactivo")
st.subheader("SelectBox")
# SelectBox
occupation = st.selectbox(
"Tu Ocupación", ["Programador", "Cientifico de datos", "Doctor", "Emprendedor"]
)
st.write("Opción seleccionada:", occupation)
st.subheader("MultiSelect")
# MultiSelect
location = st.multiselect(
"Donde trabajas?",
("Londres", "Nueva York", "Accra", "Kiev", "Nepal", "Buenos Aires", "Caracas"),
)
st.write("Seleccionó:", len(location), "locaciones")
st.subheader("Slider")
# Slider
level = st.slider("Cual es tu nivel?", 1, 5)
st.write("Nivel:", level)
st.subheader("Buttons")
# Buttons
if st.button("Acerca"):
st.text("Streamlit es Cool")
else:
st.text("")
st.header("Como recibir una entrada y procesarla con streamlit?")
st.subheader("Recibiendo texto")
# Recibiendo texto
firstname = st.text_input("Escriba su nombre:")
if st.button("Aceptar"):
result = firstname.title()
st.success(result)
st.subheader("Área de texto")
# Text Area
message = st.text_area("Escriba un mensaje")
if st.button("Aceptar "):
result = message.title()
st.success(result)
st.subheader("Entrada de fecha")
# Date Input
today = st.date_input("Hoy es", datetime.datetime.now())
st.text(f"{today}")
st.subheader("Entrada de tiempo")
# Time
the_time = st.time_input("La hora es:", datetime.time())
st.text(f"{the_time}")
st.header("Trabajar con archivos de imágenes, audio o vídeos")
# Images
st.subheader("Archivo de imagen")
img = Image.open("example.jpg")
st.image(img, width=300, caption="Simple Imagen")
st.subheader("Archivo de vídeo")
# Videos
vid_file = open("Streamlit Campo magnético-uRDO3trlSG8.mp4", "rb").read()
# vid_bytes = vid_file.read()
st.video(vid_file)
st.subheader("Archivo de audio")
# Audio
audio_file = open("040-data-science-year-in-review.mp3", "rb").read()
st.audio(audio_file, format="audio/mp3")
st.header("Otras opciones que permite la función write")
# Writing Text/Super Fxn
st.subheader("Texto con write")
st.write("Texto con write")
st.write(range(10))
st.header("Desplegando código puro y json")
st.subheader("Código puro")
st.code("import numpy as np")
with st.echo():
df = pd.DataFrame() st.subheader("Desplegando json")
st.text("Mostrando JSON")
st.json({"nombre": "Jhon", "apellido": "Doe", "genero": "masculino"})
st.header("Mostrar barra de progreso, spinner y balloons")
st.subheader("Barra de progreso")
my_bar = st.progress(0)
for p in range(10):
my_bar.progress(p + 1)
st.subheader("Spinner")
with st.spinner("Espere .."):
time.sleep(5)
st.success("Finalizó!")
st.subheader("Balloons")
# Balloons
st.balloons()
st.header("Trabajando con data science")
df = pd.read_csv("Venezuela.csv", index_col=0)
st.subheader("Dataframe")
st.dataframe(df)
st.subheader("tabla")
st.table(df.head())
st.subheader("gráfica")
st.line_chart((df))
# mostrar barra lateral
st.sidebar.header("Acerca")
st.sidebar.text("Tutorial de streamlit ")
st.header("Trabajando con funciones")
st.write(list(run_fxn(10)))
if __name__ == "__main__":
main()

Para correrlo se ejecuta:

streamlit run app.py

Esto abre el navegador en el url http://localhost:8501.

Se puede ver una captura de pantalla:

Se puede ver la demostración de uso desde el vídeo en youtube:

En próximo artículo se mostrará componentes de streamlit más complejos.

¡Haz tu donativo! Si te gustó el artículo puedes realizar un donativo con Bitcoin (BTC) usando la billetera digital de tu preferencia a la siguiente dirección: 17MtNybhdkA9GV3UNS6BTwPcuhjXoPrSzV

O Escaneando el código QR desde la billetera:

--

--

Ernesto Crespo
Ernesto Crespo

Written by Ernesto Crespo

Senior Python Developer, Software Architect, Big Data, Data Science, Machine Learning and Deep Learning, Debian SysAdmin, DevOps, Blogger and Freelancer.

No responses yet