An example of a default stop button without any extra properties.
using Dash
using DashDaq
external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]
app = dash(external_stylesheets=external_stylesheets)
app.layout = html_div([
daq_stopbutton(
id="my-stop-button",
label="Default",
n_clicks=0
),
html_div(id="stop-button-output")
])
callback!(app,
Output("stop-button-output", "children"),
[Input("my-stop-button", "n_clicks")]) do n_clicks
return "The stop button has been clicked $n_clicks times."
end
run_server(app, "0.0.0.0", debug=true)
Set the label and label position with label
and labelPosition
.
using Dash
using DashDaq
app = dash()
app.layout = daq_stopbutton(
label="Label",
labelPosition="top"
)
run_server(app, "0.0.0.0", debug=true)
Adjust the size (width in pixels) of the stop button with size
.
using Dash
using DashDaq
app = dash()
app.layout = daq_stopbutton(
size=120,
)
run_server(app, "0.0.0.0", debug=true)
Set the text displayed in the button buttonText
.
using Dash
using DashDaq
app = dash()
app.layout = daq_stopbutton(
buttonText="text",
)
run_server(app, "0.0.0.0", debug=true)
Disable the button by setting disabled=true
.
using Dash
using DashDaq
app = dash()
app.layout = daq_stopbutton(
disabled=true,
)
run_server(app, "0.0.0.0", debug=true)
Our recommended IDE for writing Dash apps is Dash Enterprise’s
Data Science Workspaces,
which has typeahead support for Dash Component Properties.
Find out if your company is using
Dash Enterprise.
children
(Array of or a singular dash component, String or Real; optional):
The children of the button.
id
(String; optional):
The ID used to identify this compnent in Dash callbacks.
size
(Real; default 92
):
The size (width) of the stop button in pixels.
buttonText
(String; default 'Stop'
):
Text displayed in the button.
n_clicks
(Real; default 0
):
Number of times the button was clicked.
disabled
(Bool; optional):
If true, button cannot be pressesd.
theme
(Dict; optional):
Theme configuration to be set by a ThemeProvider.
label
(Dict; optional):
Description to be displayed alongside the button. To control styling,
pass an object with label and style properties.
label
is a String | Dict with keys:
label
(String; optional)
style
(Dict; optional)
labelPosition
(a value equal to: ‘top’ or ‘bottom’; default 'top'
):
Where the label is positioned.
className
(String; optional):
Class to apply to the root component element.
style
(Dict; optional):
Style to apply to the root component element.