콘텐츠로 이동

Gradio 기초

Gradio 활용 예시 (허깅페이스)

Gradio의 용도

  • 제일 간단한 웹 UI (왕초보자용)
  • AI 모델을 웹 UI로 간단하게 사용할 수 있게 해 주는 라이브러리
  • 간단한 업무도 Gradio로 만들 수 있음

Gradio 문서 정보

필요한 모듈 설치

!pip install gradio

Gradio Class (UI를 만드는 기본 템플릿 4가지)

  • gr.Interface - 가장 쉬운 템플릿
  • gr.Blocks - 용도가 다양한 쓸모있는 템플릿
  • gr.ChatInterface - 챗봇 전용 템플릿
  • gr.TabbedInterface - 여러 탭 페이지를 만드는 템플릿

Gradio 컴포넌트 - 템플릿 안에서 사용하는 UI 세부 기능

AnnotatedImage Audio BrowserState Button
Chatbot Checkbox CheckboxGroup ClearButton
Code ColorPicker Dataframe Dataset
DateTime DownloadButton Dropdown DuplicateButton
File FileExplorer Gallery HighlightedText
HTML Image ImageEditor JSON
Label LoginButton Markdown Model3D
MultimodalTextbox BarPlot LinePlot ScatterPlot
Number ParamViewer Plot Radio
Slider State Textbox Timer
UploadButton Video SimpleImage

Interface를 활용한 가장 간단한 예제 - 가장 쉬운 템플릿

import gradio as gr

def greet(name):
    return "Hello, " + name + "!"

demo = gr.Interface(
    fn=greet,
    inputs=["text"],
    outputs=["text"],
)

demo.launch()

Blocks을 활용한 가장 간단한 예제 - 용도가 다양한 쓸모있는 템플릿

import gradio as gr

with gr.Blocks() as myApp:
    gr.Label("Hello World!")

myApp.launch()

ChatInterface를 활용한 가장 간단한 예제 - 챗봇 전용 템플릿

import gradio as gr

def echo(message, history):
    return message

demo = gr.ChatInterface(fn=echo, type="messages", title="Echo Bot")
demo.launch()

TabbedInterface를 활용한 가장 간단한 예제 - 여러 탭 페이지를 만드는 템플릿

import gradio as gr

tab1 = gr.Blocks()  # 첫 번째 탭의 gr.Blocks 인스턴스
with tab1:
    text_input1 = gr.Textbox(label="텍스트 입력 (탭 1)")


tab2 = gr.Blocks()  # 두 번째 탭의 gr.Blocks 인스턴스
with tab2:
    text_input2 = gr.Textbox(label="텍스트 입력 (탭 2)")

# TabbedInterface 정의
interface = gr.TabbedInterface(
    [tab1, tab2],  # 탭에 넣을 gr.Blocks 인스턴스 목록
    ["Tab1", "Tab2"]  # 탭 이름
)

# 인터페이스 실행
interface.launch()