学Swift挣美元UI篇之11 Gesture recognizers 手势识别器

之前的文章主要介绍swift的语法，本篇将带领大家从UI层面学习iOS开发

• 请点击，免费订阅《学Swift挣美元》专栏

学Swift挣美元UI篇之Gesture recognizers 手势识别器

手势识别器比触摸操作更为强大。手势识别器能够以更贴近人类操作屏幕内容。iOS基础框架的好处让我们无需编程或理解定义手势识别算法的复杂基础代码, 就可以在自己的应用里面检测和响应各种复杂的预定义手势。

由于我们采用了苹果提供的标准的手势识别器（gesture recognizers）,因此我们可以和微信、淘宝、京东等app拥有相同的体验。

手势识别器

实战

下面，我们通过创建一个简单的图像查看器应用程序来探索手势的可能性。在此应用中, 您将平移、缩放和旋转图像, 或点击以查看下一张图像。

代码下载

请大家先下载一下初始代码
https://github.com/wangdazhi/ImageViewer

01 将文件拖拽入项目

Image Views是用于现实存在项目中的图片控件。

在我们项目中，可以看到一个images文件夹，直接将这个文件拖拽入项目中。具体操作可以参考下面视频：

视频教程：如何将文件拖拽入项目

02 添加Pan gesture recognizer

（1） 从Object Library中拖拽Pan Gesture Recognizer到storeboard，然后拖着到image view上：参考视频
视频教程之添加Pan Gesture Recognize

（2）在平移手势识别器的 "属性检查器" 中, 将最大触点调整为2。您将创建一个响应平移手势的操作。

[email protected]

下面（3）至（6）的具体操作请看视频
视频教程之手势3至7添加action

（3）打开Assistant Editor

[email protected]

（4）按住control键，将pan gesture recognizer拖拽到view controller源码的viewDidLoad方法下面
（5）修改action的名称为“handlePan”
（6）修改Type为“UIPanGestuerRecognizer”
（7）添加imageview 的outlet。handlePan函数可以响应用户移动手势，其中包含开始、更改、结束或是失败。
视频教程之手势07添加iamgeview的outlet

（8）声明一个坐标转换器translation

let translation = sender.translation(in: self.view)

[email protected]

(9)可以将此 x, y 坐标添加到图像视图的当前位置以移动图像。使用 view 的中心属性设置图像视图的当前位置:

 imageView.center = CGPoint(
    x:imageView.center.x + translation.x,
    y:imageView.center.y + translation.y
  )

[email protected]

（10）重置手势识别器

sender.setTranslation(CGPoint.zero, in: self.view)

[email protected]

(11)给imageview设置一张图片

[email protected]