国庆节10月1日
--


Streamlit基础概念、常用API、页面构建、运行方式及核心知识点
Streamlit是一个开源的Python库,专为数据工程师及机器学习工程师设计,用来快速基于Python代码构建交互式的web网站(无需掌握前端技术)。
1pip install streamlit1import streamlit as st使用Streamlit提供的各种API来构建页面内容。
1streamlit run xxxx.py运行后会自动打开浏览器访问 http://localhost:8501
| API | 说明 | 示例 |
|---|---|---|
st.title() | 页面主标题 | st.title("我的应用") |
st.header() | 二级标题 | st.header("章节标题") |
st.subheader() | 三级标题 | st.subheader("小节标题") |
st.write() | 通用写入方法,支持多种类型 | st.write("Hello World") |
st.markdown() | 支持Markdown语法 | st.markdown("**加粗**") |
st.text() | 纯文本输出 | st.text("纯文本内容") |
st.code() | 代码块展示 | st.code("print('hello')") |
st.caption() | 小字说明 | st.caption("这是说明文字") |
| API | 说明 | 示例 |
|---|---|---|
st.image() | 显示图片 | st.image("cat.jpg") |
st.table() | 静态表格 | st.table(data) |
st.dataframe() | 可交互数据框 | st.dataframe(df) |
st.json() | 显示JSON数据 | st.json(data) |
st.metric() | 指标卡片 | st.metric("温度", "26°C") |
| API | 说明 |
|---|---|
st.line_chart() | 折线图 |
st.bar_chart() | 柱状图 |
st.area_chart() | 面积图 |
st.scatter_chart() | 散点图 |
st.pyplot() | Matplotlib图表 |
st.plotly_chart() | Plotly图表 |
| API | 说明 | 示例 |
|---|---|---|
st.button() | 按钮 | st.button("点击我") |
st.text_input() | 文本输入框 | st.text_input("请输入姓名") |
st.text_area() | 多行文本区域 | st.text_area("请输入内容") |
st.number_input() | 数字输入 | st.number_input("请输入年龄") |
st.selectbox() | 下拉选择框 | st.selectbox("选择", ["A","B"]) |
st.multiselect() | 多选下拉 | st.multiselect("多选", ["A","B"]) |
st.slider() | 滑块 | st.slider("选择", 0, 100) |
st.date_input() | 日期选择 | st.date_input("选择日期") |
st.time_input() | 时间选择 | st.time_input("选择时间") |
st.file_uploader() | 文件上传 | st.file_uploader("上传文件") |
st.color_picker() | 颜色选择器 | st.color_picker("选择颜色") |
st.checkbox() | 复选框 | st.checkbox("同意协议") |
st.radio() | 单选按钮 | st.radio("选择", ["A","B"]) |
| API | 说明 |
|---|---|
st.sidebar | 侧边栏容器 |
st.columns() | 多列布局 |
st.tabs() | 标签页布局 |
st.expander() | 可展开区域 |
st.container() | 容器 |
st.divider() | 分隔线 |
st.empty() | 空占位符 |
| API | 说明 |
|---|---|
st.success() | 成功提示(绿色) |
st.error() | 错误提示(红色) |
st.warning() | 警告提示(黄色) |
st.info() | 信息提示(蓝色) |
st.spinner() | 加载动画 |
st.progress() | 进度条 |
st.toast() | 临时提示消息 |
st.balloons() | 气球动画(庆祝效果) |
1import streamlit as st2
3# 标题4st.title("AI智能伴侣")5
6# 段落7st.write("这是一个基于Streamlit构建的AI对话应用")8
9# 图片10st.image("cat.jpg")11
12# 分隔线13st.divider()14
15# 表格16data = {17 "姓名": ["王林", "李慕婉", "贝罗"],18 "学号": ["20230001", "20230002", "20230003"],19 "语文": [80, 90, 85],20 "数学": [87, 92, 87],21 "英语": [90, 85, 90]22}23st.table(data)24
25# 输入框26name = st.text_input("请输入你的名字")27if name:28 st.write(f"你好,{name}!")29
30# 按钮31if st.button("点击我"):32 st.success("按钮已点击!")Streamlit程序从第一行开始,从上到下依次执行。
当用户与页面交互(点击按钮、输入内容等),整个脚本会从头重新执行。
1# 这是Streamlit的重要特性2# 每次交互都会重新运行整个脚本3import streamlit as st4
5st.write("这段文字每次都会显示")6
7# 按钮点击后,整个脚本重新运行8if st.button("点击"):9 st.write("按钮被点击了!") # 只有点击后才显示为了避免重复计算,Streamlit提供了缓存装饰器:
1import streamlit as st2import time3
4# 使用缓存,避免重复计算5@st.cache_data6def expensive_computation(a, b):7 time.sleep(2) # 模拟耗时计算8 return a + b9
10# 第一次调用会执行计算,之后直接返回缓存结果11result = expensive_computation(1, 2)12st.write(f"结果: {result}")| 缓存装饰器 | 适用场景 |
|---|---|
@st.cache_data | 缓存数据(返回可序列化对象) |
@st.cache_resource | 缓存资源(如数据库连接、ML模型) |
1import streamlit as st2
3# 创建两列布局4col1, col2 = st.columns(2)5
6# 在第一列中放置内容7with col1:8 st.header("左列")9 st.write("这是左边的内容")10
11# 在第二列中放置内容12with col2:13 st.header("右列")14 st.write("这是右边的内容")1# 按比例分配列宽2col1, col2, col3 = st.columns([1, 2, 1]) # 1:2:1比例1import streamlit as st2
3# 侧边栏内容4with st.sidebar:5 st.header("设置")6 model = st.selectbox("选择模型", ["GPT-3.5", "GPT-4", "DeepSeek"])7 temperature = st.slider("温度", 0.0, 2.0, 0.7)8 api_key = st.text_input("API Key", type="password")9
10# 主区域内容11st.title("AI对话助手")12st.write(f"当前模型: {model}")Streamlit本身是无状态的,但可以通过 st.session_state 在多次交互间保持状态:
1import streamlit as st2
3# 初始化会话状态4if "messages" not in st.session_state:5 st.session_state.messages = []6
7# 显示历史消息8for msg in st.session_state.messages:9 with st.chat_message(msg["role"]):10 st.write(msg["content"])11
12# 输入框13if prompt := st.chat_input("请输入你的问题"):14 # 显示用户消息15 with st.chat_message("user"):16 st.write(prompt)17
18 # 添加到历史记录19 st.session_state.messages.append({"role": "user", "content": prompt})20
21 # 模拟AI回复22 response = f"这是AI对'{prompt}'的回复"23 with st.chat_message("assistant"):24 st.write(response)25
26 st.session_state.messages.append({"role": "assistant", "content": response})1import streamlit as st2
3uploaded_file = st.file_uploader("选择文件", type=["csv", "txt", "pdf"])4
5if uploaded_file is not None:6 # 读取文件内容7 content = uploaded_file.read()8 st.write("文件内容:")9 st.write(content.decode("utf-8"))1my_ai_app/2├── app.py # 主应用文件3├── requirements.txt # 依赖包列表4├── .streamlit/5│ └── config.toml # Streamlit配置6├── pages/ # 多页面应用7│ ├── 1_对话.py8│ └── 2_设置.py9├── utils/ # 工具函数10│ └── ai_chat.py11└── static/ # 静态资源12 └── images/在项目根目录创建 pages/ 文件夹,每个 .py 文件就是一个子页面,文件名决定了页面顺序和标题。
pip install streamlit 一键安装streamlit run xxx.py 启动应用如果你喜欢,那么欢迎来到我的世界!
了解更多暂未播放



"生活不是等待暴风雨过去,而是学会在雨中跳舞。"—— 塞维涅夫人


