chore: Update Gradio UI layout for image generation and processing

app.py

@@ -190,100 +190,93 @@ pipe = StableDiffusionXLPipeline.from_pretrained(
 
 print('Loading Finished!')
 
-# Gradio UI
 with gr.Blocks() as demo:
     with gr.Group():
         with gr.Row():
-            prompt = gr.Textbox(label='Enter your prompt (English)', scale=8)
+            prompt = gr.Textbox(label='Enter your prompt (English)', scale=2)
             submit_prompt = gr.Button(
                 'Generate Image', scale=1, variant='primary')
-            img = gr.Image(label='SDXL-Lightning Generated Image')
-
-    with gr.Row(variant="panel"):
-        with gr.Column():
-            with gr.Row():
-                input_image = gr.Image(
-                    label="Input Image",
-                    image_mode="RGBA",
-                    sources="upload",
-                    type="pil",
-                    elem_id="content_image",
-                )
-                processed_image = gr.Image(
-                    label="Processed Image",
-                    image_mode="RGBA",
-                    type="pil",
-                    interactive=False
-                )
-            with gr.Row():
-                with gr.Group():
-                    do_remove_background = gr.Checkbox(
-                        label="Remove Background", value=True)
-                    sample_seed = gr.Number(
-                        value=42, label="Seed Value", precision=0)
-                    sample_steps = gr.Slider(
-                        label="Sample Steps", minimum=30, maximum=75, value=75, step=5)
-
-            with gr.Row():
-                submit_mesh = gr.Button(
-                    "Generate", elem_id="generate", variant="primary")
+            img = gr.Image()
 
+        with gr.Tab("Image Processing"):
             with gr.Row(variant="panel"):
-                gr.Examples(
-                    examples=[os.path.join("examples", img_name)
-                              for img_name in sorted(os.listdir("examples"))],
-                    inputs=[input_image],
-                    label="Examples",
-                    cache_examples=False,
-                    examples_per_page=16
-                )
-
-        with gr.Column():
-            with gr.Row():
                 with gr.Column():
-                    mv_show_images = gr.Image(
-                        label="Generated Multi-views",
-                        type="pil",
-                        width=379,
-                        interactive=False
-                    )
-
-            with gr.Row():
-                with gr.Tab("OBJ"):
-                    output_model_obj = gr.Model3D(
-                        label="Output Model (OBJ Format)",
-                        interactive=False,
-                    )
+                    with gr.Row():
+                        input_image = gr.Image(
+                            label="Input Image",
+                            image_mode="RGBA",
+                            sources="upload",
+                            type="pil",
+                            elem_id="content_image",
+                        )
+                        processed_image = gr.Image(
+                            label="Processed Image",
+                            image_mode="RGBA",
+                            type="pil",
+                            interactive=False
+                        )
+                    with gr.Row():
+                        with gr.Group():
+                            do_remove_background = gr.Checkbox(
+                                label="Remove Background", value=True)
+                            sample_seed = gr.Number(
+                                value=42, label="Seed Value", precision=0)
+                            sample_steps = gr.Slider(
+                                label="Sample Steps", minimum=30, maximum=75, value=75, step=5)
+                    with gr.Row():
+                        submit_mesh = gr.Button(
+                            "Generate", elem_id="generate", variant="primary")
+                    with gr.Row(variant="panel"):
+                        gr.Examples(
+                            examples=[os.path.join("examples", img_name) for img_name in sorted(
+                                os.listdir("examples"))],
+                            inputs=[input_image],
+                            label="Examples",
+                            cache_examples=False,
+                            examples_per_page=16
+                        )
+
+        with gr.Tab("3D Model"):
+            with gr.Column():
+                with gr.Row():
+                    with gr.Column():
+                        mv_show_images = gr.Image(
+                            label="Generated Multi-views",
+                            type="pil",
+                            width=379,
+                            interactive=False
+                        )
+                with gr.Row():
+                    with gr.Tab("OBJ"):
+                        output_model_obj = gr.Model3D(
+                            label="Output Model (OBJ Format)",
+                            interactive=False,
+                        )
+                        gr.Markdown(
+                            "Note: Downloaded .obj model will be flipped. Export .glb instead or manually flip it before usage.")
+                    with gr.Tab("GLB"):
+                        output_model_glb = gr.Model3D(
+                            label="Output Model (GLB Format)",
+                            interactive=False,
+                        )
+                        gr.Markdown(
+                            "Note: The model shown here has a darker appearance. Download to get correct results.")
+                with gr.Row():
                     gr.Markdown(
-                        "Note: Downloaded .obj model will be flipped. Export .glb instead or manually flip it before usage.")
-                with gr.Tab("GLB"):
-                    output_model_glb = gr.Model3D(
-                        label="Output Model (GLB Format)",
-                        interactive=False,
-                    )
-                    gr.Markdown(
-                        "Note: The model shown here has a darker appearance. Download to get correct results.")
-
-            with gr.Row():
-                gr.Markdown(
-                    '''Try a different <b>seed value</b> if the result is unsatisfying (Default: 42).''')
+                        '''Try a different <b>seed value</b> if the result is unsatisfying (Default: 42).''')
 
     mv_images = gr.State()
 
     submit_prompt.click(fn=generate_image, inputs=[prompt], outputs=img)
-
     submit_mesh.click(fn=check_input_image, inputs=[input_image]).success(
-        fn=preprocess,
-        inputs=[input_image, do_remove_background],
-        outputs=[processed_image],
+        fn=preprocess, inputs=[input_image,
+                               do_remove_background], outputs=[processed_image],
     ).success(
-        fn=generate_mvs,
-        inputs=[processed_image, sample_steps, sample_seed],
-        outputs=[mv_images, mv_show_images]
+        fn=generate_mvs, inputs=[processed_image, sample_steps, sample_seed], outputs=[
+            mv_images, mv_show_images]
     ).success(
-        fn=make3d,
-        inputs=[mv_images],
-        outputs=[output_model_obj, output_model_glb]
+        fn=make3d, inputs=[mv_images], outputs=[
+            output_model_obj, output_model_glb]
     )
 
 demo.launch()