Are There Any Examples Besides the Two in the README?

[alexwhb]

Love the project! Wondering (as my title suggests) if there are any other examples usages of this library or documentation somewhere? I've successfully hacked my way to getting a value slider working the way I wanted, but I'm having a hard time figuring out the range slider.

Thank you for this project!

[ay42]

Hi @alexwhb,
There are more examples in the Previews. Let me know if this helps.

swiftui-sliders/Sources/Sliders/RangeSlider/RangeSlider.swift

Lines 81 to 181 in d5a7d85

	private struct HorizontalRangeSlidersPreview: View {
	@State var range1 = 0.1...0.9
	@State var range2 = 0.1...0.9
	@State var range3 = 0.1...0.9
	@State var range4 = 0.1...0.9
	@State var range5 = 0.1...0.9
	@State var range6 = -2.0...4.0
	var body: some View {
	VStack {
	RangeSlider(range: $range1)
	RangeSlider(range: $range2, distance: 0.3 ... 1.0)
	.rangeSliderStyle(
	HorizontalRangeSliderStyle(
	track:
	HorizontalRangeTrack(
	view: Capsule().foregroundColor(.purple)
	)
	.background(Capsule().foregroundColor(Color.purple.opacity(0.25)))
	.frame(height: 8),
	lowerThumb: Circle().foregroundColor(.purple),
	upperThumb: Circle().foregroundColor(.purple),
	lowerThumbSize: CGSize(width: 32, height: 32),
	upperThumbSize: CGSize(width: 32, height: 32),
	options: .forceAdjacentValue
	)
	)
	RangeSlider(range: $range3)
	.rangeSliderStyle(
	HorizontalRangeSliderStyle(
	track:
	HorizontalRangeTrack(
	view: LinearGradient(gradient: Gradient(colors: [.red, .orange, .yellow, .green, .blue, .purple, .pink]), startPoint: .leading, endPoint: .trailing)
	)
	.background(LinearGradient(gradient: Gradient(colors: [.red, .orange, .yellow, .green, .blue, .purple, .pink]), startPoint: .leading, endPoint: .trailing).opacity(0.25))
	.frame(height: 32)
	.cornerRadius(16),
	lowerThumb: HalfCapsule().foregroundColor(.white).shadow(radius: 3),
	upperThumb: HalfCapsule().rotation(Angle(degrees: 180)).foregroundColor(.white).shadow(radius: 3),
	lowerThumbSize: CGSize(width: 32, height: 32),
	upperThumbSize: CGSize(width: 32, height: 32)
	)
	)
	RangeSlider(range: $range4)
	.frame(height: 64)
	.rangeSliderStyle(
	HorizontalRangeSliderStyle(
	track:
	HorizontalRangeTrack(
	view: LinearGradient(gradient: Gradient(colors: [.purple, .blue, .purple]), startPoint: .leading, endPoint: .trailing),
	mask: Rectangle()
	)
	.mask(Ellipse())
	.background(Ellipse().foregroundColor(Color.secondary.opacity(0.25)))
	.overlay(Ellipse().strokeBorder(Color.white.opacity(0.5), lineWidth: 1))
	.padding(.vertical, 8),
	lowerThumbSize: CGSize(width: 16, height: 64),
	upperThumbSize: CGSize(width: 16, height: 64)
	)
	)
	RangeSlider(range: $range5)
	.frame(height: 64)
	.rangeSliderStyle(
	HorizontalRangeSliderStyle(
	track:
	HorizontalRangeTrack(
	view: LinearGradient(gradient: Gradient(colors: [.yellow, .orange, .red]), startPoint: .leading, endPoint: .trailing),
	mask: Rectangle()
	)
	.background(Color.secondary.opacity(0.25))
	.cornerRadius(16),
	lowerThumb: HalfCapsule().foregroundColor(.white).shadow(radius: 3),
	upperThumb: HalfCapsule().rotation(Angle(degrees: 180)).foregroundColor(.white).shadow(radius: 3),
	lowerThumbSize: CGSize(width: 32, height: 64),
	upperThumbSize: CGSize(width: 32, height: 64)
	)
	)
	RangeSlider(range: $range6, in: 1.0 ... 3.0)
	.cornerRadius(8)
	.frame(height: 128)
	.rangeSliderStyle(
	HorizontalRangeSliderStyle(
	track:
	HorizontalRangeTrack(
	view: LinearGradient(gradient: Gradient(colors: [.blue, .red]), startPoint: .leading, endPoint: .trailing),
	mask: RoundedRectangle(cornerRadius: 10)
	)
	.background(Color.secondary.opacity(0.25)),
	lowerThumbSize: CGSize(width: 8, height: 64),
	upperThumbSize: CGSize(width: 8, height: 64)
	)
	)
	}
	.padding()
	}
	}

[alexwhb]

@ay42 This is exactly what I was looking for! Thank you so much!