Update app.py

app.py

@@ -47,12 +47,40 @@ def predict(image):
     except Exception as e:
         return str(e)
 
-# Define the Gradio interface
-gr.Interface(
-    fn=predict,
-    inputs=gr.Image(label="Input image", type="pil"),
-    outputs=gr.Image(label="Output image with predicted instances", type="pil"),
-    examples=['img/1.png', 'img/2.png'],
-    title="MASFNet Object Detection",
-    theme="default",
-).launch()
+with gr.Blocks(title="MASFNet Object Detection",
+                    css=".gradio-container {background:lightyellow;}"
+               ) as demo:
+    #sample_index = gr.State([])
+
+    gr.HTML("""<div style="font-family:'Times New Roman', 'Serif'; font-size:16pt; font-weight:bold; text-align:center; color:royalblue;">MASFNet Object Detection</div>""")
+
+    gr.HTML("""<br/>""")
+    gr.HTML("""<h4 style="color:navy;">a. Select an example by clicking a thumbnail below.</h4>""")
+    gr.HTML("""<h4 style="color:navy;">b. Or upload an image by clicking on the canvas.</h4>""")
+
+    with gr.Row():
+        input_image = gr.Image(label="Input image", type="pil")
+        output_image = gr.Image(label="Output image with predicted instances", type="pil")
+
+    gr.Examples(['img/1.png', 'img/2.png'], inputs=input_image)
+
+    gr.HTML("""<br/>""")
+    gr.HTML("""<h4 style="color:navy;">3. Set a threshold value (default to 0.9)</h4>""")
+
+    # threshold = gr.Slider(0, 1.0, value=0.9, label='threshold')
+
+    gr.HTML("""<br/>""")
+    gr.HTML("""<h4 style="color:navy;">4. Then, click "Infer" button to predict object instances. It will take about 10 seconds (yolos-tiny) or 20 seconds (yolos-small).</h4>""")
+
+    send_btn = gr.Button("Infer")
+    send_btn.click(fn=infer, inputs=[input_image], outputs=[output_image])
+
+    gr.HTML("""<br/>""")
+    gr.HTML("""<h4 style="color:navy;">Reference</h4>""")
+    gr.HTML("""<ul>""")
+    gr.HTML("""<li><a href="https://huggingface.co/docs/transformers/model_doc/yolos" target="_blank">Hugging Face Transformers - YOLOS</a>""")
+    gr.HTML("""</ul>""")
+
+
+#demo.queue()
+demo.launch(debug=True)