目錄
>安裝
>輸入和輸出組件
3。提供全面的信息
4。有效地處理大型功能集
5。正確管理環境變量
確保高對比度,為圖像提供ALT文本,並為所有交互式元素啟用鍵盤導航。
13。利用擁抱面數據集
結論和進一步的資源
首頁 科技週邊 人工智慧 在Python中使用Gradio的AI應用程序構建用戶界面

在Python中使用Gradio的AI應用程序構建用戶界面

Mar 05, 2025 am 11:10 AM

>當今AI模型的有用性大大降低了,而無需訪問用戶界面。使用開源Python Web UI庫Gradio,您可以在LLMS和非技術最終用戶之間彌合這一差距。它使您可以為您的AI項目創建快速的原型,並簡化其部署到更廣泛的受眾。

>本教程針對的是機器學習工程師,他們通常沒有任何網絡開發經驗。它涵蓋了Gradio基礎知識和核心概念,各種AI模型類型的接口創建,UX和交互性的高級功能以及部署和共享最佳實踐。

讓我們開始。

開始使用Gradio

>

>安裝

我們將通過創建虛擬環境(最好是conda)開始:

然後,您可以使用pip安裝gradio及其依賴項:>

>我們還安裝了iPykernel軟件包,以便可以在Jupyter筆記本中直接顯示Gradio接口。此過程要求您將創建的虛擬環境添加到Jupyter實驗室中。這是這樣做的命令:
$ conda create -n gradio_tutorial python=3.9 -y
$ conda activate gradio_tutorial
登入後複製
登入後複製
登入後複製
登入後複製

>這應該允許您使用已安裝Gradio的內核創建筆記本。要驗證,以標準別名導入並打印其版本:
$ pip install gradio ipykernel
登入後複製
登入後複製
登入後複製
登入後複製

基本概念和術語

$ ipython kernel install --user --name=gradio_tutorial
$ jupyter lab  # Start the lab
登入後複製
登入後複製
登入後複製
我們將通過“ Hello World”示例來學習其關鍵概念和術語:

import gradio as gr
print(gr.__version__)
4.37.1
登入後複製
登入後複製
>在單元格中運行上述代碼時,輸​​出將是一個返回自定義問候消息的小型交互式界面:

def greet(name):
   return f"Hello, {name}!"
demo = gr.Interface(
   fn=greet,
   inputs=['text'],
   outputs="text",
)
demo.launch()
登入後複製
Gradio圍繞一些關鍵概念旋轉:

在Python中使用Gradio的AI應用程序構建用戶界面接口

:創建UIS的核心類。

    組件
  1. :輸入和輸出元素,例如文本框,圖像和音頻。到目前為止,有30多個內置組件。 >函數
  2. :python函數從輸入組件處理信息,並返回結果以輸出組件顯示。 >
  3. 啟動:啟動您的Gradio應用的方法。
  4. >
  5. 上面的,我們創建了一個迎接文本輸入並返回文本輸入的問候功能。因此,輸入和輸出組件在接口類中指定為文本。 最後,我們調用啟動本地服務器的啟動方法。為了使任何人使用UI,您可以將共享參數設置為true。這將啟動SSH隧道並將Gradio應用程序部署到可公開共享的網頁:>
  6. gradio組件
  7. >您將花費大部分時間在不同的組件上修補不同的組件,以及如何在構建Gradio應用程序時將它們放在頁面上。因此,讓我們仔細看看您可以使用的東西。 >

    >輸入和輸出組件

    Gradio提供了各種各樣的組件,用於構建交互式接口。這些組件通常分為兩類:輸入和輸出。 >>

    >輸入組件允許用戶向基礎處理器提供數據(這可以是任何Python函數)。一些常見的輸入是:

    textbox
    • 圖像
    • 音頻
    • 滑塊
    • >下拉
    • 這是一個虛擬界面,使用上述某些組件:>
    在此示例中,process_inputs函數需要五個參數。因此,我們需要創建五個輸入組件並將其傳遞給輸入。雖然輸入組件的數量應匹配所需功能參數的數量,但這不是嚴格的規則。為避免錯誤和警告,請為不需要UI輸入的參數設置默認值。

    $ conda create -n gradio_tutorial python=3.9 -y
    $ conda activate gradio_tutorial
    登入後複製
    登入後複製
    登入後複製
    登入後複製

    >注意我們如何使用文本框類來指定輸入組件,而不是像第一個示例那樣的普通字符串文本。始終建議使用專用類指定輸入和輸出組件以使其可自定義。例如,所有組件類都有一個有用的標籤屬性,而滑塊和下拉列表都有指定範圍和可用選項的參數。

    > 在Python中使用Gradio的AI應用程序構建用戶界面>許多輸入組件也可用於顯示輸出。以下是一些常見的情況:

    標籤:用於顯示文本或分類結果

    圖像:用於顯示已處理或生成的圖像
    • >音頻:用於播放處理或生成的音頻
    • 繪圖:用於顯示圖形或圖表
    • >
    • 喜歡輸入,輸出組件的數量必須匹配從處理函數中返回值的數量。
    • >自定義組件外觀

    Gradio允許您自定義組件的外觀以適應您的需求。這是一個使用自定義文本框的示例:

    >

    $ pip install gradio ipykernel
    登入後複製
    登入後複製
    登入後複製
    登入後複製
    在此示例中,我們通過指定行數,添加佔位符和信息文本,並包括輸出的副本按鈕來自定義文本框組件。 >

    >實驗不同的組件及其屬性,以創建最適合您AI應用程序要求的接口。要了解可以更改組件的哪種屬性,您可以訪問其文檔,或者更好的是使用? jupyter實驗室的班級名稱之後:在Python中使用Gradio的AI應用程序構建用戶界面

    > llms

    的構建界面

    >讓我們通過創建由LLMS供電的兩個現實世界文本和基於圖像的界面來將所有學到的一切放在一起。

    首先,我們將構建從英語到土耳其語,西班牙語或中文的語言翻譯:

    $ conda create -n gradio_tutorial python=3.9 -y
    $ conda activate gradio_tutorial
    登入後複製
    登入後複製
    登入後複製
    登入後複製
    最初,我們定義一個translate_text函數。在其體內,我們設置了OpenAI API鍵並創建語言圖。然後,我們構建了翻譯的提示。然後,在一個try-except塊中,我們使用系統提示符將請求發送到聊天的端點。最後,我們返回首選。

    現在,我們可以構建接口:>

    代碼很簡單,就像早期接口的代碼一樣,但是我們介紹了幾個新屬性:
    $ pip install gradio ipykernel
    登入後複製
    登入後複製
    登入後複製
    登入後複製

    >文本框的類型參數將普通文本輸入字段更改為密碼輸入,隱藏文本。
    • >標題和描述界麵類的參數在頁面的頂部中心添加了H1標題和字幕。
    • 這是結果:

    在Python中使用Gradio的AI應用程序構建用戶界面>您可能想知道為什麼我們要詢問用戶的API密鑰作為應用程序的一部分,而不是自己提供。原因與Gradio如何部署UI有關。

    如果我們提供了自己的API密鑰作為環境變量(這是標準實踐),則公開共享的應用程序版本將無法使用,因為它無法訪問我們的環境變量。在部署部分中,我們將通過將應用程序部署到擁抱面空間來查看如何解決此問題。

    >讓我們構建另一個用戶界面以生成圖像:

    我們創建一個名為generate_surrealist_art的函數,該函數將請求發送到dall-e-3,並使用超現實主義提示返回生成的圖像URL。然後,我們將再次將此函數饋送到接口類中:

    >
    $ ipython kernel install --user --name=gradio_tutorial
    $ jupyter lab  # Start the lab
    登入後複製
    登入後複製
    登入後複製

    >我們為API密鑰指定了兩個輸入,以及要在超現實主義圖像中捕獲的概念。然後,我們使用圖像類創建一個生成圖像的輸出組件。如果將其值參數設置為str,則組件可以從URL下載和顯示圖像,這正是我們需要的。

    import gradio as gr
    print(gr.__version__)
    4.37.1
    登入後複製
    登入後複製
    ,這是結果:

    >構建經典ML模型的界面在Python中使用Gradio的AI應用程序構建用戶界面 現在,讓我們為經典表格回歸模型構建一個接口。我們將使用鑽石數據集,該數據集可在Seaborn中使用。

    首先創建一個新的工作目錄和一個名為app.py的新腳本。然後,將加載數據加載的GitHub Gist的代碼粘貼,使用Scikit-Learn管道處理並訓練RandomForestRegress模型。

    下一步是創建一個處理功能,該功能接受與鑽石數據集中有功能相同數量的輸入:

    $ conda create -n gradio_tutorial python=3.9 -y
    $ conda activate gradio_tutorial
    登入後複製
    登入後複製
    登入後複製
    登入後複製

    >該函數將這些輸入轉換為數據框,並將其傳遞到訓練有素的模型管道的.predict()方法。最後,它返回一個帶有預測價格的字符串。

    現在,接口類必須匹配此函數的簽名:用於處理功能的九個輸入組件和一個用於顯示預測價格的輸出:

    $ pip install gradio ipykernel
    登入後複製
    登入後複製
    登入後複製
    登入後複製

    在班級內,我們為分類功能創建了三個下拉列表。每個功能中的唯一類別都填充了這些選項。我們還創建了六個滑塊組件以接受數字功能。滑塊的範圍取決於每個特徵的最小值和最大值。

    >我們現在要做的就是執行腳本以運行和部署應用程序:>

    這是結果:
    $ ipython kernel install --user --name=gradio_tutorial
    $ jupyter lab  # Start the lab
    登入後複製
    登入後複製
    登入後複製

    在Python中使用Gradio的AI應用程序構建用戶界面>有關最佳實踐和優化提示,請跳至下面的最佳實踐部分。

    >部署Gradio應用

    >我們已經看到通過啟用一個參數來部署Gradio應用程序的容易。當然,這種方法的缺點是演示可以在72小時內到期。因此,推薦的部署Gradio的方法是通過擁抱面空間。 Huggingface於2021年獲得了Gradio,使兩個平台之間的集成無縫。 因此,對於本教程或您使用Gradio創建的任何未來應用程序,請在huggingface.co上註冊一個免費帳戶,然後導航到設置>代幣生成訪問令牌:

    >

    令牌僅顯示一次,因此請確保將其存儲在安全的地方。

    >使用此令牌,您可以在空間上永久託管時盡可能多地部署想要的級別應用程序。例如,我們將從上一節中部署鑽石價格預測模型,您會發現它非常容易。

    > 在Python中使用Gradio的AI應用程序構建用戶界面您所要做的就是使用UI腳本導航到目錄,並在終端上調用Gradio部署:>

    >終端使您通過將腳本轉換為功能正常的擁抱面空間。它要求諸如:

    之類的詳細信息

    您生成的訪問令牌

    在Python中使用Gradio的AI應用程序構建用戶界面>空間標題:這將是部署後空間URL的一部分

    包含gradio ui代碼(app.py默認值)的腳本的名稱

    >
      >空間的硬件;空白以使用CPU(免費)
    • 任何腳本使用的任何環境變量(這是您安全存儲API密鑰和用戶秘密的位置)
    • >
    • 依賴項 - 通過按Enter 一個一個一個接一個地輸入
    • >終端為您提供了部署的空間鏈接。這是它的外觀:
    • 關於這種部署方法的另一個好處是,Gradio會自動將演示轉換為工作的REST API。訪問和查詢的說明始終位於底部:

      >

      在Python中使用Gradio的AI應用程序構建用戶界面

      因此,一口氣,您既有用於非技術用戶申請的永久UI託管,又有為同事和開發人員朋友的REST API。

      >有關更多部署和共享選項,例如將演示嵌入網頁中,將Google Authentication添加到應用程序等,請訪問Gradio文檔的“共享您的應用程序”部分。

      gradio最佳實踐和技巧

      >

      在使用Gradio開髮用戶界面時,遵循最佳實踐可以顯著提高應用程序的用戶體驗和可維護性。以下是一些關鍵建議:

      1。將腳本用於組織和可維護性

      >

      >在Python腳本中組織Gradio應用程序,以進行更好的版本控制,協作和部署。

      >

      2。優化組件的空間分配

      >使用適當的尺寸和佈局工具(例如,gr.column(),gr.row())來確保平衡,響應式接口。

      3。提供全面的信息

      >利用“信息”和“標籤”屬性為每個組件提供清晰的說明和上下文。

      4。有效地處理大型功能集

      對於具有多個功能的模型,請使用文件輸入(CSV,JSON)啟用批處理預測並簡化接口。

      5。正確管理環境變量

      >使用python-dotenv進行本地開發,並將變量設置在擁抱面部空間以進行部署。

      6。實施錯誤處理和驗證

      >驗證輸入,提供明確的錯誤消息,並使用Try-Except塊進行正式錯誤處理。

      7。優化性能

      >實現緩存,大型型號的懶惰加載,並使用Gr.LoadingStatus()進行長期運行的任務。

      8。可訪問性的設計

      確保高對比度,為圖像提供ALT文本,並為所有交互式元素啟用鍵盤導航。

      9。實施漸進披露

      >使用手風琴或選項卡來組織複雜的接口,根據需要揭示高級選項。 >

      10。定期更新並維護

      >保持依賴關係更新,監視錯誤並根據用戶反饋不斷改進。

      11。利用擁抱面資源

      >利用擁抱面工具和資源與Gradio無縫集成,包括模型存儲庫和數據集。

      12。在擁抱面樞紐

      上託管大型型號

      >對於大型表格模型,上傳到擁抱面式集線器並直接在Gradio腳本中加載,以提高性能並減少本地存儲要求。

      13。利用擁抱面數據集

      對於大型數據集,上傳到HuggingFace Hub,然後直接在您的Gradio應用程序中訪問它們以簡化數據管理並改善加載時間。

      結論和進一步的資源

      在本文中,我們了解了使用Gradio為AI應用程序構建用戶界面的基礎知識。我們剛剛在表面下方傾斜,因為Gradio為構建複雜界面提供了更多功能。例如,接口狀態允許您的應用程序記住從一個函數調用到另一個函數的輸出。用戶輸入更改後,反應性接口會動態更改UI。使用塊,您可以構建具有自定義佈局和設計的應用程序。

      同樣,請查看這些相關資源以獲取更多內容:

      10個python軟件包添加到您的數據科學堆棧
      • 7個基本的生成AI工具,用於構建出色的AI應用程序
      • 5個項目,您可以使用Gen AI模型
      • 構建
      • CI/CD用於機器學習課程

以上是在Python中使用Gradio的AI應用程序構建用戶界面的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1657
14
CakePHP 教程
1415
52
Laravel 教程
1309
25
PHP教程
1257
29
C# 教程
1230
24
開始使用Meta Llama 3.2 -Analytics Vidhya 開始使用Meta Llama 3.2 -Analytics Vidhya Apr 11, 2025 pm 12:04 PM

Meta的Llama 3.2:多模式和移動AI的飛躍 Meta最近公佈了Llama 3.2,這是AI的重大進步,具有強大的視覺功能和針對移動設備優化的輕量級文本模型。 以成功為基礎

10個生成AI編碼擴展,在VS代碼中,您必須探索 10個生成AI編碼擴展,在VS代碼中,您必須探索 Apr 13, 2025 am 01:14 AM

嘿,編碼忍者!您當天計劃哪些與編碼有關的任務?在您進一步研究此博客之前,我希望您考慮所有與編碼相關的困境,這是將其列出的。 完畢? - 讓&#8217

AV字節:Meta' llama 3.2,Google的雙子座1.5等 AV字節:Meta' llama 3.2,Google的雙子座1.5等 Apr 11, 2025 pm 12:01 PM

本週的AI景觀:進步,道德考慮和監管辯論的旋風。 OpenAI,Google,Meta和Microsoft等主要參與者已經釋放了一系列更新,從開創性的新車型到LE的關鍵轉變

向員工出售AI策略:Shopify首席執行官的宣言 向員工出售AI策略:Shopify首席執行官的宣言 Apr 10, 2025 am 11:19 AM

Shopify首席執行官TobiLütke最近的備忘錄大膽地宣布AI對每位員工的基本期望是公司內部的重大文化轉變。 這不是短暫的趨勢。這是整合到P中的新操作範式

視覺語言模型(VLMS)的綜合指南 視覺語言模型(VLMS)的綜合指南 Apr 12, 2025 am 11:58 AM

介紹 想像一下,穿過​​美術館,周圍是生動的繪畫和雕塑。現在,如果您可以向每一部分提出一個問題並獲得有意義的答案,該怎麼辦?您可能會問:“您在講什麼故事?

GPT-4O vs OpenAI O1:新的Openai模型值得炒作嗎? GPT-4O vs OpenAI O1:新的Openai模型值得炒作嗎? Apr 13, 2025 am 10:18 AM

介紹 Openai已根據備受期待的“草莓”建築發布了其新模型。這種稱為O1的創新模型增強了推理能力,使其可以通過問題進行思考

如何在SQL中添加列? - 分析Vidhya 如何在SQL中添加列? - 分析Vidhya Apr 17, 2025 am 11:43 AM

SQL的Alter表語句:動態地將列添加到數據庫 在數據管理中,SQL的適應性至關重要。 需要即時調整數據庫結構嗎? Alter表語句是您的解決方案。本指南的詳細信息添加了Colu

最新的最佳及時工程技術的年度彙編 最新的最佳及時工程技術的年度彙編 Apr 10, 2025 am 11:22 AM

對於那些可能是我專欄新手的人,我廣泛探討了AI的最新進展,包括體現AI,AI推理,AI中的高科技突破,及時的工程,AI培訓,AI,AI RE RE等主題

See all articles