Python 应用开发:Streamlit 布局篇(容器布局)

Streamlit 是一个非常流行的 Python 库,可以让我们以简单的方式创建交互式的 Web 应用程序。它特别适合数据科学家和机器学习工程师,用来展示模型和数据分析成果。在 Streamlit 中,布局是一个非常重要的部分,好的布局可以使应用看起来更整洁,更易于用户理解与使用。

Streamlit的布局结构

Streamlit 提供了多种方式来组织和布局我们的应用,最基本的是使用列和容器。通过这些布局组件,我们可以将不同的元素组织在一起,以形成清晰的界面。

1. 创建基本的容器

Streamlit 提供了几种容器对象,例如 st.container()st.sidebarst.expander() 等。首先,我们来看看如何简单创建一个容器。

import streamlit as st

# 创建一个基本的 Streamlit 页面
st.title("Streamlit 容器布局示例")

# 创建一个容器
with st.container():
    st.header("这是一个容器标题")
    st.write("容器内可以放置多个组件,例如文本、表格或图像。")

    # 添加文本
    st.text("这里是一些静态文本。")

    # 添加一个输入框
    user_input = st.text_input("请输入一些内容:")

    # 显示用户输入
    st.write(f"您输入的是: {user_input}")

2. 使用侧边栏

Streamlit 的侧边栏 st.sidebar 是另一个重要的布局工具,可以用来放置一些辅助内容,比如筛选器或者设置选项,这样主区域就可以专注于数据展示。

import streamlit as st
import pandas as pd

# 创建一个示例数据框
df = pd.DataFrame({
    '类别': ['A', 'B', 'C', 'D'],
    '值': [1, 2, 3, 4]
})

st.title("使用侧边栏进行数据筛选")

# 侧边栏的选择框
selected_category = st.sidebar.selectbox("选择一个类别", df['类别'])

# 根据选择进行筛选
filtered_data = df[df['类别'] == selected_category]

st.write("筛选后的数据:", filtered_data)

3. 使用扩展器

st.expander() 允许我们创建可以展开和收起的内容,这对于存放额外信息非常有用。用户可以选择性地查看这些信息,而不会导致界面显得过于拥挤。

import streamlit as st

st.title("使用扩展器展示额外信息")

with st.expander("点击展开以查看详细信息"):
    st.write("这里是一些额外的信息,可以根据需要查看。")
    st.image("https://via.placeholder.com/150", caption="样例图片")

st.write("这是主内容区域。")

4. 列布局

使用 st.columns() 可以将多个组件并排放置,增强界面的视觉效果。

import streamlit as st

st.title("使用列布局")

col1, col2, col3 = st.columns(3)

with col1:
    st.header("列 1")
    st.button("按钮 1")

with col2:
    st.header("列 2")
    st.button("按钮 2")

with col3:
    st.header("列 3")
    st.button("按钮 3")

总结

Streamlit 提供的容器和布局工具极大地丰富了我们的应用界面。通过灵活使用 st.container()st.sidebarst.expander() 和列布局等,我们可以创建出更加美观和用户友好的应用。希望本文能帮助你在 Streamlit 的开发中更好地利用布局工具,提升应用的可用性和用户体验。

点赞(0) 打赏

微信小程序

微信扫一扫体验

微信公众账号

微信扫一扫加关注

发表
评论
返回
顶部