Gradio从入门到精通（6）---接口类Blocks

前言

Blocks 可以让组件布局更加灵活，在不适用Blocks的情况下，组件的布局是默认的垂直布局。通过gr.Row , gr.Column等控制组件的布局

Blocks 是 Gradio 的低级 API，它允许您创建比 Interfaces 更多的自定义 Web 应用程序和演示（但仍然完全使用 Python）。

与 Interface 类相比，Blocks 提供了更大的灵活性和控制：（1） 组件的布局 （2） 触发函数执行的事件 （3） 数据流（例如，输入可以触发输出，从而触发下一级输出）。Blocks 还提供了将相关演示组合在一起的方法，例如使用选项卡。

Blocks 的基本用法如下：创建一个 Blocks 对象，然后将其用作上下文（使用 “with” 语句），然后在 Blocks 上下文中定义布局、组件或事件。最后，调用 launch（） 方法启动演示。

一、Blocks布局方式

行布局（Row）：用于水平排列组件。
列布局（Column）：用于垂直排列组件。
标签页（Tab）：允许你将界面分割成多个标签页，每个标签页包含独立的组件和布局。

二、方法

launch方法

gradio.Blocks.launch(···)

功能描述
launch()方法的主要功能是启动一个本地服务器，使得用户可以在Web浏览器中查看和交互Gradio应用程序。它提供了多种部署方式，包括本地部署、通过HuggingFace托管、FastAPI挂载以及Gradio-lite浏览器集成。

常用参数

示例代码

import gradio as gr
def reverse(text):
    return text[::-1]
with gr.Blocks() as demo:
    with gr.Row():
        button = gr.Button(value="Reverse")
        button.click(reverse, gr.Textbox(), gr.Textbox())

demo.launch(share=False, auth=("123", "123"))

可以看到使用gr.Row函数将button的和输入框放到了一行，如果使用该函数，则默认是垂直布局

import gradio as gr
def reverse(text):
    return text[::-1]
with gr.Blocks() as demo:
	button = gr.Button(value="Reverse")
    button.click(reverse, gr.Textbox(), gr.Textbox())

demo.launch(share=False, auth=("123", "123"))

queue方法

gradio.Blocks.queue(···)

功能描述
launch()方法的主要功能是通过启用队列，您可以控制用户何时知道自己在队列中的位置，并设置允许的最大事件数限制。

示例代码

with gr.Blocks() as demo:
    button = gr.Button(label="Generate Image")
    button.click(fn=image_generator, inputs=gr.Textbox(), outputs=gr.Image())
demo.queue(max_size=10)
demo.launch()

load方法

gradio.Blocks.load(block, ···)

功能描述
此侦听器在浏览器中最初加载 Blocks 时触发。

unload方法

gradio.Blocks.unload(fn, ···)

功能描述
当用户关闭或刷新选项卡以结束用户会话时，将触发此侦听器。它对于在应用程序关闭时清理资源很有用。

示例代码

import gradio as gr
with gr.Blocks() as demo:
    gr.Markdown("# When you close the tab, hello will be printed to the console")
    demo.unload(lambda: print("hello"))
demo.launch()

总结

Blocks的灵活性意味着你可以创建几乎任何类型的Web界面，但这也需要一定的学习和实践才能熟练掌握。