Update

demo.py

@@ -138,6 +138,10 @@ def credit_recognition(frame):
     json_result = json.dumps(resultValues, indent=4)
     return [json_result, images]
 
+id_result_output = gr.JSON()
+image_result_output = gr.HTML()
+credit_result_output = gr.JSON()
+image_result_output = gr.HTML()
 with gr.Blocks() as demo:
     gr.Markdown(
         """
@@ -156,7 +160,7 @@ with gr.Blocks() as demo:
                 id_image_input1 = gr.Image(type='filepath', label='Front')
                 id_image_input2 = gr.Image(type='filepath', label='Back')
                 id_recognition_button = gr.Button("ID Card Recognition")
-                gr.Markdown("## Image Examples")
+                gr.Markdown("## Examples")
                 gr.Examples(
                     examples=[['examples/11.jpg', 'examples/12.jpg'], ['examples/21.jpg', 'examples/22.jpg'], ['examples/3.jpg', '']],
                     inputs=[id_image_input1, id_image_input2],
@@ -165,10 +169,10 @@ with gr.Blocks() as demo:
                 )
 
             with gr.Column(scale=5):
-                id_result_output = gr.JSON()
+                id_result_output
         
             with gr.Column(scale=2):
-                image_result_output = gr.HTML()
+                image_result_output
 
         id_recognition_button.click(idcard_recognition, inputs=[id_image_input1, id_image_input2], outputs=[id_result_output, image_result_output])
     with gr.TabItem("Barcode Recognition"):
@@ -189,11 +193,19 @@ with gr.Blocks() as demo:
             with gr.Column(scale=3):
                 credit_image_input = gr.Image(type='filepath')
                 credit_recognition_button = gr.Button("Credit Card Recognition")
+                gr.Markdown("## Examples")
+                gr.Examples(
+                    examples=['examples/c1.jpg', 'examples/c2.jpg', 'examples/c3.jpg'],
+                    inputs=credit_image_input,
+                    outputs=[credit_result_output, image_result_output],
+                    fn=credit_recognition
+                )
+
             with gr.Column(scale=5):
-                credit_result_output = gr.JSON()
+                credit_result_output
         
             with gr.Column(scale=2):
-                image_result_output = gr.HTML()
+                image_result_output
         
         credit_recognition_button.click(credit_recognition, inputs=credit_image_input, outputs=[credit_result_output, image_result_output])