---

source: "https://github.com/huggingface/skills/tree/main/skills/huggingface-gradio" name: hugging-face-gradio description: 在Python中构建或编辑Gradio应用、布局、组件和聊天界面。 risk: unknown

Gradio

何时使用

当用户想要Gradio演示、UI原型或基于Python的ML界面时使用此技能。

Gradio是一个用于构建交互式Web UI和ML演示的Python库。此技能涵盖核心API、模式和示例。

指南

特定主题的详细指南（相关时阅读）：

• 快速开始
• Interface类
• Blocks和事件监听器
• 控制布局
• 更多Blocks功能
• 自定义CSS和JS
• 流式输出

核心模式

基础Interface

import gradio as gr

def greet(name):
    return f"Hello {name}!"

demo = gr.Interface(fn=greet, inputs="text", outputs="text")
demo.launch()

Blocks布局

import gradio as gr

with gr.Blocks() as demo:
    with gr.Row():
        with gr.Column():
            input_text = gr.Textbox(label="输入")
            btn = gr.Button("提交")
        with gr.Column():
            output_text = gr.Textbox(label="输出")
    
    btn.click(fn=process, inputs=input_text, outputs=output_text)

demo.launch()

聊天界面

import gradio as gr

def respond(message, history):
    return f"你说了: {message}"

demo = gr.ChatInterface(fn=respond)
demo.launch()

文件上传

import gradio as gr

def process_file(file):
    return file.name

demo = gr.Interface(
    fn=process_file,
    inputs=gr.File(label="上传文件"),
    outputs="text"
)
demo.launch()

常用组件

| 组件 | 用途 | |------|------| | gr.Textbox | 文本输入/输出 | | gr.Image | 图片上传/显示 | | gr.Audio | 音频播放/录制 | | gr.Slider | 数值滑块 | | gr.Dropdown | 下拉选择 | | gr.Checkbox | 复选框 | | gr.File | 文件上传 | | gr.DataFrame | 表格数据 |