Input widgets

通过小部件，Streamlit 允许您通过按钮、滑块、文本输入等方式将交互性直接融入您的应用程序中。

Button elements

按钮

显示一个按钮小部件。

clicked = st.button("Click me")

下载按钮

显示一个下载按钮小部件。

st.download_button("Download file", file)

表单按钮

显示一个表单提交按钮。用于与st.form一起使用。

st.form_submit_button("Sign up")

链接按钮

显示一个链接按钮。

st.link_button("Go to gallery", url)

页面链接

在多页面应用程序中显示指向另一个页面的链接。

st.page_link("app.py", label="Home", icon="🏠") st.page_link("pages/profile.py", label="My profile")

Selection elements

复选框

显示一个复选框小部件。

selected = st.checkbox("I agree")

颜色选择器

显示一个颜色选择器小部件。

color = st.color_picker("Pick a color")

反馈

显示评分或情感按钮组。

st.feedback("stars")

多选

显示一个多选小部件。多选小部件最初为空。

choices = st.multiselect("Buy", ["milk", "apples", "potatoes"])

药丸

显示一个药丸按钮选择小部件。

st.pills("Tags", ["Sports", "AI", "Politics"])

单选按钮

显示一个单选按钮小部件。

choice = st.radio("Pick one", ["cats", "dogs"])

分段控制

显示一个分段按钮选择小部件。

st.segmented_control("Filter", ["Open", "Closed", "All"])

选择滑块

显示一个滑块小部件以从列表中选择项目。

size = st.select_slider("Pick a size", ["S", "M", "L"])

选择框

显示一个选择小部件。

choice = st.selectbox("Pick one", ["cats", "dogs"])

切换

显示一个切换小部件。

activated = st.toggle("Activate")

Numeric input elements

数字输入

显示一个数字输入小部件。

choice = st.number_input("Pick a number", 0, 10)

滑块

显示一个滑块小部件。

number = st.slider("Pick a number", 0, 100)

Date and time input elements

日期输入

显示一个日期输入小部件。

date = st.date_input("Your birthday")

时间输入

显示一个时间输入小部件。

time = st.time_input("Meeting time")

Text input elements

文本输入

显示一个单行文本输入小部件。

name = st.text_input("First name")

文本区域

显示一个多行文本输入小部件。

text = st.text_area("Text to translate")

聊天输入

显示一个聊天输入小部件。

prompt = st.chat_input("Say something") if prompt: st.write(f"The user has sent: {prompt}")

Other input elements

音频输入

显示一个允许用户使用麦克风录制的小部件。

speech = st.audio_input("Record a voice message")

数据编辑器

显示一个数据编辑器小部件。

edited = st.data_editor(df, num_rows="dynamic")

文件上传器

显示一个文件上传器小部件。

data = st.file_uploader("Upload a CSV")

相机输入

显示一个小部件，允许用户直接从相机上传图像。

image = st.camera_input("Take a picture")

第三方组件

这些是由我们可爱的社区创建的精选组件。更多示例和灵感，请查看我们的 组件库 和 Streamlit 扩展！

Previous

Streamlit 聊天

用于聊天机器人用户界面的Streamlit组件。由@AI-Yash创建。

from streamlit_chat import message message("My message") message("Hello bot!", is_user=True) # align's the message to the right

Streamlit 选项菜单

从菜单中的选项列表中选择一个项目。由@victoryhb创建。

from streamlit_option_menu import option_menu option_menu("Main Menu", ["Home", 'Settings'], icons=['house', 'gear'], menu_icon="cast", default_index=1)

Streamlit 扩展

一个包含有用Streamlit附加功能的库。由@arnaudmiribel创建。

from streamlit_extras.stoggle import stoggle stoggle( "Click me!", """🥷 Surprise! Here's some additional content""",)

Streamlit 元素

在Streamlit中创建一个可拖动和可调整大小的仪表板。由@okls创建。

from streamlit_elements import elements, mui, html with elements("new_element"): mui.Typography("Hello world")

标签

为您的Streamlit应用程序添加标签。由@gagan3012创建。

from streamlit_tags import st_tags st_tags(label='# Enter Keywords:', text='Press enter to add more', value=['Zero', 'One', 'Two'], suggestions=['five', 'six', 'seven', 'eight', 'nine', 'three', 'eleven', 'ten', 'four'], maxtags = 4, key='1')

Stqdm

在streamlit应用中处理进度条的最简单方法。由@Wirg创建。

from stqdm import stqdm for _ in stqdm(range(50)): sleep(0.5)

时间线

在Streamlit应用程序中使用TimelineJS显示时间线。由@innerdoc创建。

from streamlit_timeline import timeline with open('example.json', "r") as f: timeline(f.read(), height=800)

相机输入实时

替代st.camera_input的功能，实时返回网络摄像头图像。由@blackary创建。

from camera_input_live import camera_input_live image = camera_input_live() st.image(value)

Streamlit Ace

用于Streamlit的Ace编辑器组件。由@okld创建。

from streamlit_ace import st_ace content = st_ace() content

Streamlit 聊天

用于聊天机器人用户界面的Streamlit组件。由@AI-Yash创建。

from streamlit_chat import message message("My message") message("Hello bot!", is_user=True) # align's the message to the right

Streamlit 选项菜单

从菜单中的选项列表中选择一个项目。由@victoryhb创建。

from streamlit_option_menu import option_menu option_menu("Main Menu", ["Home", 'Settings'], icons=['house', 'gear'], menu_icon="cast", default_index=1)

Streamlit 扩展

一个包含有用Streamlit附加功能的库。由@arnaudmiribel创建。

from streamlit_extras.stoggle import stoggle stoggle( "Click me!", """🥷 Surprise! Here's some additional content""",)

Streamlit 元素

在Streamlit中创建一个可拖动和可调整大小的仪表板。由@okls创建。

from streamlit_elements import elements, mui, html with elements("new_element"): mui.Typography("Hello world")

标签

为您的Streamlit应用程序添加标签。由@gagan3012创建。

from streamlit_tags import st_tags st_tags(label='# Enter Keywords:', text='Press enter to add more', value=['Zero', 'One', 'Two'], suggestions=['five', 'six', 'seven', 'eight', 'nine', 'three', 'eleven', 'ten', 'four'], maxtags = 4, key='1')

Stqdm

在streamlit应用中处理进度条的最简单方法。由@Wirg创建。

from stqdm import stqdm for _ in stqdm(range(50)): sleep(0.5)

时间线

在Streamlit应用程序中使用TimelineJS显示时间线。由@innerdoc创建。

from streamlit_timeline import timeline with open('example.json', "r") as f: timeline(f.read(), height=800)

相机输入实时

替代st.camera_input的功能，实时返回网络摄像头图像。由@blackary创建。

from camera_input_live import camera_input_live image = camera_input_live() st.image(value)

Streamlit Ace

用于Streamlit的Ace编辑器组件。由@okld创建。

from streamlit_ace import st_ace content = st_ace() content

Streamlit 聊天

用于聊天机器人用户界面的Streamlit组件。由@AI-Yash创建。

from streamlit_chat import message message("My message") message("Hello bot!", is_user=True) # align's the message to the right

Streamlit 选项菜单

从菜单中的选项列表中选择一个项目。由@victoryhb创建。

from streamlit_option_menu import option_menu option_menu("Main Menu", ["Home", 'Settings'], icons=['house', 'gear'], menu_icon="cast", default_index=1)

Streamlit 扩展

一个包含有用Streamlit附加功能的库。由@arnaudmiribel创建。

from streamlit_extras.stoggle import stoggle stoggle( "Click me!", """🥷 Surprise! Here's some additional content""",)

Next

Previous: Chart elementsNext: st.button

forum

还有问题吗？

我们的 论坛 充满了有用的信息和Streamlit专家。