关键字：paper2D，Flipbook，Sprite，Input
为什么有这篇文章？
这篇文章是笔者在学习了UE4官网Paper2D教程之后，以自己的意愿为主，结合学到的东西所弄出来的一个基础项目。笔者在不断的学习过程中，发现一个问题，那就是要巩固自己学到的东西非常困难，即便是学会，弄懂，也很快会忘记。于是，笔者就想出了一个方法，那就是学完之后，写一篇自己的文章，只有看的人都能看懂，那么这部分的知识才能算是掌握了。
要流畅的读懂这篇文章，需要读者对UE4编辑器有一个基本的认知（至少得知道编辑器怎么操作，界面上有哪些功能吧）。如果你从未接触过UE4，请先跟着官方视频学习，相信我，官方视频是最好的入门教材。
做哪些功能？
本文会创建一个基本的可运行的Paper2D项目，你可以在这个项目的基础上进行迭代，开发出你自己的作品。具体的内容是：
- 创建一个背景
- 创建一个可操作的长耳精灵角色
- 为长耳精灵添加待机和跑步动画
- 添加对长耳精灵的操作（向左和向右跑动）
准备工作
打开UE4（笔者用的是最新的4.20.1），创建一个空的蓝图项目（不包含初学者内容）。
在正式开始前，我们先做一些准备工作。首先，在内容浏览器中创建5个文件夹，分别是：Blueprints，Data，Flipbooks，Sprite，Textures。所有的资源都会放到相应的文件夹中去，创建完成之后，内容浏览器是这个样子的：
然后，准备要用到的图片资源。这次我们用到的资源不多，一张背景图，一组待机帧图片，一组跑动帧图片。下载图片资源，请点击这里。
接着，将图片都导入到工程中，只要把所有的文件都拖到内容浏览器的Textures文件夹里面就可以了。注意不能直接把文件复制到Textures目录下面，编辑器需要对这些资源进行一次转换。因为我们的动画文件名有冲突的地方，所以要修改一下动画的文件名，比如把待机图片文件名改成ElfIdle_1。导入成功后，我们的Textures文件夹就变成了这个样子：
注意：导入背景图的时候UE4可能会将它转换成Normal Map，这时需要把它还原回来。至于为什么会是这样子，大概是我们的背景图太蓝了......
添加背景
现在，我们要将背景图添加进去了。在此之前，我们先要修改一下场景的显示方式：将视角切换成前端，渲染模式改成带光照，然后点开显示标签，去掉Grid标记（这一步可以在加完背景之后再去掉，因为调整背景位置的时候需要用到Grid对其位置）：
在内容浏览器里右击Iceland，选择Sprite操作->创建Sprite。将创建出来的Sprite移动到Sprite文件夹里去。然后，把它拖到场景中。调整图片的位置，使其位于x轴的上方（Z轴正半轴），然后在细节面板上修改其位置，将Y值改成-100，如图所示：
（改完别忘了把Grid标记去掉）
创建Flipbook
与Iceland类似，选中所有的待机和跑动的帧图片，右击选择Sprite操作->创建Sprite。将创建出来的Sprite全部移动到Sprite文件夹中去。
选中所有Idle Sprite，右击选择“创建图像序列视图”，将新创建的序列视图命名为ElfIdle，这就是我们要用到的Flipbook。把这个Flipbook移动到Flipbooks文件夹下。
Flipbook这个单词非常好的阐释了它的意义，就是连续的帧动画。这是Paper2D中的动画工具。
然后，对Run Sprite做相同的操作，将Flipbook命名为ElfRun，并且将它也以移动到Flipbooks文件夹下。
双击打开Flipbook，看看动画是快了还是慢了，调整到你觉得合适的速度：
添加角色
从这一步开始，就要进入难啃的环节了。首先我们需要创建一个Blueprint，在Blueprints文件夹下右击，选择蓝图类，选择PaperCharacter继承，将蓝图类命名为MyCharacter。
双击打开MyCharacter，选中Sprite组件，在细节面板中将Source Flipbook改成之前我们创建的ElfIdle：
改完之后，在视口标签页下，你应该能看到有一个妹子在那里不停地抖来抖去。不过有点不协调的是，那个胶囊体太大了，不适合妹子的“身材”，需要调整。
选中上方的CapsuleComponent组件，在其细节面板里修改Shape下的Capsule Half Height属性和Capsule Radius属性，将其改的适合妹子的身材大小（比如改成60和24）：
角色弄好了，接下来就是视角的工作。我们需要一个以角色为中心的摄像机，能够拍到当前场景的那种。这就需要在角色上添加两个组件：Spring Arm和Camera。Camera组件以Spring Arm为父组件，如图所示（CameraBoom是组件名）：
CameraBoom的Z旋转量需要设置成-90，因为要正对着角色。去掉Do Collision Test和Inherit Yaw，因为我们的摄像机不需要碰撞和旋转。
Camera组件也需要进行设置。将Project Mode设置为正交（Orthographic），Ortho Width设置一个大一点的数，比如1600，这样就能看到一个比较广的场景。
好了，大功告成，下一步就是把它放到场景中去测试一下。把一个玩家起始节点拖入到背景图上，放到合适位置。然后，新建一个Blueprint，继承自GameModeBase，命名成PaperGameMode。双击打开PaperGameMode，将Default Pawn Class改成MyCharacter，然后编译，保存：
回到编辑器主界面，选择左上角的编辑->项目设置，打开项目设置对话框。在左侧列表中点击“地图&模式”。将Default GameMode，Editor Startup Map，Game Default Map改的和下图一致：
完成之后，运行测试一下，嗯？妹子怎么掉下去了？这肯定不对啊，这场景中我们不需要重力。于是乎，在“世界大纲视图”中双击关卡打开世界设置，在Physics一节中选上“Override World Gravity”，将“Global Gravity Z”设置成0.0：
再次运行，我们可爱的妹子就在场景里啦：
操作响应
最后一步，也是最繁琐的一步。
要想让关卡响应操作，首先必须要设置工程的输入状态。这一步同样是要到编辑->项目设置中去操作。选中引擎一节下的输入标签，添加Axis Mappings，将其命名成MoveRight。
双击打开MyCharacter。我们要实现的功能很简单，当我们按下向右方向键时，角色向右跑动；当按下向左键时，角色向左跑动。要做好这些功能，我们就要做到以下两点：
- 1、角色的朝向必须正确，向左或者向右跑的时候其朝向必须一致。
- 2、按键按下的时候切换到移动状态，动画也必须切换到跑步动画。
移动
移动的功能比较容易，当我们按下向左或者向右键的时候，记录当前的移动方向，然后根据这个移动方向，确定角色的位置是沿着X轴正半轴还是负半轴的方向增加。
这里我们要用到之前添加的MoveRight事件和蓝图自带的MoveUpdatedComponent方法。下面是实现的原理：
对于每次的输入事件，判断当前的移动方向（MovingDirection），设置当前的方向值（Direction）。然后更新Character的位置，使用的数据是一个已经设置好的速度（Velocity）和方向的乘积。
移动方向（MovingDirection）是一个枚举类型，这个对象在Data文件夹中创建。里面包含了3个字段：Left、Right和Origin，用来表示三种不同的方向。
动画
动画的功能稍稍复杂一些。首先我们需要根据按键来设置移动的方向，按下按键的时候设置成指定方向，释放按键的时候将方向复原。
然后，当按下按键的时候，我们也需要设置角色的朝向，这就需要用到Set Control Rotation函数。因为我们角色的初始状态是朝右，所以当我们按下左方向键的时候，角色就需要绕着Z轴转180度。
最后，按下方向键也需要将Flipbook切换一下，这就要用到Set Flipbook函数，跑步的时候设置成Run，释放的时候设置成Idle。
将这一切都综合起来，我们的动画设置脚本就浮出水面了：
好，一切都准备就绪，编译运行，你就拥有了一个可以操作的2D场景：
哈哈，很有成就感吧！当然，如果你遇到了问题也不要紧，请随意在下面留言提问。同时，笔者的项目地址也会给出，你可以到笔者的码云上找到这个项目。
总结
本文的移动实现和官方教程中的实现完全不一样，其原因是在我们的场景中不需要重力。这样，移动的时候就没有了阻力，即便是释放了按钮角色也会继续移动。所以，笔者就自己弄了一套逻辑。
不过，笔者真正想说的是：学习一定要做一些和教程中不一样的东西，这样，你就会发现有可能一个不起眼的小东西就会困扰你很久，当你把它实现了的时候，你就能获得巨大的进步和成就感，这对我们来说是弥足珍贵的。
