”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 如何使用 Gradio 制作一个很酷的应用程序!

如何使用 Gradio 制作一个很酷的应用程序!

发布于2024-11-02
浏览:944

How to Make a Cool App with Gradio!

嘿,我的程序员们!我带着与平常不同的内容回来了。今天我们要学习Gradio!制作帮助人们与计算机对话的应用程序就像魔法一样。

现在您可能在想这个渐变是什么?

什么是Gradio?

将 gradio 想象成制作应用程序的魔杖。想象一下,你有一个宠物机器人,你想问它问题或给它看图片,它就会回答你! Gradio 帮助您构建一个界面,您可以在其中输入内容或给出图片,并且计算机可以响应它。

您无需了解很多有关编码的知识即可开始。它非常基本且易于使用。让我们看看如何使用它!

第 1 步:设置音阶

开始之前,我们需要告诉计算机安装Gradio。

  1. 打开您的终端。

  2. 在终端中输入:

pip 安装渐变[&​​&&]

此命令将帮助您安装 gradio 并为您进行设置。 现在您已准备好创建应用程序了!

第 2 步:创建一个超级简单的应用程序

让我们制作我们的第一个应用程序!在此应用程序中,计算机会询问您的姓名,然后计算机会向您问好。听起来很有趣吧?

编写此代码:

将渐变导入为 gr

def 问候(姓名):

返回“你好,”名字“!”

iface = gr.Interface(fn=greet, 输入=“文本”, 输出=“文本”)

iface.launch()

现在您一定在想这段代码中发生了什么,让我们来分解一下:

  1. import gradio as gr:这就像说计算机使用gradio来制作应用程序。

  2. defgreet(name):这是询问您姓名的函数,并将返回您的 Hello 和您的姓名。

  3. iface = gr.Interface(fn=greet,inputs="text",outputs="text"):这部分告诉 gradio 如何构建应用程序。它将接受一些文本作为输入并返回文本作为输出。

  4. iface.launch():这有助于我们启动应用程序。

现在运行您的代码,您将看到一个可以在其中写下您的名字的框,计算机将向您打招呼。是不是很酷,尝试输入你的名字。

第三步:用图片让它变得更有趣!

让我们通过添加图片让应用程序变得更酷!在此,我们将向计算机显示一些图片并告诉计算机识别它。

我们将使用已经知道许多动物长什么样的机器学习模型。

写下这段代码:

将渐变导入为 gr

从tensorflow.keras.applications.resnet50导入ResNet50,decode_predictions,preprocess_input
从tensorflow.keras.preprocessing导入图像
将 numpy 导入为 np

模型 = ResNet50(weights="imagenet")

defclassify_image(img):

img = image.img_to_array(img)
img = np.expand_dims(img, 轴=0)
img = preprocess_input(img)
preds = model.predict(img)
返回解码预测(preds,top=1)[0][0][1]

iface = gr.Interface(fn=classify_image, 输入=“图像”, 输出=“标签”)

iface.launch()

让我们分解这段代码,以更好地理解其功能:

  1. 加载模型:我们正在上传ResNet50作为我们计算机的大脑,这有助于计算机猜测你的图片中的内容。

  2. classify_image: 该函数获取图像并猜测它看到的内容。

  3. inputs="image": 现在我们的应用程序要求输入图片而不是文本。

现在您可以运行代码,上传图片并让计算机猜测。您可以上传其中的任何内容。

第 4 步:与朋友分享您的应用程序!

现在您已经制作了一个很酷的应用程序,现在让我们与您的网络和朋友分享它。 Gradio 为您提供了一个可以与世界上任何人分享的特殊链接,使这一切变得超级简单!

具体操作方法如下:

将代码的最后部分更改为:

iface.launch(share=True)

当您运行此代码时,Gradio 将为您提供一个链接,您可以将其发送给您的朋友。他们可以在浏览器中打开链接并使用您的应用程序,就像您一样!

第五步:添加更多有趣的功能

您可以按照您想要的方式自定义您的渐变应用程序,让我们看看一些让您的应用程序更有趣的方法:

  1. 更改标题和描述
您可以为您的应用提供良好的标题和描述,以使其更具交互性。

iface = gr.Interface(

fn=分类图像,
输入=“图像”,
输出=“标签”,
title="动物分类器",
描述=“上传图片,我猜猜是什么动物!”
)
iface.launch()

现在您的应用程序看起来更酷了,它现在有名称和描述,这使它看起来更专业。

2.

使用更多输入和输出

如果你想给计算机更多信息怎么办?也许您想向其显示图片并输入一些文本,Gradio 也可以处理!

以下是如何制作一个同时使用图像和文本作为输入的应用程序:

iface = gr.Interface(

fn=分类图像,
输入=[“图像”,“文本”],
输出=“标签”
)
iface.launch()

现在您的应用程序将同时获取图像和一些文本。就像您的计算机变得更聪明一样!

结论

哇!您刚刚学习了如何使用 Gradio 制作炫酷的应用程序!您可以使用它制作很多应用程序,它使编码变得非常有趣。您可以在这里探索更多相关信息。

我希望您喜欢这个博客,如果您喜欢,请不要忘记在 Linkedin 和 Github 上关注我。来吧,我也值得一些名气,如果你不这样做,请在评论中批评我。

快乐编码!!

版本声明 本文转载于:https://dev.to/abhinav_yadav_554cab962bb/how-to-make-a-cool-app-with-gradio-3kgl?1如有侵犯,请联系[email protected]删除
最新教程 更多>
  • 如何克服PHP的功能重新定义限制?
    如何克服PHP的功能重新定义限制?
    克服PHP的函数重新定义限制在PHP中,多次定义一个相同名称的函数是一个no-no。尝试这样做,如提供的代码段所示,将导致可怕的“不能重新列出”错误。 但是,PHP工具腰带中有一个隐藏的宝石:runkit扩展。它使您能够灵活地重新定义函数。 runkit_function_renction_re...
    编程 发布于2025-03-15
  • 为什么我会收到MySQL错误#1089:错误的前缀密钥?
    为什么我会收到MySQL错误#1089:错误的前缀密钥?
    mySQL错误#1089:错误的前缀键错误descript [#1089-不正确的前缀键在尝试在表中创建一个prefix键时会出现。前缀键旨在索引字符串列的特定前缀长度长度,可以更快地搜索这些前缀。了解prefix keys `这将在整个Movie_ID列上创建标准主键。主密钥对于唯一识别...
    编程 发布于2025-03-15
  • 如何使用PHP将斑点(图像)正确插入MySQL?
    如何使用PHP将斑点(图像)正确插入MySQL?
    essue VALUES('$this->image_id','file_get_contents($tmp_image)')";This code builds a string in PHP, but the function call ...
    编程 发布于2025-03-15
  • 哪种方法更有效地用于点 - 填点检测:射线跟踪或matplotlib \的路径contains_points?
    哪种方法更有效地用于点 - 填点检测:射线跟踪或matplotlib \的路径contains_points?
    在Python Matplotlib's path.contains_points FunctionMatplotlib's path.contains_points function employs a path object to represent the polygon.它...
    编程 发布于2025-03-15
  • 为什么Microsoft Visual C ++无法正确实现两台模板的实例?
    为什么Microsoft Visual C ++无法正确实现两台模板的实例?
    在Microsoft Visual C 中,Microsoft consions用户strate strate strate strate strate strate strate strate strate strate strate strate strate strate strate st...
    编程 发布于2025-03-15
  • 如何为PostgreSQL中的每个唯一标识符有效地检索最后一行?
    如何为PostgreSQL中的每个唯一标识符有效地检索最后一行?
    postgresql:为每个唯一标识符在postgresql中提取最后一行,您可能需要遇到与数据集合中每个不同标识的信息相关的信息。考虑以下数据:[ 1 2014-02-01 kjkj 在数据集中的每个唯一ID中检索最后一行的信息,您可以在操作员上使用Postgres的有效效率: id dat...
    编程 发布于2025-03-15
  • PHP阵列键值异常:了解07和08的好奇情况
    PHP阵列键值异常:了解07和08的好奇情况
    PHP数组键值问题,使用07&08 在给定数月的数组中,键值07和08呈现令人困惑的行为时,就会出现一个不寻常的问题。运行print_r($月份)返回意外结果:键“ 07”丢失,而键“ 08”分配给了9月的值。此问题源于PHP对领先零的解释。当一个数字带有0(例如07或08)的前缀时,PHP将...
    编程 发布于2025-03-15
  • 为什么使用固定定位时,为什么具有100%网格板柱的网格超越身体?
    为什么使用固定定位时,为什么具有100%网格板柱的网格超越身体?
    网格超过身体,用100%grid-template-columns 为什么在grid-template-colms中具有100%的显示器,当位置设置为设置的位置时,grid-template-colly修复了?问题: 考虑以下CSS和html: class =“ snippet-code”> g...
    编程 发布于2025-03-15
  • 如何从Python中的字符串中删除表情符号:固定常见错误的初学者指南?
    如何从Python中的字符串中删除表情符号:固定常见错误的初学者指南?
    从python import codecs import codecs import codecs 导入 text = codecs.decode('这狗\ u0001f602'.encode('utf-8'),'utf-8') 印刷(文字)#带有...
    编程 发布于2025-03-15
  • 如何从Google API中检索最新的jQuery库?
    如何从Google API中检索最新的jQuery库?
    从Google APIS 问题中提供的jQuery URL是版本1.2.6。对于检索最新版本,以前有一种使用特定版本编号的替代方法,它是使用以下语法:获取最新版本:未压缩)While these legacy URLs still remain in use, it is recommended ...
    编程 发布于2025-03-15
  • 如何检查对象是否具有Python中的特定属性?
    如何检查对象是否具有Python中的特定属性?
    方法来确定对象属性存在寻求一种方法来验证对象中特定属性的存在。考虑以下示例,其中尝试访问不确定属性会引起错误: >>> a = someClass() >>> A.property Trackback(最近的最新电话): 文件“ ”,第1行, AttributeError: SomeClass...
    编程 发布于2025-03-15
  • 如何从PHP中的数组中提取随机元素?
    如何从PHP中的数组中提取随机元素?
    从阵列中的随机选择,可以轻松从数组中获取随机项目。考虑以下数组:; 从此数组中检索一个随机项目,利用array_rand( array_rand()函数从数组返回一个随机键。通过将$项目数组索引使用此键,我们可以从数组中访问一个随机元素。这种方法为选择随机项目提供了一种直接且可靠的方法。
    编程 发布于2025-03-15
  • 如何使用组在MySQL中旋转数据?
    如何使用组在MySQL中旋转数据?
    在关系数据库中使用mySQL组使用mySQL组进行查询结果,在关系数据库中使用MySQL组,转移数据的数据是指重新排列的行和列的重排以增强数据可视化。在这里,我们面对一个共同的挑战:使用组的组将数据从基于行的基于列的转换为基于列。 Let's consider the following ...
    编程 发布于2025-03-15
  • 如何在Java字符串中有效替换多个子字符串?
    如何在Java字符串中有效替换多个子字符串?
    在java 中有效地替换多个substring,需要在需要替换一个字符串中的多个substring的情况下,很容易求助于重复应用字符串的刺激力量。 However, this can be inefficient for large strings or when working with nu...
    编程 发布于2025-03-15
  • 对象拟合:IE和Edge中的封面失败,如何修复?
    对象拟合:IE和Edge中的封面失败,如何修复?
    To resolve this issue, we employ a clever CSS solution that solves the problem:position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%)...
    编程 发布于2025-03-15

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3