Steamlit-translate-to-zh-CN

Docs » Get started » 使用控件增添交互效果

使用控件增添交互效果

通过使用控件，Streamlit 允许您通过 checkboxes 复选框、buttons 按钮、sliders 滑动条等将交互性功能直接应用到您的 app 项目中。查阅我们的 API 参考 以获得交互性部件的完整列表。

使用 checkboxes 来展示或隐藏数据

checkboxes 复选框的一个用例是在 app 应用中隐藏或显示特定的图表或区域。st.checkbox() 接收单个参数，即部件的标签。在这个样例中，复选框将用于切换一个条件语句。

if st.checkbox('展示 dataframe'):
    chart_data = pd.DataFrame(
        np.random.randn(20, 3),
        columns = ['a', 'b', 'c']
    )
    st.line_chart(chart_data)

使用 selectbox 做选择

使用 st.selectbox() 函数从一个系列中进行选择。您可以写入您想要的选项，或者通过传入数组或数据帧列的方式实现。

让我们使用前面创建的 df 数据帧。

option = st.selectbox(
    '选择你最爱的数字？',
    df['first column']
)
'你的选择是：', option

把控件加入侧栏

为了一个更加干净整洁的界面，您可以选择移动您的控件放入侧栏中。这将使你的主要应用展示在网页的中心位置，而部件则固定在左侧。让我们来看看如何在您的 app 应用中使用 st.sidebar。

option = st.sidebar.selectbox(
    '选择你最爱的数字？',
    df['first column']
)
'你的选择是：', option

您可以把大多数元素放入到您的 app 应用中，也可以使用 st.sidebar.[element_name]() 这种语法来将其放到侧边栏。下面的几个例子将展示它是如何被使用：st.sidebar.markdown()，st.sidebar.slider()，st.sidebar.line_chart()。

现在唯一的例外是 st.write() 函数（您应该使用 st.sidebar.markdown() 来代替）、st.echo 和 st.spinner。尽管如此，请放心，我们目前也在努力为它们添加支持！