『玩转Streamlit』--交互类组件

向国旗敬礼

交互类组件在Web应用程序中至关重要，它们允许用户与应用进行实时互动，能够显著提升用户体验。
用户不再只是被动地接收信息，而是可以主动地输入数据、做出选择或触发事件，从而更加深入地参与到应用中来。
此外，对于某些复杂的任务或操作，交互类组件可以将其分解成一系列简单的步骤或选择，从而降低用户的认知负担和学习成本
。这使得用户能够更轻松地完成这些任务，提高应用的易用性。
Streamlit中交互类组件有很多，本篇介绍其中最常用的几种，这也是Web页面中最常见到的几种组件。

• st.text_input：允许用户输入文本，用于收集用户输入的字符串信息。
  
• st.button：提供一个可点击的按钮，用户点击后触发特定操作或事件。
  
• st.selectbox：显示下拉列表，让用户从预设选项中选择一个。
  
• st.multiselect：提供下拉多选功能，允许用户从预设选项中选择多个。
  
• st.radio：显示单选按钮组，让用户从多个选项中选择一个。
  
• st.checkbox：提供复选框，让用户选择或取消选择特定选项。
  

1. 组件概述

1.1. st.text_input

用于输入普通文本或者密码，类似于HTML中的。
核心的参数有：
名称类型说明labelstr输入框前面的标签keystr唯一标识此输入框的键，可用于在回调中引用valuestr输入框的初始值typestr输入类型，可以是"default"（默认）或者"password"（密码）1.2. st.button

提供一个按钮用来出发特定事件，类似于HTML中的。
核心的参数有：
名称类型说明labelstr按钮上的文字keystr唯一标识此按钮的键helpstr按钮旁边的帮助文本1.3. st.selectbox

下拉选择框，类似于HTML中的。
核心的参数有：
名称类型说明labelstr下拉框前面的标签keystr唯一标识此下拉框的键optionslist下拉框中的选项列表indexint初始选中项的索引1.4. st.multiselect

可以多选的下拉选择框，类似于HTML中的。
核心的参数有：
名称类型说明labelstr多选框前面的标签keystr唯一标识此多选框的键optionslist多选框中的选项列表defaultlist默认选中的选项列表1.5. st.radio

单选按钮组，类似于HTML中的。
核心的参数有：
名称类型说明labelstr单选按钮组前面的标签keystr唯一标识此单选按钮组的键optionslist单选按钮组中的选项列表indexint初始选中项的索引1.6. st.checkbox

复选框，类似于HTML中的。
核心的参数有：
名称类型说明labelstr复选框旁边的标签keystr唯一标识此复选框的键valuebool复选框的初始状态（选中或未选中）2. 组件使用示例

下面通过从实际场景中简化而来的示例，来看看如何使用Streamlit的交互类组件。
2.1. "用户偏好调查"示例

这个示例模拟了一个真实的用户调查场景，
通过Streamlit的交互式组件，用户可以轻松地输入和选择信息，并提交给应用进行处理和显示。

1. import streamlit as st
3. # 标题
4. st.title("用户偏好调查")
6. # 文本输入框：收集用户名
7. username = st.text_input("请输入您的姓名：")
9. # 下拉单选框：选择性别
10. gender = st.selectbox("请选择您的性别：", ["男", "女", "其他"])
12. # 下拉多选框：选择兴趣爱好
13. hobbies = st.multiselect(
14.     "请选择您的兴趣爱好：", ["阅读", "运动", "旅行", "音乐", "电影"]
15. )
17. # 单选按钮组：选择喜欢的颜色
18. favorite_color = st.radio("请选择您喜欢的颜色：", ["红色", "蓝色", "绿色", "黄色"])
20. # 复选框：是否同意接收推送
21. accept_push = st.checkbox("您是否同意接收推送消息？")
23. # 按钮：提交调查
24. if st.button("提交调查"):
25.     # 收集所有输入信息并显示
26.     user_info = {
27.         "姓名": username,
28.         "性别": gender,
29.         "兴趣爱好": ", ".join(hobbies),
30.         "喜欢的颜色": favorite_color,
31.         "是否同意接收推送": "是" if accept_push else "否",
32.     }
34.     st.subheader("您的调查信息如下：")
35.     st.write(user_info)

复制代码

2.2. "数据分析项目仪表板"示例

这个示例模拟了一个数据分析项目的仪表板，
通过Streamlit的交互式组件，用户可以轻松地与数据进行交互，选择他们感兴趣的分析方式，并查看和下载分析结果。

1. import streamlit as st
2. import pandas as pd
3. import numpy as np
5. # 假设数据集
6. data = pd.DataFrame(
7.     {
8.         "日期": pd.date_range(start="2023-01-01", periods=100, freq="D"),
9.         "类别": np.random.choice(["A", "B", "C"], 100),
10.         "销售额": np.random.randint(100, 1000, 100),
11.         "利润": np.random.randint(10, 100, 100),
12.     }
13. )
15. # 标题
16. st.title("数据分析项目仪表板")
18. # 文本输入框：输入项目名称
19. project_name = st.text_input("请输入项目名称：")
21. # 下拉单选框：选择分析类别
22. analysis_category = st.selectbox("请选择分析类别：", data["类别"].unique())
24. # 下拉多选框：选择显示的列
25. display_columns = st.multiselect("请选择要显示的列：", data.columns)
26. selected_data = data[display_columns]
28. # 单选按钮组：选择汇总方式
29. agg = st.radio("请选择汇总方式：", ["总和", "平均值", "最大值", "最小值"])
30. agg_dict = {
31.     "总和": "sum",
32.     "平均值": "mean",
33.     "最大值": "max",
34.     "最小值": "min",
35. }
37. # 复选框：是否按类别汇总
38. group_by_category = st.checkbox("是否按类别汇总？")
40. # 按钮：执行分析
41. if st.button("执行分析"):
42.     # 根据用户选择进行分析
43.     if group_by_category:
44.         grouped_data = (
45.             selected_data.groupby("类别")
46.             .agg({col: agg_dict[agg] for col in selected_data.columns if col != "类别"})
47.             .reset_index()
48.         )
49.     else:
50.         grouped_data = (
51.             selected_data.agg({col: agg_dict[agg] for col in selected_data.columns})
52.             .to_frame()
53.             .T
54.         )
56.     # 显示分析结果
57.     st.subheader("分析结果：")
58.     st.dataframe(grouped_data)

复制代码

3. 总结

总之，这些交互式组件使得用户可以通过文本输入、选择、勾选等方式与应用进行互动，从而根据用户需求动态地展示和分析数据。
它们极大地增强了应用的灵活性和用户体验，使得数据分析、数据可视化等任务变得更加直观和便捷。

来源:https://www.cnblogs.com/wang_yb/p/18554142
免责声明：由于采集信息均来自互联网，如果侵犯了您的权益，请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容，谢谢合作！