add kwarg to rotate Toggle

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## [Unreleased]
 
+- Add kwarg to rotate Toggle [#4445](https://github.com/MakieOrg/Makie.jl/pull/4445)
 - Fix uint16 overflow for over ~65k elements in WGLMakie picking [#4604](https://github.com/MakieOrg/Makie.jl/pull/4604).
 - Improve performance for line plot in CairoMakie [#4601](https://github.com/MakieOrg/Makie.jl/pull/4601).
 - Prevent more default actions when canvas has focus [#4602](https://github.com/MakieOrg/Makie.jl/pull/4602).

ReferenceTests/src/tests/figures_and_makielayout.jl

@@ -459,33 +459,33 @@ end
 @reference_test "Button - Slider - Toggle - Textbox" begin
     f = Figure(size = (500, 250))
     Makie.Button(f[1, 1:2])
-    Makie.Button(f[2, 1:2], buttoncolor = :orange, cornerradius = 20, 
+    Makie.Button(f[2, 1:2], buttoncolor = :orange, cornerradius = 20,
         strokecolor = :red, strokewidth = 2, # TODO: allocate space for this
         fontsize = 16, labelcolor = :blue)
 
     IntervalSlider(f[1, 3])
-    sl = IntervalSlider(f[2, 3], range = 0:100, linewidth = 20, 
+    sl = IntervalSlider(f[2, 3], range = 0:100, linewidth = 20,
         color_inactive = :orange, color_active_dimmed = :lightgreen)
     Makie.set_close_to!(sl, 30, 70)
 
     Toggle(f[3, 1])
-    Toggle(f[4, 1], framecolor_inactive = :lightblue, rimfraction = 0.6)
-    Toggle(f[3, 2], active = true)
-    Toggle(f[4, 2], active = true, framecolor_inactive = :lightblue, 
-        framecolor_active = :yellow, rimfraction = 0.6)
+    t = Toggle(f[4, 1], framecolor_inactive = :lightblue, rimfraction = 0.6)
+    t.orientation = 3pi/4
+    Toggle(f[3, 2], active = true, orientation = :horizontal)
+    Toggle(f[4, 2], active = true, framecolor_inactive = :lightblue,
+        framecolor_active = :yellow, rimfraction = 0.6, orientation = :vertical)
 
     Makie.Slider(f[3, 3])
-    sl = Makie.Slider(f[4, 3], range = 0:100, linewidth = 20, color_inactive = :cyan, 
+    sl = Makie.Slider(f[4, 3], range = 0:100, linewidth = 20, color_inactive = :cyan,
         color_active_dimmed = :lightgreen)
     Makie.set_close_to!(sl, 30)
 
     gl = GridLayout(f[5, 1:3])
     Textbox(gl[1, 1])
-    Textbox(gl[1, 2], bordercolor = :red, cornerradius = 0, 
+    Textbox(gl[1, 2], bordercolor = :red, cornerradius = 0,
         placeholder = "test string", fontsize = 16, textcolor_placeholder = :blue)
-    tb = Textbox(gl[1, 3], bordercolor = :black, cornerradius = 20, 
+    tb = Textbox(gl[1, 3], bordercolor = :black, cornerradius = 20,
         fontsize =10, textcolor = :red, boxcolor = :lightblue)
     Makie.set!(tb, "some string")
-
     f
-end
+end

src/makielayout/blocks/toggle.jl

@@ -2,30 +2,39 @@
 
     topscene = t.blockscene
 
-    markersize = lift(topscene, t.layoutobservables.computedbbox) do bbox
-        min(width(bbox), height(bbox))
+    onany(topscene, t.orientation, t.length, t.markersize) do or, len, ms
+        theta = or == :horizontal ? 0 : or == :vertical ? pi/2 : or
+        t.width[] = (len - ms) * cos(theta) + ms
+        t.height[] = (len - ms)  * sin(theta) + ms
     end
 
-    button_endpoint_inactive = lift(topscene, markersize) do ms
-        bbox = t.layoutobservables.computedbbox[]
+    button_endpoint_inactive = lift(topscene, t.markersize, t.layoutobservables.computedbbox) do ms, bbox
+
         Point2f(left(bbox) + ms / 2, bottom(bbox) + ms / 2)
     end
 
-    button_endpoint_active = lift(topscene, markersize) do ms
-        bbox = t.layoutobservables.computedbbox[]
-        Point2f(right(bbox) - ms / 2, bottom(bbox) + ms / 2)
+    button_endpoint_active = lift(topscene, t.markersize, t.layoutobservables.computedbbox) do ms, bbox
+        Point2f(right(bbox) - ms / 2, top(bbox) - ms / 2)
     end
 
-    buttonvertices = lift(topscene, markersize, t.cornersegments) do ms, cs
-        roundedrectvertices(t.layoutobservables.computedbbox[], ms * 0.499, cs)
+    buttonvertices = lift(topscene, t.length, t.markersize, t.cornersegments) do len, ms, cs
+        rect0 = GeometryBasics.HyperRectangle(-ms/2, -ms/2, len, ms)
+        return roundedrectvertices(rect0, ms * 0.499, cs)
     end
 
     # trigger bbox
+    notify(t.length)
     notify(t.layoutobservables.suggestedbbox)
 
     framecolor = Observable{Any}(t.active[] ? t.framecolor_active[] : t.framecolor_inactive[])
     frame = poly!(topscene, buttonvertices, color = framecolor, inspectable = false)
 
+    onany(topscene, t.markersize, t.orientation, t.layoutobservables.computedbbox, update = true) do ms, or, bbox
+        theta = or == :horizontal ? 0 : or == :vertical ? pi/2 : or
+        rotate!(frame, theta)
+        translate!(frame, origin(bbox) .+ ms/2)
+    end
+
     animating = Observable(false)
     buttonpos = Observable(t.active[] ? [button_endpoint_active[]] : [button_endpoint_inactive[]])
 
@@ -37,7 +46,7 @@
     end
 
     buttonfactor = Observable(1.0)
-    buttonsize = lift(topscene, markersize, t.rimfraction, buttonfactor) do ms, rf, bf
+    buttonsize = lift(topscene, t.markersize, t.rimfraction, buttonfactor) do ms, rf, bf
         ms * (1 - rf) * bf
     end
 

src/makielayout/types.jl

@@ -1152,16 +1152,37 @@ const CHECKMARK_BEZIER = scale(BezierPath(
     end
 end
 
+"""
+A switch with two states.
+
+## Constructors
+
+```julia
+Toggle(fig_or_scene; kwargs...)
+```
+
+## Examples
+
+```julia
+t_horizontal = Toggle(fig[1, 1])
+t_vertical = Toggle(fig[2, 1], orientation = :vertical)
+t_diagonal = Toggle(fig[3, 1], orientation = pi/4)
+on(t_vertical.active) do switch_is_on
+    switch_is_on ? println("good morning!") : println("good night")
+end
+```
+
+"""
 @Block Toggle begin
     @attributes begin
         "The horizontal alignment of the toggle in its suggested bounding box."
         halign = :center
         "The vertical alignment of the toggle in its suggested bounding box."
         valign = :center
-        "The width of the toggle."
-        width = 32
-        "The height of the toggle."
-        height = 18
+        "The width of the bounding box.  Use `length` and `markersize` to set the dimensions of the toggle."
+        width = Auto()
+        "The height of the bounding box.  Use `length` and `markersize` to set the dimensions of the toggle."
+        height = Auto()
         "Controls if the parent layout can adjust to this element's width"
         tellwidth = true
         "Controls if the parent layout can adjust to this element's height"
@@ -1185,6 +1206,12 @@ end
         rimfraction = 0.33
         "The align mode of the toggle in its parent GridLayout."
         alignmode = Inside()
+        "The orientation of the toggle.  Can be :horizontal, :vertical, or -pi to pi.  0 is horizontal with \"on\" being to the right."
+        orientation = :horizontal
+        "The length of the toggle."
+        length = 32
+        "The size of the button."
+        markersize = 18
     end
 end
 

test/makielayout.jl

@@ -547,3 +547,10 @@ end
     end
     @test isempty(limits.listeners)
 end
+
+@testset "Toggle" begin
+    f = Figure()
+    Toggle(f[1,1])
+    Toggle(f[2,1], orientation=:vertical)
+    Toggle(f[3,1], orientation=pi/4)
+end