Step1 : Create A SwiftUI View
step2 : Use Gesture And Gesture state property I hope You Know How Too Add
this is the way -->
`struct CounterView: View {
@GestureState private var isDetectingLongPress = false
var body: some View {
let press = LongPressGesture(minimumDuration: 1)
.updating($isDetectingLongPress) { currentState, gestureState, transaction in
gestureState = currentState
}
return Circle()
.fill(isDetectingLongPress ? Color.yellow : Color.green)
.frame(width: 100, height: 100, alignment: .center)
.gesture(press)
}
}
this is example from [https://developer.apple.com/documentation/swiftui/adding-interactivity-with-gestures) just you can go through this
step3: You can gesture for scrubbing like you can use drag gesture
@State private var isDragging = false
var drag: some Gesture {
DragGesture()
.onChanged { _ in self.isDragging = true }
.onEnded { _ in self.isDragging = false }
}
var body: some View {
Circle()
.fill(self.isDragging ? Color.red : Color.blue)
.frame(width: 100, height: 100, alignment: .center)
.gesture(drag)
}
}
this is way to add gesture I hope you find it beneficial mate .
Step4: Then You Create Custom Field
var body: some View {
TextField(
"User name (email address)",
text: $username
)
This Is the Way You Can Add Custom Text Field for That You Have To Use @State As I Have Given In code Like It Depends What You Want To Name Its Depend On you
Step 5 : Add Cursor Modification
Step 6: Then .onReceive modifier in SwiftUI allows you to listen to changes in a publisher and react to those changes. In the context of your Xcode-style value input field, you can use .onReceive to handle keyboard input for the text field and ensure that it responds to numeric input, updating the value accordingly.
struct XcodeStyleValueField: View {
// State to keep track of the value displayed in the field
@State private var value: Double = 0
// State to manage whether the field is focused
@State private var isFocused: Bool = false
// Gesture state to track if the user is scrubbing (dragging) the field
@GestureState private var scrubbing: Bool = false
var body: some View {
TextField("", value: $value, format: "%.2f")
.textFieldStyle(.roundedBorder) // Apply a rounded border style to the text field
.focused($isFocused) // Bind the focus state of the text field
// Gesture to enable scrubbing (dragging) functionality
.gesture(
DragGesture(minimumDistance: 0)
.updating($scrubbing) { value, state, _ in
state = true
}
.onChanged { value in
if isFocused {
// Update the value while scrubbing
self.value += Double(value.translation.width) / 10
}
}
)
// Change cursor style based on focus state
.cursor(isFocused ? .resizeLeftRight : .arrowCursor)
// Toggle focus state when the field is tapped
.onTapGesture {
isFocused.toggle()
}
}
}
struct ContentView: View {
var body: some View {
VStack {
Spacer()
XcodeStyleValueField() // Use the custom value field
Spacer()
}
}
}
@main
struct MyApp: App {
var body: some Scene {
WindowGroup {
ContentView() // Set the main content view
}
}
}
// Code With Comment Might Help You Understand Better
This Is Way I hope This Will Be Helpful To You Friend I tried my best To Make You Understand As Beginner.
Keep Learning .