How to horizontally center a button in manipulate?
Another way is to use Grid
for complex layouts. One drawback is that Delimiter
does not work as in the original Manipulate
, the advantage is that you can use all styling options available to Grid
, plus you don´t have to fiddle with discrete ImageSize
values etc.:
Manipulate[
ParametricPlot[{y t^3 - u, x t^2 + z}, {t, -10, 10},
PlotRange -> {{-1.5, 2.5}, {0, 5}}, AspectRatio -> 1, Frame -> True,
Axes -> True, AxesOrigin -> {0, 1}, GridLines -> Automatic,
ImageSize -> 600],
Grid[{{Control@{{x, 1, "x"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{y, 1, "y"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{z, 1, "z"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{u, 0, "u"}, -2, 2, 0.01,
ImageSize -> Large}}, {Button[
"Button", {x = 1, y = 1, z = 1, u = 0},
Appearance -> "Palette"]}}], ControlPlacement -> Bottom]
If you want the whole control block centered, this is easily added by applying an additional Pane
:
Manipulate[
ParametricPlot[{y t^3 - u, x t^2 + z}, {t, -10, 10},
PlotRange -> {{-1.5, 2.5}, {0, 5}}, AspectRatio -> 1, Frame -> True,
Axes -> True, AxesOrigin -> {0, 1}, GridLines -> Automatic,
ImageSize -> {1000, 300}],
Pane[Grid[{{Control@{{x, 1, "x"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{y, 1, "y"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{z, 1, "z"}, 0, 5, 0.01,
ImageSize -> Large}}, {Control@{{u, 0, "u"}, -2, 2, 0.01,
ImageSize -> Large}}, {Button[
"Button", {x = 1, y = 1, z = 1, u = 0}, Appearance -> "Palette",
ImageSize -> Medium]}}], ImageSize -> 1000,
Alignment -> {Center, Center}], ControlPlacement -> Bottom]
Place the Button
in a Row
. Using the dimensions that you have given of 600
for the plot and 256
for the Button
you would want the spacing to be the difference divided by two. You can adjust the spacing to your liking if it doesn't match your expectations.
Manipulate[
ParametricPlot[{y t^3 - u, x t^2 + z}, {t, -10, 10},
PlotRange -> {{-1.5, 2.5}, {0, 5}}, AspectRatio -> 1, Frame -> True,
Axes -> True, AxesOrigin -> {0, 1}, GridLines -> Automatic,
ImageSize -> 600],
{{x, 1, "x"}, 0, 5, 0.01, ImageSize -> Large},
{{y, 1, "y"}, 0, 5, 0.01, ImageSize -> Large},
{{z, 1, "z"}, 0, 5, 0.01, ImageSize -> Large},
{{u, 0, "u"}, -2, 2, 0.01, ImageSize -> Large},
Delimiter,
Row[{
Spacer[(600 - 256)/2],
Button["Button", {x = 1, y = 1, z = 1, u = 0},
Appearance -> "Palette", ImageSize -> {256, 28}]
}],
ControlPlacement -> Bottom]
Update - Center all in Manipulate Window
In order to center the controls and the Button
in the whole Manipulate
window, place all of the controls in a centered column inside the Row
. Set the Alignment
of the column to center.
When placed inside a Row
, Grid
or Column
one has to explicitly wrap the control with Control
(see below).
Also one would have to build their own delimiter.
Manipulate[
ParametricPlot[{y t^3 - u, x t^2 + z}, {t, -10, 10},
PlotRange -> {{-1.5, 2.5}, {0, 5}},
AspectRatio -> 1, Frame -> True, Axes -> True, AxesOrigin -> {0, 1},
GridLines -> Automatic, ImageSize -> 600],
Row[{
Spacer[(600 - 256)/2],
Column[{
Control[{{x, 1, "x"}, 0, 5, 0.01, ImageSize -> {265, 5}}],
Control[{{y, 1, "y"}, 0, 5, 0.01, ImageSize -> {256, 5}}],
Control[{{z, 1, "z"}, 0, 5, 0.01, ImageSize -> {256, 5}}],
Control[{{u, 0, "u"}, -2, 2, 0.01, ImageSize -> {256, 5}}],
Row[{Graphics[{Thick, Line[{{0, 0}, {1, 0}}]},
ImageSize -> {256, 5}, AspectRatio -> 5/256]}],
Button["Button", {x = 1, y = 1, z = 1, u = 0},
Appearance -> "Palette", ImageSize -> {256, 28}]
}, Alignment -> Center]
}],
ControlPlacement -> Bottom]