SwiftUI处理手势的API非常丰富,并且把反锁的部分都做了封装少了许多费事。最常用的便是onTapGesture(),当然还有其他的API,也能够把这些API组合运用。

首先看看最简略的onTapGesture()

官方界说:

func onTapGesture(
 count: Int = 1,
 perform action: @escaping () -> Void
) -> some View

参数count是说总共摸或者点击多少次才能够触发第二个参数的动作。默认是一次。

Text("Hello, World!")
    .onTapGesture(count: 2) {
        print("Double tapped!")
    }

这儿count清晰指定了需求两次才会打印Double tapped!

处理长按能够运用onLongPressGesture(), 例如:

Text("Hello, World!")
    .onLongPressGesture {
        print("Long pressed!")
    }

和处理tap手势一样,长按手势也能够定制处理。比方,能够指定最少时长:

Text("Hello, World!")
    .onLongPressGesture(minimumDuration: 2) {
        print("Long pressed!")
    }

还能够指定别的一个闭包来处理长按手势状态的改动:

Text("Hello, World!")
    .onLongPressGesture(minimumDuration: 1) {
        print("Long pressed!")
    } onPressingChanged: { inProgress in
        print("In progress: (inProgress)!")
    }

能够看到第二个闭包接收了一个bool型的参数,它能够这样处理:

  1. 在用户按下的时分就会调用这个闭包,参数的值为true
  2. 假如在手势被确以为长按(比方在设定长按最少需求两秒,而在一秒钟的时分就开释)之前就松开手指,第二个闭包也会履行,参数值为false
  3. 假如手势被确认(按的时刻足够长),第二个闭包会被履行并且参数值为false。因为这个时分会履行第一个闭包。

对于更加杂乱的手势能够运用gesture()办法和一些手势结构体结合来处理。手势结构体有:DragGesture, LongPressGesture, MagnificationGesture, RotationGestureTapGesture。当然少不了用到这些结构体的办法: onEnd()onChanged()。手势进行中运用onChanged(),手势完成用onEnd()

下面的比方里,给一个视图加上一个磁性手势。经过手势来缩放该视图。这不仅需求手势,还需求一个@State特点来存储缩放巨细值,然后在scaleEffect()里运用就能够达到想要的作用。例如:

struct ContentView: View {
    @State private var currentAmount = 0.0
    @State private var finalAmount = 1.0
    var body: some View {
        Text("Hello, World!")
            .scaleEffect(finalAmount + currentAmount)
            .gesture(
                MagnificationGesture()
                    .onChanged { amount in
                        currentAmount = amount - 1
                    }
                    .onEnded { amount in
                        finalAmount += currentAmount 
                        currentAmount = 0
                    }
            )
    }
}

同样的道理,能够运用RotationGesture来完成,这是这次要调用rotationEffect()。例如:

struct ContentView: View {
    @State private var currentAmount = Angle.zero
    @State private var finalAmount = Angle.zero
    var body: some View {
        Text("Hello, World!")
            .rotationEffect(currentAmount + finalAmount)
            .gesture(
                RotationGesture()
                    .onChanged { angle in
                        currentAmount = angle
                    }
                    .onEnded { angle in
                        finalAmount += currentAmount
                        currentAmount = .zero
                    }
            )
    }
}

还有一种很风趣的情况。假如一个企图挂了一个手势识别办法,而它的父企图也挂了一个会发生什么呢?比方一个文本企图和它的父企图都挂了onTapGesture()。例如:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello, World!")
                .onTapGesture {
                    print("Text tapped")
                }
        }
        .onTapGesture {
            print("VStack tapped")
        }
    }
}

在这种情况下,SwiftUI会把优先权交给子视图。也便是说,点了TextView会显现Text Tapped。假如要强行改动这个事实能够运用highPriorityGesture()。例如:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello, World!")
                .onTapGesture {
                    print("Text tapped")
                }
        }
        .highPriorityGesture(
            TapGesture()
                .onEnded { _ in
                    print("VStack tapped")
                }
        )
    }
}

于是就不得不提别的一个具有相似功能的办法了simultaneousGesture()。它会告知SwiftUI同时满足两个企图的手势功能。例如:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello, World!")
                .onTapGesture {
                    print("Text tapped")
                }
        }
        .simultaneousGesture(
            TapGesture()
                .onEnded { _ in
                    print("VStack tapped")
                }
        )
    }
}

这是会同时显现Text tappedVStack tapped

最后,SwiftUI还支持运用手势序列。便是把几个手势组合到一起。要运用这个功能就不能像上面的比方一样简略的挂在某个企图上了。

这个比方是长按之后拖动一个圆形,看看下面的代码:

struct ContentView: View {
    // 圆形被拖动了多远
    @State private var offset = CGSize.zero
    // 当前是否被拖动
    @State private var isDragging = false
    var body: some View {
        // 拖动手势,拖动时更新offset和isDragging特点
        let dragGesture = DragGesture()
            .onChanged { value in offset = value.translation }
            .onEnded { _ in
                withAnimation {
                    offset = .zero
                    isDragging = false
                }
            }
        // 一个长按手势,完成之后能够开启拖动
        let pressGesture = LongPressGesture()
            .onEnded { value in
                withAnimation {
                    isDragging = true
                }
            }
        // 手势的组合,组合了长按和拖动手势
        let combined = pressGesture.sequenced(before: dragGesture)
        // 一个64*64的圆形。拖动时变大,拖动时把拖动的值作为偏移值设置给圆形。最受用gesture办法设置了上面的组合手势
        Circle()
            .fill(.red)
            .frame(width: 64, height: 64)
            .scaleEffect(isDragging ? 1.5 : 1)
            .offset(offset)
            .gesture(combined)
    }
}

手势处理,是完成app优秀交互必不可少的!