框架学习 | Streamlit 入门

一、表格

import streamlit as st
import pandas as pd

st.title("我的个人网站 💡")

"### 早上好!"

a = 329 * 3
a

[11, 22, 33]
{"a": "1", "b": "2", "c": 3}

st.image("./头像.png", width=200)

# 可互动的表格(排序、筛选等)
df = pd.DataFrame({"学号": ["01", "02", "03", "04", "05"],
              "班级": ["二班", "一班", "二班", "三班", "一班"],
              "成绩": [92, 67, 70, 88, 76]})

st.dataframe(df)
st.divider()

# 不互动的表格,只展示
st.table(df)

二、基本互动组件

import streamlit as st

# 1、文本栏输入
name = st.text_input("请输入你的名字:")
if name:
    st.write(f"你好,{name}")

# 2、分割线
st.divider()

# 3、密文密码输入
password = st.text_input("请输入你的密码:", type="password")

# 4、文本框
st.divider()
paragraph = st.text_area("请输入一段自我介绍:")

# 5、数字输入
st.divider()
age = st.number_input("请输入你的年龄:", value=20, min_value=0, max_value=150, step=1)

# 6、显示文本和图片
st.write(f"你的年龄是:{age}岁")
st.image("图片路径", width = 200)

# 7、勾选框
st.divider()
checked = st.checkbox("我同意以上条款")
if checked:
    st.write("感谢你的同意!")

# 8、按钮
st.divider()
submitted = st.button("提交")
if submitted:
    st.write("提交成功!")

三、基本互动组件补充

import streamlit as st

# 1、下拉框
gender = st.radio("你的性别是什么?",
         ["男性", "女性", "跨性别"],
         index=None)
if gender:
    st.write(f"你选择的性别是{gender}")

# 2、勾选框
st.divider()
contact = st.selectbox("你希望通过什么方式联系?",
             ["电话", "邮件", "微信", "QQ", "其它"])
st.write(f"好的,我们会通过{contact}联系你")

# 3、多选框
st.divider()
fruits = st.multiselect("你喜欢的水果是什么?",
               ["苹果", "香蕉", "橙子", "梨", "西瓜", "葡萄", "其它"])
for fruit in fruits:
    st.write(f"你选择的水果是{fruit}")

# 4、线条选择
st.divider()
height = st.slider("你的身高是多少厘米?", value=170,
          min_value=100, max_value=230, step=1)
st.write(f"你的身高是{height}厘米")

# 5、文件上传
st.divider()
uploaded_file = st.file_uploader("上传文件", type=["py"])
if uploaded_file:
    st.write(f"你上传的文件是{uploaded_file.name}")
    st.write(f"文件内容如下:{uploaded_file.read()}")

# 6、对话框(disabled,如果没有上传文件就禁止输入)
st.chat_input(disabled = not uploaded_file)

# 7、展示信息 st.chat_message(说话人).write(说话内容)
for message in st.session_state["messages"]:
    st.chat_message(message["role"]).write(message["content"])

'''实际上是这样的,st.session_state就相当于是一个会话储存字典,有啥想存的都要手动存进去。而st.chat_message就是像对话形式一样展示内容的工具,从字典中按 键——说话人、write——说话内容 的对应关系,把信息再po到屏幕上而已'''


四、布局

import streamlit as st

# 1、侧边栏
with st.sidebar:
    name = st.text_input("请输入你的名字:")
    if name:
        st.write(f"你好,{name}")

# 2、分列
column1, column2, column3 = st.columns([1, 2, 3])
with column1:
    password = st.text_input("请输入你的密码:", type="password")

with column2:
    paragraph = st.text_area("请输入一段自我介绍:")

with column3:
    age = st.number_input("请输入你的年龄:", value=20, min_value=0, max_value=150, step=1)
    st.write(f"你的年龄是:{age}岁")

checked = st.checkbox("我同意以上条款")
if checked:
    st.write("感谢你的同意!")

st.divider()
submitted = st.button("提交")
if submitted:
    st.write("提交成功!")

# 3、选项卡
tab1, tab2, tab3 = st.tabs(["性别", "联系方式", "喜好水果"])
with tab1:
    gender = st.radio("你的性别是什么?", ["男性", "女性", "跨性别"], index=None)
    if gender:
        st.write(f"你选择的性别是{gender}")

with tab2:
    contact = st.selectbox("你希望通过什么方式联系?",
                 ["电话", "邮件", "微信", "QQ", "其它"])
    st.write(f"好的,我们会通过{contact}联系你")

with tab3:
    fruits = st.multiselect("你喜欢的水果是什么?",
                   ["苹果", "香蕉", "橙子", "梨", "西瓜", "葡萄", "其它"])
    for fruit in fruits:
        st.write(f"你选择的水果是{fruit}")

# 4、折叠栏
with st.expander("身高信息"):
    height = st.slider("你的身高是多少厘米?", value=170, min_value=100, max_value=230, step=1)
    st.write(f"你的身高是{height}厘米")

st.divider()
uploaded_file = st.file_uploader("上传文件", type=["py"])
if uploaded_file:
    st.write(f"你上传的文件是{uploaded_file.name}")
    st.write(f"文件内容是{uploaded_file.read()}")

这里上面的page2-6,就是下面的多页面展示。

五、管理会话

import streamlit as st

# 通过st.session_state储存会话状态。st.session_state形如字典,空白时为空字典{}
if "a" not in st.session_state:
    st.session_state.a =0
clicked = st.button("加1")

if clicked:
    st.session state.a+=1
    
st.write(st.session_state.a)
print(st.session_state)

六、创建多页面网站

这个主要是在项目中,留出主页面的py文件,其余页面的py文件均放置在与主页面同目录下的文件包pages里(必须命名为pages)。即可完成了。
可以自动识别,以侧边栏选择的方式,切换页面。


posted @ 2024-07-23 11:40  abloger  阅读(172)  评论(0)    收藏  举报