SwiftUI Gesture 一篇文章掌握手势使用

本文价值与收获

看完本文后，您将能够作出下面的界面

Jietu20200411-230108.gif

看完本文您将掌握的技能

• 掌握gesture基础使用
• 了解SwiftUI提供了三种手势组合方式:
  • Simultaneous
  • Sequenced
  • Exclusive
• Gesture modifier
• DragGesture
• 组合Gesture

SwiftUI在构建手势时具有强大且易于使用的方法。今天，我们将讨论如何在SwiftUI中使用手势。我们将触摸特殊的GestureState Property Wrapper，它与State非常相似，但仅适用于手势。最后，我们将构建可滑动的Tinder卡作为示例项目。

Gesture modifier

SwiftUI提供了一系列易于使用的手势，例如TapGesture，DragGesture，RotationGesture，MagnificationGesture和LongPressGesture。您可以通过将手势修饰符附加到任何视图来使用它们。让我们看一下代码示例

import SwiftUI

struct ContentView : View {
    @GestureState var isLongPressed = false

    var body: some View {
        let longPress = LongPressGesture()
            .updating($isLongPressed) { value, state, transcation in
                state = value
        }

        return Rectangle()
            .fill(isLongPressed ? Color.purple : Color.red)
            .frame(width: 300, height: 300)
            .cornerRadius(8)
            .shadow(radius: 8)
            .padding()
            .scaleEffect(isLongPressed ? 1.1 : 1)
            .gesture(longPress)
            .animation(.fluidSpring())
    }
}

在这里，我们使用@GestureState属性包装器将手势值更改绑定到isLongPressed属性。要将手势更改附加到@GestureState属性，我们必须在手势实例上调用update方法，并在实现绑定的地方传递带有闭包的属性包装器。在当前示例中，我们只是将值绑定到状态，但是在更复杂的手势中，在为状态分配新值之前，我们可以进行任何计算。现在，我们可以在声明视图以基于手势动画更改时使用isLongPressed。每当isLongPressed更改时，SwiftUI都会重建视图。