01-初探gradio

1. 构建第一个Gradio应用

1.1 简介

总结一下就是快速开发web页面，快速分享

import gradio as gr

创建一个函数

接下来，创建一个函数，它将作为我们应用的后端。这个函数接收一个字符串输入，并返回一个处理后的字符串。

def greet(name):
    return f'Hello, {name}, Hello world!'

这个函数很简单：它接收一个名字，并返回一条问候语。

创建Gradio界面

现在，我们需要创建一个Gradio界面来与我们的函数互动。Gradio界面由输入和输出组件组成。

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

这里，我们使用gr.Interface创建了一个界面。fn=greet指定了我们刚才定义的函数作为界面的后端。inputs="text"和outputs="text"指定了我们的应用将接受文本输入并返回文本输出。

运行应用

最后一步是运行我们的应用。

iface.launch()

Running on local URL:  http://127.0.0.1:7866

To create a public link, set `share=True` in `launch()`.

如果使用了share=True相当于是用了官方的服务器，public url只保留72小时，当然你可以使用钞能力

# 在需要的时候停止应用
app.close()

请注意，一旦你停止了应用，之前分享的链接将不再可访问。如果你想再次分享，你需要重新启动应用并生成新的链接。

1.2 理解 gr.Interface

要构建一个 Gradio 应用，关键在于理解 gr.Interface 类。这个类专为创建展示机器学习模型的演示而设计，能够处理一个或多个输入，并返回一个或多个输出。

gr.Interface 主要接受三个参数：

• fn：你想为其创建用户界面的函数。函数封装。
• inputs：定义输入的 Gradio 组件，数量应与函数的参数数量相匹配。
• outputs：定义输出的 Gradio 组件，数量应与函数的返回值数量相匹配。

fn 参数非常灵活，你可以传递任何 Python 函数。在上面的例子中，我们用了一个简单的问候函数，但你也可以传递更复杂的函数，如音乐生成器、税务计算器或预训练机器学习模型的预测函数。

输入和输出参数可以接受一个或多个 Gradio 组件。Gradio 提供了超过 30 种内置组件，例如 gr.Textbox()、gr.Image() 和 gr.HTML()，这些组件专为机器学习应用设计。

✍️ 提示：在 inputs 和 outputs 参数中，你可以传递这些组件的名称（如 "textbox"）或类的实例（如 gr.Textbox()）。

如果你的函数接受多个参数或返回多个值，可以分别传递输入和输出组件的列表。这种灵活性使得 gr.Interface 成为创建演示的强大工具。

2. gradio基础组件

Gradio 提供了许多基础组件，用于构建交互式的机器学习模型演示。这些组件分为两大类：输入组件和输出组件。以下是一些常用的基础组件：

输入组件 (Inputs)

• Text: 文本输入框，用于输入文本数据。
• Textarea: 多行文本输入框，适用于较长的文本。
• Number: 数字输入框，用于输入数字。
• Slider: 滑动条，用于选择一个范围内的数字。
• Checkbox: 复选框，用于选择布尔值。
• Radio: 单选按钮，用于从多个选项中选择一个。
• Dropdown: 下拉菜单，用于从多个选项中选择一个。
• Image: 图像上传组件，用于上传和显示图像。
• File: 文件上传组件，用于上传文件。
• Audio: 音频上传组件，用于上传和播放音频文件。
• Video: 视频上传组件，用于上传和播放视频文件。
  输出组件 (Outputs)
• Text: 文本输出框，用于显示文本数据。
• Label: 标签输出，用于显示分类标签和置信度。
• Image: 图像输出框，用于显示图像。
• Audio: 音频输出框，用于播放音频文件。
• Video: 视频输出框，用于播放视频文件。
• Dataframe: 数据帧输出框，用于显示表格数据。
• JSON: JSON输出框，用于显示JSON格式的数据。
• HTML: HTML输出框，用于显示HTML内容。
• Plot: 绘图输出框，用于显示图表和绘图。
  这些组件可以根据需要组合使用，以构建各种交互式应用。你可以根据你的模型和应用场景选择合适的组件来设计界面。

如果不在意界面美化的话（毕竟不是前端）上面的就差不多了，但要美化界面的话就需要前端知识了。

参考文献：

1. 深度之眼AI课程