`Interface` 类

正如快速入门中提到的，gr.Interface类是Gradio中的一个高级抽象，它允许你通过简单地指定输入类型和输出类型，快速为任何Python函数创建演示。回顾我们的第一个演示：

import gradio as gr

def greet(name, intensity):
    return "Hello, " + name + "!" * int(intensity)

demo = gr.Interface(
    fn=greet,
    inputs=["text", "slider"],
    outputs=["text"],
)

demo.launch()

我们看到Interface类是用三个必需的参数初始化的：

fn: 用于包装用户界面（UI）的函数
inputs: 用于输入的Gradio组件。组件的数量应与函数中的参数数量匹配。
outputs: 用于输出的Gradio组件。组件的数量应与函数返回值的数量相匹配。

在本指南中，我们将深入探讨gr.Interface及其各种自定义方式，但在我们开始之前，让我们更好地理解Gradio组件。

Gradio 组件

Gradio 包含了超过 30 个预构建的组件（以及许多社区构建的自定义组件），这些组件可以在你的演示中用作输入或输出。这些组件对应于机器学习和数据科学中的常见数据类型，例如 gr.Image 组件用于处理输入或输出图像，gr.Label 组件显示分类标签和概率，gr.LinePlot 组件显示折线图，等等。

组件属性

我们使用了gr.Textbox和gr.Slider的默认版本，但如果你想改变UI组件的外观或行为怎么办？

假设你想自定义滑块，使其值从1到10，默认值为2。并且你想自定义输出文本字段——你希望它更大并带有标签。

如果你使用实际的类如gr.Textbox和gr.Slider而不是字符串快捷方式，你可以通过组件属性访问更多的自定义选项。

import gradio as gr

def greet(name, intensity):
    return "Hello, " + name + "!" * intensity

demo = gr.Interface(
    fn=greet,
    inputs=["text", gr.Slider(value=2, minimum=1, maximum=10, step=1)],
    outputs=[gr.Textbox(label="greeting", lines=3)],
)

demo.launch()

多输入和输出组件

假设你有一个更复杂的函数，它也有多个输出。在下面的例子中，我们定义了一个函数，它接受一个字符串、布尔值和数字，并返回一个字符串和数字。

import gradio as gr

def greet(name, is_morning, temperature):
    salutation = "Good morning" if is_morning else "Good evening"
    greeting = f"{salutation} {name}. It is {temperature} degrees today"
    celsius = (temperature - 32) * 5 / 9
    return greeting, round(celsius, 2)

demo = gr.Interface(
    fn=greet,
    inputs=["text", "checkbox", gr.Slider(0, 100)],
    outputs=["text", "number"],
)
demo.launch()

正如inputs列表中的每个组件按顺序对应函数的一个参数一样，outputs列表中的每个组件也按顺序对应函数返回的一个值。

图片示例

Gradio 支持多种类型的组件，例如 Image、DataFrame、Video 或 Label。让我们尝试一个图像到图像的功能来感受一下这些组件！

import numpy as np
import gradio as gr

def sepia(input_img):
    sepia_filter = np.array([
        [0.393, 0.769, 0.189],
        [0.349, 0.686, 0.168],
        [0.272, 0.534, 0.131]
    ])
    sepia_img = input_img.dot(sepia_filter.T)
    sepia_img /= sepia_img.max()
    return sepia_img

demo = gr.Interface(sepia, gr.Image(), "image")
demo.launch()

当使用Image组件作为输入时，您的函数将接收到一个形状为(height, width, 3)的NumPy数组，其中最后一个维度代表RGB值。我们也将以NumPy数组的形式返回一个图像。

Gradio 处理预处理和后处理，将图像转换为 NumPy 数组，反之亦然。您还可以使用 type= 关键字参数控制执行的预处理。例如，如果您希望函数接受图像文件路径而不是 NumPy 数组，输入 Image 组件可以写成：

gr.Image(type="filepath")

您可以阅读更多关于内置Gradio组件以及如何在Gradio文档中自定义它们的信息。

示例输入

你可以提供示例数据，用户可以轻松加载到Interface中。这对于展示模型期望的输入类型以及提供一种与模型结合探索数据集的方式非常有帮助。要加载示例数据，你可以向Interface构造函数的examples=关键字参数提供一个嵌套列表。外部列表中的每个子列表代表一个数据样本，子列表中的每个元素代表每个输入组件的输入。每个组件的示例数据格式在Docs中指定。

import gradio as gr

def calculator(num1, operation, num2):
    if operation == "add":
        return num1 + num2
    elif operation == "subtract":
        return num1 - num2
    elif operation == "multiply":
        return num1 * num2
    elif operation == "divide":
        if num2 == 0:
            raise gr.Error("Cannot divide by zero!")
        return num1 / num2

demo = gr.Interface(
    calculator,
    [
        "number",
        gr.Radio(["add", "subtract", "multiply", "divide"]),
        "number"
    ],
    "number",
    examples=[
        [45, "add", 3],
        [3.14, "divide", 2],
        [144, "multiply", 2.5],
        [0, "subtract", 1.2],
    ],
    title="Toy Calculator",
    description="Here's a sample toy calculator.",
)

demo.launch()

您可以将大型数据集加载到示例中，通过Gradio浏览并与数据集进行交互。示例将自动分页（您可以通过Interface的examples_per_page参数进行配置）。

继续学习关于示例的更多内容，请参阅More On Examples指南。

描述性内容

在前面的例子中，你可能已经注意到Interface构造函数中的title=和description=关键字参数，这些参数帮助用户理解你的应用。

Interface 构造函数中有三个参数用于指定此内容应放置的位置：

title: 接受文本并可以在界面最顶部显示它，同时也成为页面标题。
description: 接受文本、markdown或HTML，并将其放置在标题下方。
article: 也接受文本、markdown 或 HTML，并将其放置在界面下方。

annotated

另一个有用的关键字参数是 label=，它存在于每个 Component 中。这会修改每个 Component 顶部的标签文本。您还可以向 Textbox 或 Radio 等表单元素添加 info= 关键字参数，以提供有关其用法的更多信息。

gr.Number(label='Age', info='In years, must be greater than 0')

手风琴内的额外输入

如果你的预测函数需要许多输入，你可能希望将其中一些隐藏在可折叠的手风琴中，以避免界面混乱。Interface类接受一个additional_inputs参数，该参数与inputs类似，但默认情况下，包含在此处的任何输入组件都是不可见的。用户必须点击手风琴才能显示这些组件。额外的输入在标准输入之后按顺序传递给预测函数。

您可以通过使用可选的additional_inputs_accordion参数来自定义手风琴的外观，该参数接受一个字符串（在这种情况下，它将成为手风琴的标签），或者一个gr.Accordion()类的实例（例如，这可以让您控制手风琴默认是打开还是关闭）。

这是一个示例：

import gradio as gr

def generate_fake_image(prompt, seed, initial_image=None):
    return f"Used seed: {seed}", "https://dummyimage.com/300/09f.png"

demo = gr.Interface(
    generate_fake_image,
    inputs=["textbox"],
    outputs=["textbox", "image"],
    additional_inputs=[
        gr.Slider(0, 1000),
        "image"
    ]
)

demo.launch()

Interface 类