『玩转Streamlit』--交互类组件
交互类组件在Web应用程序中至关重要，它们允许用户与应用进行实时互动，能够显著提升用户体验。用户不再只是被动地接收信息，而是可以主动地输入数据、做出选择或触发事件，从而更加深入地参与到应用中来。
此外，对于某些复杂的任务或操作，交互类组件可以将其分解成一系列简单的步骤或选择，从而降低用户的认知负担和学习成本
。这使得用户能够更轻松地完成这些任务，提高应用的易用性。
Streamlit中交互类组件有很多，本篇介绍其中最常用的几种，这也是Web页面中最常见到的几种组件。
[*]st.text_input：允许用户输入文本，用于收集用户输入的字符串信息。
[*]st.button：提供一个可点击的按钮，用户点击后触发特定操作或事件。
[*]st.selectbox：显示下拉列表，让用户从预设选项中选择一个。
[*]st.multiselect：提供下拉多选功能，允许用户从预设选项中选择多个。
[*]st.radio：显示单选按钮组，让用户从多个选项中选择一个。
[*]st.checkbox：提供复选框，让用户选择或取消选择特定选项。
1. 组件概述
1.1. st.text_input
用于输入普通文本或者密码，类似于HTML中的<input type="text">。
核心的参数有：
名称类型说明labelstr输入框前面的标签keystr唯一标识此输入框的键，可用于在回调中引用valuestr输入框的初始值typestr输入类型，可以是"default"（默认）或者"password"（密码）1.2. st.button
提供一个按钮用来出发特定事件，类似于HTML中的<button>。
核心的参数有：
名称类型说明labelstr按钮上的文字keystr唯一标识此按钮的键helpstr按钮旁边的帮助文本1.3. st.selectbox
下拉选择框，类似于HTML中的<select>。
核心的参数有：
名称类型说明labelstr下拉框前面的标签keystr唯一标识此下拉框的键optionslist下拉框中的选项列表indexint初始选中项的索引1.4. st.multiselect
可以多选的下拉选择框，类似于HTML中的<select multiple>。
核心的参数有：
名称类型说明labelstr多选框前面的标签keystr唯一标识此多选框的键optionslist多选框中的选项列表defaultlist默认选中的选项列表1.5. st.radio
单选按钮组，类似于HTML中的<input type="radio">。
核心的参数有：
名称类型说明labelstr单选按钮组前面的标签keystr唯一标识此单选按钮组的键optionslist单选按钮组中的选项列表indexint初始选中项的索引1.6. st.checkbox
复选框，类似于HTML中的<input type="checkbox">。
核心的参数有：
名称类型说明labelstr复选框旁边的标签keystr唯一标识此复选框的键valuebool复选框的初始状态（选中或未选中）2. 组件使用示例
下面通过从实际场景中简化而来的示例，来看看如何使用Streamlit的交互类组件。
2.1. "用户偏好调查"示例
这个示例模拟了一个真实的用户调查场景，
通过Streamlit的交互式组件，用户可以轻松地输入和选择信息，并提交给应用进行处理和显示。
import streamlit as st# 标题st.title("用户偏好调查")# 文本输入框：收集用户名username = st.text_input("请输入您的姓名：")# 下拉单选框：选择性别gender = st.selectbox("请选择您的性别：", ["男", "女", "其他"])# 下拉多选框：选择兴趣爱好hobbies = st.multiselect( "请选择您的兴趣爱好：", ["阅读", "运动", "旅行", "音乐", "电影"])# 单选按钮组：选择喜欢的颜色favorite_color = st.radio("请选择您喜欢的颜色：", ["红色", "蓝色", "绿色", "黄色"])# 复选框：是否同意接收推送accept_push = st.checkbox("您是否同意接收推送消息？")# 按钮：提交调查if st.button("提交调查"): # 收集所有输入信息并显示 user_info = { "姓名": username, "性别": gender, "兴趣爱好": ", ".join(hobbies), "喜欢的颜色": favorite_color, "是否同意接收推送": "是" if accept_push else "否", } st.subheader("您的调查信息如下：") st.write(user_info)
2.2. "数据分析项目仪表板"示例
这个示例模拟了一个数据分析项目的仪表板，
通过Streamlit的交互式组件，用户可以轻松地与数据进行交互，选择他们感兴趣的分析方式，并查看和下载分析结果。
import streamlit as stimport pandas as pdimport numpy as np# 假设数据集data = pd.DataFrame( { "日期": pd.date_range(start="2023-01-01", periods=100, freq="D"), "类别": np.random.choice(["A", "B", "C"], 100), "销售额": np.random.randint(100, 1000, 100), "利润": np.random.randint(10, 100, 100), })# 标题st.title("数据分析项目仪表板")# 文本输入框：输入项目名称project_name = st.text_input("请输入项目名称：")# 下拉单选框：选择分析类别analysis_category = st.selectbox("请选择分析类别：", data["类别"].unique())# 下拉多选框：选择显示的列display_columns = st.multiselect("请选择要显示的列：", data.columns)selected_data = data# 单选按钮组：选择汇总方式agg = st.radio("请选择汇总方式：", ["总和", "平均值", "最大值", "最小值"])agg_dict = { "总和": "sum", "平均值": "mean", "最大值": "max", "最小值": "min",}# 复选框：是否按类别汇总group_by_category = st.checkbox("是否按类别汇总？")# 按钮：执行分析if st.button("执行分析"): # 根据用户选择进行分析 if group_by_category: grouped_data = ( selected_data.groupby("类别") .agg({col: agg_dict for col in selected_data.columns if col != "类别"}) .reset_index() ) else: grouped_data = ( selected_data.agg({col: agg_dict for col in selected_data.columns}) .to_frame() .T ) # 显示分析结果 st.subheader("分析结果：") st.dataframe(grouped_data)
3. 总结
总之，这些交互式组件使得用户可以通过文本输入、选择、勾选等方式与应用进行互动，从而根据用户需求动态地展示和分析数据。
它们极大地增强了应用的灵活性和用户体验，使得数据分析、数据可视化等任务变得更加直观和便捷。
页:
[1]