Update app.py

app.py

@@ -7,7 +7,7 @@ CUSTOM_CSS = """
 /* 左侧面板 */
 #left-panel {
     width: 300px;
-    height: 400px;      /* 固定高度，你可根据需求调整 */
+    height: 400px;      /* 固定高度，可根据需要调节 */
     overflow-y: auto;   /* 超出时滚动 */
     border-right: 1px solid #ccc;
     padding: 10px;
@@ -58,7 +58,8 @@ def combine_action():
 def create_zip():
     """
     动态生成并返回一个 zip 文件（内存中）。
-    Gradio 会将返回的 BytesIO 作为 File 下载。
+    Gradio 会将返回的 BytesIO 作为 File 输出，
+    用户看到下载链接后可点击保存。
     """
     buf = io.BytesIO()
     with zipfile.ZipFile(buf, 'w') as zf:
@@ -67,20 +68,19 @@ def create_zip():
     buf.seek(0)
     return buf  # 返回内存中的 zip
 
+# 搭建Gradio界面
 with gr.Blocks(css=CUSTOM_CSS) as demo:
-    # 主布局
+    # 用 gr.Row() + gr.Column() 实现左右并排
     with gr.Row():
-        # 左侧面板
-        with gr.Box(elem_id="left-panel"):
+        with gr.Column(elem_id="left-panel"):
             gr.Markdown("**上传区域**")
             uploader = gr.File(label="在此处上传文件")
 
-        # 右侧面板
-        with gr.Box(elem_id="right-panel"):
+        with gr.Column(elem_id="right-panel"):
             gr.Markdown("**结果缩略图**")
             gr.Markdown("这里可以放置处理后的缩略图或任何输出")
 
-    # 底部按钮
+    # 底部按钮（同一行）
     with gr.Row():
         combine_btn = gr.Button("合并", elem_id="combine-button")
         download_btn = gr.Button("下载 Zip", elem_id="download-zip")
@@ -88,8 +88,7 @@ with gr.Blocks(css=CUSTOM_CSS) as demo:
     # 点击“合并”时（这里仅做一个演示）
     combine_btn.click(fn=combine_action, inputs=[], outputs=[])
 
-    # 准备一个隐藏的 File 组件，用来承载生成的 zip 文件
-    # 一旦函数返回文件，该组件就会显示“下载链接”
+    # 用一个隐藏的 File 组件承载生成的 zip 文件
     zip_file = gr.File(label="点此下载生成的 ZIP", visible=False)
 
     # 点击“下载 Zip”时，调用 create_zip，输出到 zip_file