Custom Components GalleryNEW
Explore
New to Gradio? Start here: Getting Started
See the Release History
ClearButton %20Copyright%202022%20Fonticons,%20Inc.%20--%3e%3cpath%20d='M172.5%20131.1C228.1%2075.51%20320.5%2075.51%20376.1%20131.1C426.1%20181.1%20433.5%20260.8%20392.4%20318.3L391.3%20319.9C381%20334.2%20361%20337.6%20346.7%20327.3C332.3%20317%20328.9%20297%20339.2%20282.7L340.3%20281.1C363.2%20249%20359.6%20205.1%20331.7%20177.2C300.3%20145.8%20249.2%20145.8%20217.7%20177.2L105.5%20289.5C73.99%20320.1%2073.99%20372%20105.5%20403.5C133.3%20431.4%20177.3%20435%20209.3%20412.1L210.9%20410.1C225.3%20400.7%20245.3%20404%20255.5%20418.4C265.8%20432.8%20262.5%20452.8%20248.1%20463.1L246.5%20464.2C188.1%20505.3%20110.2%20498.7%2060.21%20448.8C3.741%20392.3%203.741%20300.7%2060.21%20244.3L172.5%20131.1zM467.5%20380C411%20436.5%20319.5%20436.5%20263%20380C213%20330%20206.5%20251.2%20247.6%20193.7L248.7%20192.1C258.1%20177.8%20278.1%20174.4%20293.3%20184.7C307.7%20194.1%20311.1%20214.1%20300.8%20229.3L299.7%20230.9C276.8%20262.1%20280.4%20306.9%20308.3%20334.8C339.7%20366.2%20390.8%20366.2%20422.3%20334.8L534.5%20222.5C566%20191%20566%20139.1%20534.5%20108.5C506.7%2080.63%20462.7%2076.99%20430.7%2099.9L429.1%20101C414.7%20111.3%20394.7%20107.1%20384.5%2093.58C374.2%2079.2%20377.5%2059.21%20391.9%2048.94L393.5%2047.82C451%206.731%20529.8%2013.25%20579.8%2063.24C636.3%20119.7%20636.3%20211.3%20579.8%20267.7L467.5%20380z'/%3e%3c/svg%3e)
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. |
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 |