JunoSlider
A visionOS slider view to mimic Apple's expanding sliders
Install / Use
/learn @christianselig/JunoSliderREADME
JunoSlider

JunoSlider is a custom slider for visionOS (probably works with iOS fine, though!) to mimic the style of Apple's expanding sliders in views like AVPlayer in instances where you're unable to use AVPlayer.
It's built in SwiftUI and customizable, with both the collapsed and expanded height being values you can change.
Apple's built-in Slider control may be a better fit for a lot of cases especially those where you don't require the expansion effect. The built-in Slider can animate its controlSize property, but the animation is a little weird on visionOS. Also, the height is not super customizable, even .mini with Slider does not allow you to get as narrow as Apple's AVPlayer slider, for instance.
Big thanks to Matthew Skiles and Ed Sanchez for helping me with the inner and drop shadows on the control. Also thank you to kind Twitter and Mastodon folks for helping me debug an animation issue with this control, it seems like a SwiftUI bug and the idea of just cropping out the animation jump seemed to be the best tradeoff.
Example Usage
import JunoUI
struct ContentView: View {
@State var sliderValue: CGFloat = 0.5
@State var isSliderActive = false
var body: some View {
JunoSlider(sliderValue: $sliderValue, maxSliderValue: 1.0, baseHeight: 10.0, expandedHeight: 22.0, label: "Video volume") { editingChanged in
isSliderActive = editingChanged
}
}
}
Related Skills
node-connect
343.1kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
90.0kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
343.1kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
343.1kQQBot 富媒体收发能力。使用 <qqmedia> 标签,系统根据文件扩展名自动识别类型(图片/语音/视频/文件)。
