Introducing Gradio Clients


New to Gradio? Start here: Getting Started

See the Release History


import gradio as gr with gr.Blocks() as demo: gr.MultimodalTextbox(interactive=True) demo.launch()


Creates a textarea for users to enter string input or display string output and also allows for the uploading of multimedia files.


As input component: Passes text value and list of file(s) as a dict into the function.

Your function should accept one of these types:
def predict(
	value: MultimodalValue | None

As output component: Expects a dict with "text" and "files", both optional. The files array is a list of file paths or URLs.

Your function should return one of these types:
def predict(···) -> MultimodalValue | None
	return value




Class Interface String Shortcut Initialization



Uses default values


import gradio as gr import os import as px # Chatbot demo with multimodal input (text, markdown, LaTeX, code blocks, image, audio, & video). Plus shows support for streaming text. def random_plot(): df = fig = px.scatter(df, x="sepal_width", y="sepal_length", color="species", size='petal_length', hover_data=['petal_width']) return fig def print_like_dislike(x: gr.LikeData): print(x.index, x.value, x.liked) def add_message(history, message): for x in message["files"]: history.append(((x,), None)) if message["text"] is not None: history.append((message["text"], None)) return history, gr.MultimodalTextbox(value=None, interactive=False) def bot(history): history[-1][1] = "Cool!" return history fig = random_plot() with gr.Blocks(fill_height=True) as demo: chatbot = gr.Chatbot( elem_id="chatbot", bubble_full_width=False, scale=1, ) chat_input = gr.MultimodalTextbox(interactive=True, file_count="multiple", placeholder="Enter message or upload file...", show_label=False) chat_msg = chat_input.submit(add_message, [chatbot, chat_input], [chatbot, chat_input]) bot_msg = chat_msg.then(bot, chatbot, chatbot, api_name="bot_response") bot_msg.then(lambda: gr.MultimodalTextbox(interactive=True), None, [chat_input]), None, None) demo.queue() if __name__ == "__main__": demo.launch()

Event Listeners


Event listeners allow you to respond to user interactions with the UI components you've defined in a Gradio Blocks app. When a user interacts with an element, such as changing a slider value or uploading an image, a function is called.

Supported Event Listeners

The MultimodalTextbox component supports the following event listeners. Each event listener takes the same parameters, which are listed in the Event Parameters table below.

Listener Description

MultimodalTextbox.change(fn, ···)

Triggered when the value of the MultimodalTextbox changes either because of user input (e.g. a user types in a textbox) OR because of a function update (e.g. an image receives a value from the output of an event trigger). See .input() for a listener that is only triggered by user input.

MultimodalTextbox.input(fn, ···)

This listener is triggered when the user changes the value of the MultimodalTextbox., ···)

Event listener for when the user selects or deselects the MultimodalTextbox. Uses event data gradio.SelectData to carry value referring to the label of the MultimodalTextbox, and selected to refer to state of the MultimodalTextbox. See EventData documentation on how to use this event data

MultimodalTextbox.submit(fn, ···)

This listener is triggered when the user presses the Enter key while the MultimodalTextbox is focused.

MultimodalTextbox.focus(fn, ···)

This listener is triggered when the MultimodalTextbox is focused.

MultimodalTextbox.blur(fn, ···)

This listener is triggered when the MultimodalTextbox is unfocused/blurred.

Event Parameters