Aprender Streamlit Layout y organización de la interfaz

Un layout bien estructurado es determinante para que una aplicación Streamlit sea usable y profesional. Streamlit ofrece un conjunto de componentes de layout que permiten organizar el contenido en columnas, pestañas, paneles laterales y contenedores de forma declarativa con Python puro.

Columnas: disposición horizontal

st.columns divide el espacio horizontal en columnas de igual tamaño o proporciones personalizadas:

import streamlit as st

col1, col2, col3 = st.columns(3)
with col1:
    st.metric("Ventas", "€ 12.450", "+8,3%")
with col2:
    st.metric("Clientes", "1.230", "+12")
with col3:
    st.metric("Conversión", "3,4%", "-0,2%")

# Proporciones personalizadas
col_lateral, col_principal = st.columns([1, 3])

Pestañas y expansores

tab_resumen, tab_detalle, tab_config = st.tabs(["Resumen", "Detalle", "Configuración"])
with tab_resumen:
    st.write("Vista resumida del análisis")
with tab_detalle:
    st.dataframe(df)

with st.expander("Ver parámetros avanzados", expanded=False):
    alpha = st.slider("Alpha", 0.0, 1.0, 0.05)
    n_iter = st.number_input("Iteraciones", 100, 10000, 1000)

with st.popover("Información adicional"):
    st.write("Este parámetro controla la regularización L2.")

Sidebar: panel de control lateral

with st.sidebar:
    st.title("Configuración")
    dataset = st.selectbox("Dataset", ["Iris", "Titanic", "Housing"])
    n_features = st.slider("Número de características", 2, 10, 5)
    st.divider()
    if st.button("Aplicar cambios"):
        st.rerun()

Contenedores, espacios y diálogos

# Contenedor genérico para agrupar elementos
with st.container(border=True):
    st.subheader("Panel de métricas")
    st.line_chart(df)

# Placeholder para actualización dinámica
placeholder = st.empty()
placeholder.info("Cargando datos...")
# ... más tarde:
placeholder.success("Datos cargados.")

# Espacio vertical
st.space(height=2)

# Diálogo modal
@st.dialog("Confirmar acción")
def confirmar():
    st.write("¿Estás seguro de que deseas eliminar los datos?")
    if st.button("Confirmar"):
        st.session_state["confirmado"] = True
        st.rerun()

El dominio del layout en Streamlit permite pasar de aplicaciones de columna única a dashboards multi-panel profesionales que aprovechan eficientemente el espacio de pantalla disponible.