前言
刚开始准备写UI系列的时候，我本来想以教科书方式来一步一步推进知识点，但是这个可能就会成为一个非常冗长枯燥的系列内容。知识点固然要积累，但只有自己遇到问题相关的知识点，大脑才能乐意的把它存储进去。
学习不应该是一种痛苦的过程，尤其是作为我们喜欢游戏的读者来说，能把自己的想法和创意在现实中表达出来，那成就感简直是太棒了！
参考游戏
现在最囧游戏2出来了，笔者玩了几局不得不佩服作者的脑洞无比的大。 里面很多关卡设置的很有新意，比如将让你找吃的，最后你将钻石的中间拉到粪便下方组成冰淇淋通关。让你找船长的钩子，结果是文字内容里面的问号。游戏内容很有趣，同时它的实现方法很简单，利用点击和拖拽的事件就可以做到了。
那么我们这篇文章的目标就是制作一款像最囧游戏一样的简单益智解谜游戏。
开始准备一些资源
背景图片
找一个可爱的字体
直接在攻略网站上下载图片，然后PS扣取图片
然后全部将图片放在Unity工程中设置Sprite格式（注意修改图片名字成英文）
字体文件创建个Font名字的文件夹存放
（ArtRes目录是自定义创建的目录，用来存放美术资源。工程文件划分清楚结构是一个很有必要事情）
制作第一个关卡
创建界面
创建一个新的画布，在画布下面新建一个Image组件作为背景层图片。将Image组件的SourceImage选定为作业本的Sprite，调整好图片宽度和高度，铺满屏幕。
创建一个Text组件
组件的字体选择我们网上下载的字体
调整大小，输入抬头
这里注意这里的字体是纯显示用的，因此不能勾选RaycastTarget选项，否则我们的点击事件会点到字体上。
加入更多的装饰物体，这里先将钻石中间我们要用来达成通关的物体加上一个Button组件
基本上第一关的界面完成了，感觉像是那么回事，接下来要开始实现操作功能
UI的拖拽操作
创建一个DragUI名字的脚本，他主要功能为实现我们的拖拽操作。该脚本继承IDragHandler接口,这样Unity会检测到该UI发生拖拽操作的时候进入OnDrag函数
让输入的位置直接赋值给UI物体
将脚本拖到我们要移动的物体上
播放效果：
判定当前UI是否到达位置点
创建一个空的物体，添加2D碰撞脚本，设置BoxCollider2D的Size大小适应我们想判定成功的区域大小
因为我们是在抬起操作的时候判定UI是否达到目标区域，因此在DragUI中增加点击位置抬起接口。
在OnPointerUp（）函数中我们利用Unity的碰撞检测，检测UI是否在设定的目标区域内。如果处于目标区域我们将UI固定到目标区域位置。
这里新添加了名为targetCol的属性，用来关联外部的目标碰撞区域，将之前设置的目标物体拖到脚本的targetCol框中完成绑定。
运行的效果：
我们将之前拼的界面UI放在一个名为Tran_Puzzle空的挂点下，表示解谜界面。创建一个Tran_Pass空的挂点，里面放一个Text文本写上通关的文字，表示一个通过界面。
这样我们就可以直接控制两个挂点的开关激活来实现界面的变化
在这里我们拖拽UI到达目标点后，代码只要将解谜界面关闭，通关界面打开就实现该次通关。
运行效果：
