I've made a RangeSlider based on this video: https://www.youtube.com/watch?v=5whzc_9eR78. It works fine, but I'd like to get the left and right values from it, how can I do this?
My code:
struct RangeSlider: View {
@State var width: CGFloat = 0
@State var width1: CGFloat = 20
@State var totalWidth: CGFloat = UIScreen.main.bounds.width-60
let circleSize: CGFloat = 21
var body: some View {
VStack{
ZStack(alignment: .leading){
Rectangle()
.fill(Color.black.opacity(0.2))
.frame(width: self.totalWidth+2*self.circleSize, height: self.circleSize/3)
Rectangle()
.fill(Color.black)
.frame(width: self.width1-self.width, height: self.circleSize/3)
.offset(x: self.width+self.circleSize)
HStack(spacing: 0){
Circle()
.fill(Color.white)
.frame(width: self.circleSize, height: self.circleSize)
.offset(x: self.width)
.gesture(
DragGesture()
.onChanged({ (value) in
if (value.location.x >= 0 && value.location.x <= self.width1){
self.width = value.location.x
}
}))
Circle()
.fill(Color.white)
.frame(width: self.circleSize, height: self.circleSize)
.offset(x: self.width1)
.gesture(
DragGesture()
.onChanged({ (value) in
if (value.location.x <= self.totalWidth-(2*self.circleSize) && value.location.x >= self.width){
self.width1 = value.location.x
}
}))
}
}
}
}
}
I'm calling the RangeSlider() inside a ZStack in my ContentView.swift, I'd like to return the left thumb value width/totalWidth and the right thumb value width1/totalWidth as it's done in Textfield(text: self.$value) to return the text to variable "value".