python - 如何使按钮居中并着色

Question

我有一个应用程序可以在该应用程序中将图像转换为铅笔素描，我需要对按钮进行三处更改

1. 需要将两个按钮居中对齐
2. 需要给按钮一些颜色
3. 两个按钮的大小应该相同

示例代码:

    import streamlit as st #web app and camera
    import numpy as np # for image processing 
    from PIL import Image #Image processing 

    import cv2 #computer vision 

def dodgeV2(x, y):
            return cv2.divide(x, 255 - y, scale=256)
        
def pencilsketch(inp_img):
            img_gray = cv2.cvtColor(inp_img, cv2.COLOR_BGR2GRAY)
            img_invert = cv2.bitwise_not(img_gray)
            img_smoothing = cv2.GaussianBlur(img_invert, (21, 21),sigmaX=0, sigmaY=0)
            final_img = dodgeV2(img_gray, img_smoothing)
            return(final_img)
        
def download_image(x):
    with open(x, "rb") as file:
                        btn = st.download_button(
                                label="Download image",
                                data=file,
                                file_name=x,
                                mime="image/jpg"
                            )

def email_box(x):
    if st.checkbox("Email"):
                    form = st.form(key='my-form')
                    name = form.text_input('Enter your name')
                    submit = form.form_submit_button('Send Email')
                    if submit:
                        st.write(f'x {name}')


file_image = st.camera_input(label = "Take a pic of you to be sketched out")
        
if file_image:
            input_img = Image.open(file_image)
            final_sketch = pencilsketch(np.array(input_img))
            st.write("**Output Pencil Sketch**")
            st.image(final_sketch, use_column_width=True)
            download_image("final_image.jpeg")
            email_box("hello")

else:
    st.write("You haven't uploaded any image file")
    

Answer 1

我修改了上面的代码。希望对你有帮助

customized_button = st.markdown("""
    <style >
    .stDownloadButton, div.stButton {text-align:center}
    .stDownloadButton button, div.stButton > button:first-child {
        background-color: #ADD8E6;
        color:#000000;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .stDownloadButton button:hover, div.stButton > button:hover {
        background-color: #ADD8E6;
        color:#000000;
    }
        }
    </style>""", unsafe_allow_html=True)