TTBaseSUISlider
SwiftUI CoreSwiftUI slider with 3 visual types: plain, with min/max labels, and with a live value display. Supports configurable range, step, tint color, and two-way binding. Designed to match TTBaseUIKit's visual language.
🎨 Types
public enum TYPE {
case DEFAULT // Plain slider, no labels
case WITH_LABELS // Min and max value labels on sides
case WITH_VALUE // Current value displayed above thumb
}
🚀 Usage
// Basic slider 0–100
@State private var volume: Double = 50
TTBaseSUISlider(value: $volume, range: 0...100)
// With min/max labels
TTBaseSUISlider(
value: $brightness,
range: 0...1,
type: .WITH_LABELS,
minLabel: "0%",
maxLabel: "100%"
)
// With live value display
TTBaseSUISlider(
value: $fontSize,
range: 10...32,
step: 1,
type: .WITH_VALUE
)
// Custom tint
TTBaseSUISlider(
value: $opacity,
range: 0...1,
tintColor: .systemOrange
)
// Sound settings
@State private var soundVolume: Double = 0.7
VStack(alignment: .leading, spacing: 8) {
TTBaseSUIText(text: "Volume", type: .TITLE)
TTBaseSUISlider(
value: $soundVolume,
range: 0...1,
step: 0.01,
type: .WITH_LABELS,
minLabel: "🔈",
maxLabel: "🔊"
)
.onChange(of: soundVolume) { newValue in
AudioManager.shared.volume = newValue
}
}
📖 Initializer Parameters
| Parameter | Type | Default | Description |
|---|---|---|---|
value | Binding<Double> | — | Current slider value (two-way) |
range | ClosedRange<Double> | 0...1 | Min to max range |
step | Double | 0.01 | Increment step |
type | TYPE | .DEFAULT | Visual variant |
minLabel | String | "" | Label for min end (WITH_LABELS) |
maxLabel | String | "" | Label for max end (WITH_LABELS) |
tintColor | Color | theme primary | Slider track tint |
Pro Tip: Use
.WITH_VALUE for precision inputs (font size, zoom level) — the live value indicator removes the need for a separate label. Use .WITH_LABELS with emoji or icon characters for quick visual context.