How to position vertical Slider

I'm an old programmer but new to Mac and SwiftUI. I'm trying to get a vertical Slider positioned right up against the right edge of the window. Apparently this requires rotation:
Slider(value: $vx).rotationEffect(.degrees(v1))
Slider(value: $vx).rotationEffect(.degrees(v1))
But this rotation is just an effect. All measurements, bounding boxes, alignment, etc that effect its size and position behave as though it's still horizontal, which makes it incredibly unintuitive and frustrating to reason about, especially when new and unfamiliar with how positioning etc is done even for normal UI elements. The very few Google hits for this have poor answers like just a slider in the middle, or a complete custom replacement that doesn't behave like a native one. (By the way Android has the exact some problem in both XML and Jetpack Compose. AppKit for one is intuitive though.)
19 Replies
hippietrail
hippietrailOP16mo ago
The more I look into this there more I conclude that vertical sliders have just gone out of fashion. Mac AppKit's NSSlider supports them, but iOS UIKit's UISlider doesn't.
xPsycHoWasPx
xPsycHoWasPx16mo ago
Stack Overflow
How can I make a bunch of vertical sliders in swiftUI
I am trying to make a group (10 in the test code, but 32 in reality) of vertical faders using SwiftUI on an iPad app. When making sliders horizontally, they stretch across the screen properly. When
hippietrail
hippietrailOP16mo ago
Yes I found that one. Two answers involve custom slider libraries which will tend to have differences from the standard ones. The other one is much more promising involving swapping horizontal and vertical fields, but unlike native horizontal ones you have to pass the values in for those fields. And the newest comment on it says it doesn't work anymore. I've concluded there isn't really a native solution and it's intentional. At first I thought they designed it so you would "just" rotate it, but now I can see there is no "just" (-:
xPsycHoWasPx
xPsycHoWasPx16mo ago
No description
xPsycHoWasPx
xPsycHoWasPx16mo ago
@hippietrail ehhhhhhhhhh ???? .rotationEffect is how u flip items in swiftui ups it was up side down
xPsycHoWasPx
xPsycHoWasPx16mo ago
No description
xPsycHoWasPx
xPsycHoWasPx16mo ago
also making your own custom slider is very easy
xPsycHoWasPx
xPsycHoWasPx16mo ago
No description
xPsycHoWasPx
xPsycHoWasPx16mo ago
goto that part on pic in general the SwiftUI Sliders are very limited, so im also just gonna build my own my in my app in those examples u just need to swap width with height to make it hori
hippietrail
hippietrailOP16mo ago
Yes I could also get a vertical slider in the centre of the display, but being able to align it like any normal control was well beyond my abilities as a newcomer.
hippietrail
hippietrailOP16mo ago
No description
hippietrail
hippietrailOP16mo ago
You can see the bounding box for the slider I want aligned on the right edge of the window does not match the slider itself.
xPsycHoWasPx
xPsycHoWasPx16mo ago
well just make your own the code for one is on that page.. (i dont use the builtin in slider, its simply to primitive)
xPsycHoWasPx
xPsycHoWasPx16mo ago
No description
xPsycHoWasPx
xPsycHoWasPx16mo ago
just locate this part
xPsycHoWasPx
xPsycHoWasPx16mo ago
No description
xPsycHoWasPx
xPsycHoWasPx16mo ago
Just change the
v.translation.width
v.translation.width
to
v.translation.height
v.translation.height
the places its used
hippietrail
hippietrailOP15mo ago
Thanks. It's just for a toy project to help me learn my way around the UI so not a big deal. I will learn custom controls later.
Want results from more Discord servers?
Add your server