响应式接口

最后，我们介绍了如何让Gradio演示自动刷新或持续流式传输数据。

实时接口

您可以通过在界面中设置live=True来自动刷新界面。现在，界面将在用户输入更改时立即重新计算。

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":
        return num1 / num2

demo = gr.Interface(
    calculator,
    [
        "number",
        gr.Radio(["add", "subtract", "multiply", "divide"]),
        "number"
    ],
    "number",
    live=True,
)
demo.launch()

请注意，这里没有提交按钮，因为界面在更改时会自动重新提交。

流式组件

一些组件具有“流式”模式，例如麦克风模式下的Audio组件，或网络摄像头模式下的Image组件。流式意味着数据会持续发送到后端，并且Interface函数会持续重新运行。

gr.Audio(source='microphone') 和 gr.Audio(source='microphone', streaming=True) 的区别在于，当两者都在 gr.Interface(live=True) 中使用时，第一个 Component 会在用户停止录音时自动提交数据并运行 Interface 函数，而第二个 Component 会在录音期间持续发送数据并运行 Interface 函数。

这是从网络摄像头流式传输图像的示例代码。

import gradio as gr
import numpy as np

def flip(im):
    return np.flipud(im)

demo = gr.Interface(
    flip,
    gr.Image(sources=["webcam"], streaming=True),
    "image",
    live=True
)
demo.launch()

流式处理也可以在输出组件中完成。一个gr.Audio(streaming=True)输出组件可以接收由生成器函数逐段生成的音频数据流，并将它们组合成一个单一的音频文件。有关详细示例，请参阅我们关于使用Gradio进行自动语音识别的指南。