3.2 通过对触摸事件的监测创建可随意拖动的图像视图 [iOS开

1. 本节课将为您演示，如何通过监听手势事件，使图片可以被自由拖动。首先点击项目导航栏中的资源文件夹，查看项目中已经导入的图片。

image

2. 您将给资源文件夹中的这张图片，添加拖动手势。

image

3. 然后在左侧的项目导航区，打开视图控制器的代码文件。

image

4. 现在开始编写代码，实现自由拖动图片的功能。

image

5. 给类添加一个属性，作为被拖动的图像视图。

image

6. 接着添加一个属性，用于判断图片是否被按下。

image

7. 从项目中加载图片资源。

image

8. 接着使用图像视图，显示加载的图片。

image

9. 然后将图像视图添加到根视图中。

image

10. 添加一个方法，用来监听手指按下时的事件。

image

11. 有可能是多个手指按下，这里获取第一个触摸对象。

image

12. 然后获得触摸对象的坐标。

image

13. 获得图像视图的显示区域。

image

14. 接着获得图像显示区域的左上角的坐标。

image

15. 然后获得图像显示区域的右下角的坐标。

image

16. 将触摸位置的坐标，和左上角以及右下角的坐标进行比较，从而判断触摸的位置是否位于图像的区域。

image

17. 当触摸在图像区域时，设置布尔属性的值为真，然后在控制台输出日志信息。

image

18. 接着添加一个方法，用来监听手指移动时的事件。

image

19. 判断当触摸位置不在图像区域时，不再执行后方的代码。

image

20. 获取第一个触摸对象。

image

21. 然后获得触摸对象的坐标。

image

22. 获得触摸对象在上一个位置时的坐标。

image

23. 接着计算两个坐标之间的偏移距离。

image

24. 获得图像视图的中心点的坐标。

image

25. 然后将该坐标和偏移距离相加，作为图像视图新的位置。

image

26. 刷新图像视图的中心点的坐标。

image

27. 添加一个方法，用来监听手指移动结束时的事件。当手指离开屏幕时，设置布尔属性的值为假。接着启动模拟器预览项目。

image

28. 在图像的上方按下手指，然后向右下角拖动，图像将跟随手指移动。

29. 最后点击此处的[停止]按钮，关闭模拟器，并结束本节课程。

image

image

本文整理自：《app开发中的神兵利器》，真正的[手把手]教学模式，用最快的速度上手iOS开发，苹果商店App Store免费下载：https://itunes.apple.com/cn/app/id1209739676，或扫描本页底部的二维码。课程配套素材下载地址：资料下载

apps8 2.png