用Python写一个网页版的美图秀秀

大致的流程在于我们可以将上传的照片进行黑白处理、铅笔素描处理、模糊化处理等一系列操作，具体如下

下面我们来看一下该整个网页是怎么写的

网页左侧的工具栏部分

首先第一步在于导入我们所需要用到的模块，代码如下

import streamlit as st
import numpy as np
import cv2
from PIL import Image, ImageEnhance

我们先设计到网页当中的标题和左边的工具栏，左边的工具栏部分代码如下

st.sidebar.markdown('<p class="font">My First Photo Converter App</p>', unsafe_allow_html=True)
with st.sidebar.expander("About the App"):
     st.write("""
        Use this simple app to convert your favorite photo to a pencil sketch, a grayscale image or an image with blurring effect.  \n  \nThis app was created by Junxin as a side project to learn Streamlit and computer vision. Hope you enjoy!
     """)

首先在工具栏当中添加的是关于该应用的介绍，通过调用streamlit模块当中的sidebar方法来生成一个下拉框，在通过点击“+”键来打开，

然后则是5个单选框，代码如下

filter = st.sidebar.radio('Covert your photo to:', ['Original', 'Gray Image', 'Black and White', 'Pencil Sketch', 'Blur Effect'])

单选框是通过sidebar方法来实现的，当中添加上分别是哪些的单选项，

 

 紧接着是最后的“感谢反馈”的部分，代码如下

st.sidebar.title(' ')
st.sidebar.markdown(' ')
st.sidebar.subheader('Please help us improve!')
with st.sidebar.form(key='columns_in_form',clear_on_submit=True): 
    rating=st.slider("Please rate the app", min_value=1, max_value=5, value=3,help='Drag the slider to rate the app. This is a 1-5 rating scale where 5 is the highest rating')
    text=st.text_input(label='Please leave your feedback here')
    submitted = st.form_submit_button('Submit')
    if submitted:
      .......

 

 

网页正文的标题部分

标题部分的代码如下

with col1:
    st.markdown(""" <style> .font {
    font-size:35px ; font-family: 'Cooper Black'; color: #FF9633;} 
    </style> """, unsafe_allow_html=True)
    st.markdown('<p class="font">Upload your photo here...</p>', unsafe_allow_html=True)

当然除此之外，我们需要的是上传图片的功能，代码如下

uploaded_file = st.file_uploader("", type=['jpg', 'png', 'jpeg'])

这里调用的是streamlit模块当中的file_uploader方法，其中允许上传的有三种文件格式，分别是jpg、png以及jpeg。

接下去便是上传图片的处理逻辑部分，代码如下，

with col2:
    filter = st.sidebar.radio('Covert your photo to:', ['Original', 'Gray Image', 'Black and White', 'Pencil Sketch', 'Blur Effect'])
    if filter == 'Gray Image':
        converted_img = np.array(image.convert('RGB'))
        gray_scale = cv2.cvtColor(converted_img, cv2.COLOR_RGB2GRAY)
            ......
    elif filter == 'Black and White':
            ......
    elif filter == 'Pencil Sketch':
            ......
    elif filter == 'Blur Effect':
            ......
    else:
        st.image(image, width=300)