Custom Components GalleryNEW
Explore
New to Gradio? Start here: Getting Started
See the Release History
ClearButton
gradio.ClearButton(···)Description
Button that clears the value of a component or a list of components when clicked. It is instantiated with the list of components to clear.
Behavior
As input component: (Rarely used) the str corresponding to the button label when the button is clicked
Your function should accept one of these types:
def predict(
value: str | None
)
...As output component: string corresponding to the button label
Your function should return one of these types:
def predict(···) -> str | None
...
return valueInitialization
| Parameter | Description |
|---|---|
components None | list[Component] | Component default: None | |
value str default: "Clear" | Default text for the button to display. If callable, the function will be called whenever the app loads to set the initial value of the component. |
every float | None default: None | If |
variant Literal[('primary', 'secondary', 'stop')] default: "secondary" | 'primary' for main call-to-action, 'secondary' for a more subdued style, 'stop' for a stop button. |
size Literal[('sm', 'lg')] | None default: None | Size of the button. Can be "sm" or "lg". |
icon str | None default: None | URL or path to the icon file to display within the button. If None, no icon will be displayed. |
link str | None default: None | URL to open when the button is clicked. If None, no link will be used. |
visible bool default: True | If False, component will be hidden. |
interactive bool default: True | If False, the Button will be in a disabled state. |
elem_id str | None default: None | An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles. |
elem_classes list[str] | str | None default: None | An optional list of strings that are assigned as the classes of this component in the HTML DOM. Can be used for targeting CSS styles. |
render bool default: True | If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later. |
key int | str | None default: None | if assigned, will be used to assume identity across a re-render. Components that have the same key across a re-render will have their value preserved. |
scale int | None default: None | relative size compared to adjacent Components. For example if Components A and B are in a Row, and A has scale=2, and B has scale=1, A will be twice as wide as B. Should be an integer. scale applies in Rows, and to top-level Components in Blocks where fill_height=True. |
min_width int | None default: None | minimum pixel width, will wrap if not sufficient screen space to satisfy this value. If a certain scale value results in this Component being narrower than min_width, the min_width parameter will be respected first. |
api_name str | None | Literal['False'] default: None | |
show_api bool default: False |
Shortcuts
| Class | Interface String Shortcut | Initialization |
|---|---|---|
| "clearbutton" | Uses default values |
Event Listeners
Description
Event listeners allow you to capture and 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 ClearButton component supports the following event listeners. Each event listener takes the same parameters, which are listed in the Event Arguments table below.
| Listener | Description |
|---|---|
| Adds a component or list of components to the list of components that will be cleared when the button is clicked. |
| Triggered when the Button is clicked. |
Event Arguments
| Parameter | Description |
|---|---|
components None | Component | list[Component] required |