---

Gestures

---

新建工程，隨意命名，接下來要使用Gestures的點擊，長按，拖動，縮放，旋轉等功能。
首先，放置一個用于操作手勢的物件，比如英語學習單詞卡片，代碼

ZStack {
           Rectangle()
                .fill(Color.red)
                .frame(width: 320, height: 210, alignment: .center)
                .cornerRadius(12)
            VStack{
                Spacer()
                Text("Are you kidding?")
                    .font(.largeTitle)
                    .foregroundColor(.white)
                Text("玩呢？")
                        .font(.title)
                        .foregroundColor(.white)
                
                Spacer()
            }
            
        }

效果如圖

TapGesture
然后加入最簡單的，點擊手勢，先定義變量

@State private var revealed = false

可以直接在ZStack后加入modifier，添加手勢，如：

但是這樣會后期加入更多手勢以及手勢操作會變得比較混亂，所以推薦在手勢比較多的時候，單獨定義每一個手勢，可以在body內定一，這樣就需要引入return，如果是SwiftUI2.0則需要

@ViewBuilder
var body: some View {

類似這樣。為了少些操作，我將手勢定義到struct內，body外，如圖

然后修改解釋部分代碼

然后modifier

}.gesture(tapPress)

最簡單的點擊手勢完成。

LongPressGesture()
加入長按手勢

@GestureState var isDetectingLongPress = false
@State 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
        }
    }

當長按時，isDetecingLongPress實時更新，completedLongPress用來判斷長按結束。
加入長按的modifier，長按時,使用動畫easeIn方式，0.5秒圖形尺寸變大1.1倍。
參數mininumDuration:3
即長按超過三秒則取消長按狀態。

}
       .scaleEffect(self.isDetectingLongPress ? 1.1 : 1.0)
       .gesture(longPress)
       .gesture(tapPress)

如果是這個順序，則點擊功能失效，換個順序則可以了.

.scaleEffect(self.isDetectingLongPress ? 1.1 : 1.0)
.gesture(tapPress)
.gesture(longPress)

還可在定義tapGesture時定義在long press之前執行，則只需加入一次手勢modifier,即可

var tapPress: some Gesture{
        TapGesture()
        .onEnded({
            self.revealed.toggle()
            })
        .exclusively(before: longPress)
    }

 }
  .scaleEffect(self.isDetectingLongPress ? 1.1 : 1.0)
  .gesture(tapPress)

這是放大圖與正常圖對比


下一章學習拖動與縮放，以及手勢之間聯動。