Skip to content

手势识别(Tap, LongPress, Drag)

在 SwiftUI 中,手势识别是实现用户交互的关键。它让你的应用能够响应用户的触摸、滑动等操作。理解并掌握手势,能让你的应用变得生动有趣。

手势识别器可以附加到任何视图上。这使得视图能够响应特定的用户输入。例如,你可以让一个图片在被点击时放大。

SwiftUI 提供了多种内置手势。它们涵盖了日常应用中常见的交互模式。这大大简化了开发过程。

Tap 手势:轻触的魔力 ✨

Tap 手势是最常见的一种。它用于检测用户的轻触操作。你可以轻松地为按钮或图片添加点击事件。

使用 .onTapGesture 修饰符即可实现。例如,一个简单的文本视图可以响应点击。当用户点击时,你可以更新视图状态。

swift
Text("点击我!")
    .onTapGesture {
        print("文本被点击了!")
    }

你还可以指定点击次数。例如,双击事件。这为你的应用增加了更多交互可能性。

LongPress 手势:长按的惊喜 ⏳

LongPress 手势用于检测用户长时间按压的操作。这在许多应用中都有广泛应用。例如,长按图片保存。

使用 .onLongPressGesture 修饰符来添加长按功能。你可以设置长按的最短持续时间。这提供了灵活的控制。

swift
Rectangle()
    .fill(Color.blue)
    .frame(width: 100, height: 100)
    .onLongPressGesture(minimumDuration: 1.5) {
        print("长按了1.5秒!")
    } onPressingChanged: { isPressing in
        print("正在按压: \(isPressing)")
    }

这个手势还提供了按压状态的回调。你可以根据按压状态更新UI。这能提供即时反馈。

Drag 手势:拖动的乐趣 ➡️

Drag 手势用于检测用户的拖动操作。这在需要移动视图或滑动内容时非常有用。例如,拖动一个卡片。

使用 .gesture(DragGesture()) 来实现拖动。你可以获取拖动过程中的各种信息。包括起始位置、当前位置和拖动距离。

swift
@State private var offset = CGSize.zero

Circle()
    .fill(Color.red)
    .frame(width: 50, height: 50)
    .offset(offset)
    .gesture(
        DragGesture()
            .onChanged { value in
                offset = value.translation
            }
            .onEnded { value in
                print("拖动结束,位移: \(value.translation)")
            }
    )

拖动手势提供了 onChangedonEnded 回调。onChanged 在拖动过程中持续触发。onEnded 在拖动结束时触发。

组合手势与并发 🤝

SwiftUI 允许你组合多个手势。你可以使用 .simultaneousGesture.sequencedGesture。这提供了强大的手势处理能力。

  • .simultaneousGesture 允许两个手势同时被识别。例如,一个视图可以同时响应点击和拖动。
  • .sequencedGesture 按照顺序识别手势。例如,先长按再拖动。

掌握这些手势,你就能创建出响应灵敏、交互丰富的应用。用户体验将大大提升!🚀

本站使用 VitePress 制作