Gradio

Quando Usar

Use esta habilidade quando precisar criar interfaces web e demonstrações do Gradio em Python. Use ao criar ou editar aplicativos, componentes, ouvintes de eventos, layouts ou chatbots do Gradio.

Gradio é uma biblioteca Python para criar interfaces web interativas e demonstrações de ML. Esta habilidade abrange a API principal, padrões e exemplos.

Guias

Guias detalhados sobre tópicos específicos (leia estes quando forem relevantes):

• Guia Rápido
• A Classe Interface
• Blocks e Ouvintes de Eventos
• Controlando o Layout
• Mais Recursos do Blocks
• CSS e JS Personalizados
• Saídas em Streaming
• Entradas em Streaming
• Compartilhando Seu Aplicativo
• Componentes HTML Personalizados
• Começando com o Cliente Python
• Começando com o Cliente JS

Padrões Principais

Interface (alto nível): envolve uma função com componentes de entrada/saída.

import gradio as gr

def greet(name):
    return f"Hello {name}!"

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

Blocks (baixo nível): layout flexível com conexão explícita de eventos.

import gradio as gr

with gr.Blocks() as demo:
    name = gr.Textbox(label="Name")
    output = gr.Textbox(label="Greeting")
    btn = gr.Button("Greet")
    btn.click(fn=lambda n: f"Hello {n}!", inputs=name, outputs=output)

demo.launch()

ChatInterface: wrapper de alto nível para interfaces de chatbot.

import gradio as gr

def respond(message, history):
    return f"You said: {message}"

gr.ChatInterface(fn=respond).launch()

Assinaturas de Componentes Chave

Textbox(value: str | I18nData | Callable | None = None, type: Literal['text', 'password', 'email'] = "text", lines: int = 1, max_lines: int | None = None, placeholder: str | I18nData | None = None, label: str | I18nData | None = None, info: str | I18nData | None = None, every: Timer | float | None = None, inputs: Component | Sequence[Component] | set[Component] | None = None, show_label: bool | None = None, container: bool = True, scale: int | None = None, min_width: int = 160, interactive: bool | None = None, visible: bool | Literal['hidden'] = True, elem_id: str | None = None, autofocus: bool = False, autoscroll: bool = True, elem_classes: list[str] | str | None = None, render: bool = True, key: int | str | tuple[int | str, ...] | None = None, preserved_by_key: list[str] | str | None = "value", text_align: Literal['left', 'right'] | None = None, rtl: bool = False, buttons: list[Literal['copy'] | Button] | None = None, max_length: int | None = None, submit_btn: str | bool | None = False, stop_btn: str | bool | None = False, html_attributes: InputHTMLAttributes | None = None)

Cria uma área de texto para o usuário inserir entrada de texto ou exibir saída de texto.

Number(value: float | Callable | None = None, label: str | I18nData | None = None, placeholder: str | I18nData | None = None, info: str | I18nData | None = None, every: Timer | float | None = None, inputs: Component | Sequence[Component] | set[Component] | None = None, show_label: bool | None = None, container: bool = True, scale: int | None = None, min_width: int = 160, interactive: bool | None = None, visible: bool | Literal['hidden'] = True, elem_id: str | None = None, elem_classes: list[str] | str | None = None, render: bool = True, key: int | str | tuple[int | str, ...] | None = None, preserved_by_key: list[str] | str | None = "value", buttons: list[Button] | None = None, precision: int | None = None, minimum: float | None = None, maximum: float | None = None, step: float = 1)

Cria um campo numérico para o usuário inserir números como entrada ou exibir saída numérica.

…