-
Notifications
You must be signed in to change notification settings - Fork 0
/
LongPressGestureBootcamp.swift
144 lines (129 loc) · 5.27 KB
/
LongPressGestureBootcamp.swift
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
//
// LongPressGestureBootcamp.swift
// SwiftfulThinkingBootcamp
//
// Created by enesozmus on 14.05.2024.
//
import SwiftUI
struct LongPressGestureBootcamp: View {
// ... ⬛️
// MARK: PROPERTIES
@GestureState private var isDetectingLongPress: Bool = false
@State private var completedLongPress: Bool = false
@State private var isComplete1: Bool = false
@State private var isComplete2: Bool = false
@State private var isSuccess: Bool = false
var longPress: some Gesture {
LongPressGesture(minimumDuration: 3)
.updating($isDetectingLongPress) { currentState, gestureState,
transaction in
gestureState = currentState
transaction.animation = Animation.easeIn(duration: 2.0)
}
.onEnded { finished in
self.completedLongPress = finished
}
}
// ... ⬛️
// MARK: BODY
var body: some View {
// ... 🟦
Circle()
.fill(self.isDetectingLongPress ?
Color.red :
(self.completedLongPress ? Color.green : Color.blue))
.frame(width: 100, height: 100, alignment: .center)
.gesture(longPress)
// ... 🟦
Text(isComplete1 ? "COMPLETED" : "NOT COMPLETE")
.padding()
.padding(.horizontal)
.background(isComplete1 ? Color.green : Color.red)
.cornerRadius(10)
// .onTapGesture {
// isComplete.toggle()
// }
.onLongPressGesture(minimumDuration: 1.5, maximumDistance: 50) {
isComplete1.toggle()
}
// ... 🟦
VStack {
Rectangle()
.fill(isSuccess ? Color.green : Color.blue)
.frame(maxWidth: isComplete2 ? .infinity : 0)
.frame(height: 55)
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.gray)
HStack {
Text("CLICK HERE")
.foregroundColor(.white)
.padding()
.background(Color.black)
.clipShape(RoundedRectangle(cornerRadius: 25.0, style: .continuous))
.onLongPressGesture(minimumDuration: 1.5, maximumDistance: 50) { (isPressing) in
// start of press -> min duration
if isPressing {
withAnimation(.easeInOut(duration: 1.5)) {
isComplete2 = true
}
} else {
DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
if !isSuccess {
withAnimation(.easeInOut) {
isComplete2 = false
}
}
}
}
} perform: {
// at the min duration
withAnimation(.easeInOut) {
isSuccess = true
}
}
Text("RESET")
.foregroundColor(.white)
.padding()
.background(Color.black)
.clipShape(RoundedRectangle(cornerRadius: 25.0, style: .continuous))
.onTapGesture {
isComplete2 = false
isSuccess = false
}
}
}
}
}
#Preview {
LongPressGestureBootcamp()
}
/*
🔴 LongPressGesture
→ A gesture that succeeds when the user performs a long press.
→ To recognize a long-press gesture on a view, create and configure the gesture, then add it to the view using the gesture(_:including:) modifier.
init(minimumDuration:maximumDistance:)
→ Creates a long-press gesture with a minimum duration and a maximum distance that the interaction can move before the gesture fails.
struct LongPressGestureView: View {
@GestureState private var isDetectingLongPress = false
@State private var completedLongPress = false
var longPress: some Gesture {
LongPressGesture(minimumDuration: 3)
.updating($isDetectingLongPress) { currentState, gestureState,
transaction in
gestureState = currentState
transaction.animation = Animation.easeIn(duration: 2.0)
}
.onEnded { finished in
self.completedLongPress = finished
}
}
var body: some View {
Circle()
.fill(self.isDetectingLongPress ?
Color.red :
(self.completedLongPress ? Color.green : Color.blue))
.frame(width: 100, height: 100, alignment: .center)
.gesture(longPress)
}
}
*/