DuplicateWidgetID: with st.button widgets with key='predict' for a image classification problem in Streamlit

Question

I'm trying to write a web app, which will offer the user to input an image, select a deep learning model and click the Get a prediction button to classify the image as 'human detected' or 'no human detected' (it is a binomial classification problem).

I've got this error.

Below is my code with Streamlit, which gives me the error.

import streamlit as st
import pandas as pd
import numpy as np
from PIL import Image 
import tensorflow as tf
from tensorflow.keras.models import load_model


st.title("Binary Human Detection Web App")
# loading images
def load_image(uploaded_file):

    image = uploaded_file.resize((224,224))
    im_array = np.array(image)/255 # a normalised 2D array                
    im_array = im_array.reshape(-1, 224, 224, 3)   # to shape as (1, 224, 224, 3)
    return im_array


st.sidebar.subheader("Select a Model")
model_name = st.sidebar.selectbox("Model", ("CNN", "ResNet50"))


if st.button("Try with the Default Image"):
    image = Image.open('C:/Users/maria/Jupiter_Notebooks/Dataset_Thermal_Project/Camera_videos/Images_3sec_newdata_v2/oneman/image21.jpg')
    st.subheader("Human is detected")
    st.image(image) 

# predicting images

if model_name == 'CNN':
    st.write("Try out the CNN model with the default image or upload an image")

    if st.sidebar.button("Get prediction", key='predict'):

        st.subheader("Upload an image file")
        uploaded_file = st.file_uploader("Upload a JPG image file", type=["jpg", "jpeg"])

        if uploaded_file is not None: 
            image = load_image(Image.open(uploaded_file))
            st.image(image)
            st.subheader("CNN Results")
            model_cnn = load_model("C:/Users/.../Camera_videos/Saved_models/cnn_model.h5")
            model_cnn_ = tf.keras.models.Model(model_cnn.inputs, model_cnn.outputs)

            pred_label = model_cnn_.predict(image)[0] 


#if model_name == 'ResNet50':
else:
    st.write("Try out the ResNet50 model with the default image or upload an image")
    if st.sidebar.button("Get prediction", key='predict'):

        st.subheader("Upload an image file")
        uploaded_file = st.file_uploader("Upload a JPG image file", type=["jpg", "jpeg"])

        if uploaded_file is not None: 
            image = load_image(Image.open(uploaded_file))
            st.image(image)
            st.subheader("ResNet50 Results")
            model_resnet = load_model("C:/Users/.../Camera_videos/Saved_models/model_resnet.h5")
            model_resnet_ = tf.keras.models.Model(model_resnet.inputs, model_resnet.outputs)
         
            pred_label = model_resnet_.predict(image)[0]  

            st.write('Human is detected') if pred_label>0.5 else  st.write('No human is detected') 

I have also tried writing this code in a different way, but I dont know how to pass the 'uploaded_file' i.e. the file supplied by the user, into my initialize_model() function.

...
# loading images
def load_image(uploaded_file):

    image = uploaded_file.resize((224,224))
    im_array = np.array(image)/255 # a normalised 2D array                
    im_array = im_array.reshape(-1, 224, 224, 3)   # to shape as (1, 224, 224, 3)
    return im_array

st.sidebar.subheader("Select a NN Model")
model_name = st.sidebar.selectbox("Model", ("CNN", "ResNet50", "VGG16"))

# predicting images
def initialize_model(model_name, image):
    if model_name == 'CNN':
        st.write("Try out the CNN model with the default image or upload an image")

        if st.sidebar.button("Get prediction", key='predict'):
            st.subheader("CNN Results")
            model_cnn = load_model("C:/Users/.../Camera_videos/Saved_models/cnn_model.h5")
            model_cnn_ = tf.keras.models.Model(model_cnn.inputs, model_cnn.outputs)

         #   image = load_image(Image.open(image))

            pred_label = model_cnn_.predict(image)[0] 


    if model_name == 'ResNet50':
        if st.sidebar.button("Get prediction", key='predict'):
            st.subheader("ResNet50 Results")
            model_resnet = load_model("C:/Users/.../Camera_videos/Saved_models/model_resnet.h5")
            model_resnet_ = tf.keras.models.Model(model_resnet.inputs, model_resnet.outputs)

            #image = load_image(uploaded_file)
           
            pred_label = model_resnet_.predict(image)[0]  



if st.button("Try with the Default Image"):
    d_image = Image.open('C:/Users/.../oneman/image21.jpg')
    st.image(d_image)
     st.subheader("Human is detected")
    st.image(initialize_model(model_name,d_image))


st.subheader("Upload an image file")
uploaded_file = st.file_uploader("Upload a JPG image file", type=["jpg", "jpeg"])

if uploaded_file is not None: 
    sel_image = load_image(Image.open(uploaded_file))
    st.image(sel_image)

Can anyone help me with this problem? thank you for reading it.

Answer 1

Every button should have a unique key value and you have multiple buttons with same key value.

st.sidebar.button("Get prediction", key='predict_btn1'): # make key value unique