[英]Streamlit how to display buttons in a single line
大家好,我正在用 python 中的 streamlit 构建一个简单的 web 应用程序。 我需要添加 3 个按钮,但它们必须在同一行。
显然,下面的代码将它们放在三个不同的行上
st.button('Button 1')
st.button('Button 2')
st.button('Button 3')
你有什么建议吗?
显然这应该这样做
col1, col2, col3 = st.columns([1,1,1])
with col1:
st.button('1')
with col2:
st.button('2')
with col3:
st.button('3')
我有一个类似的问题 - 向表格添加操作按钮。 我得出了以下方法:
import streamlit as st
# # Show users table
colms = st.columns((1, 2, 2, 1, 1))
fields = ["№", 'email', 'uid', 'verified', "action"]
for col, field_name in zip(colms, fields):
# header
col.write(field_name)
for x, email in enumerate(user_table['email']):
col1, col2, col3, col4, col5 = st.columns((1, 2, 2, 1, 1))
col1.write(x) # index
col2.write(user_table['email'][x]) # email
col3.write(user_table['uid'][x]) # unique ID
col4.write(user_table['verified'][x]) # email status
disable_status = user_table['disabled'][x] # flexible type of button
button_type = "Unblock" if disable_status else "Block"
button_phold = col5.empty() # create a placeholder
do_action = button_phold.button(button_type, key=x)
if do_action:
pass # do some action with row's data
button_phold.empty() # remove button
它工作正常。 对象 - user_table
- 是一个与 DataFrame 非常相似的字典,其中每个键 - 是一列(即 Python 术语中的list
)。 这里是它的样子(注意“被阻止”——这是行动的结果):
我用 css 样式MOZILLA修复它
import streamlit as st
css_code_tree_button_side_by_side= '''
<style>
#root > div:nth-child(1) > div > div > div > div > section > div > div:nth-child(1) > div > div:nth-child(2) > div{
display: -webkit-inline-box;
width: 180px;
}
#root > div:nth-child(1) > div > div > div > div > section > div > div:nth-child(1) > div > div:nth-child(2) > div > div:nth-child(-n+3){
width: 50px!important;
}
#root > div:nth-child(1) > div > div > div > div > section > div > div:nth-child(1) > div > div:nth-child(2) > div > div:nth-child(-n+3) > div{
width: 50px!important;
}
#root > div:nth-child(1) > div > div > div > div > section > div > div:nth-child(1) > div > div:nth-child(2) > div > div:nth-child(-n+3) > div > button{
width: fit-content;
}
</style>
'''
st.markdown(css_code_tree_button_side_by_side, unsafe_allow_html=True)
#I know where this 'box' is so I can play with it
with st.container():
if st.button('a'):
pass
if st.button('b'):
pass
if st.button('c'):
pass
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.