2D游戏入门——小狐狸系列（二）处理素材

这个课程源自b站Up主M_Studio，链接：https://space.bilibili.com/370283072
这个系列都是我自己的学习笔记，以供以后查看

Session01：安装软件&导入素材

比较简单，跳过了。

Session02：编辑素材& Tilemap

导入背景图

直接将背景图片拖到Hierarchy窗口，默认坐标就是（0，0）

导入素材发现这个背景的pixels per unit是100，也就是每个小格子包含100*100个像素点

这样图片导入进去会非常小，就像这样，因为back是384*240的，所以可以看到宽度为3.8个格，高度为2.4个格

我们把它修改为16，也就是每个单元格有16*16的像素，就能正常显示了

创建场景

2D游戏中有一个非常常用的功能，叫做TileMap（瓦片地图），我们可以直接在Hierachy中创建它

可以看到屏幕中出现了很多网格，我们就是要在这些网格上画东西，为了方便，我们先将back隐藏：

要在这些“瓦片”上画东西，需要使用Tile Palette，可以在window->2d找到

打开之后就是这样的：

这里有两张图片，一个是已经“切好的”，一个是没有切过的，这里演示一下具体是怎么切的

选中tileset，在inspector窗口里修改以下选项

Sprite介绍

以下引自知乎：https://www.zhihu.com/question/51438507

Sprite直接翻译过来是精灵，在游戏开发中，可以独立于背景独立移动的二维位图被称为Sprite，它们可以有独立的屏幕坐标、帧率、周期等等，在最终渲染时，它们会与背景等一起被合成为你看到的每一帧画面。

对于早期的视频游戏，这种合成并非像现在用GPU来做，而是通过电路、显像管等硬件在显示器逐行扫描时实现的。由于这些可被移动的对象（movable objects)并不属于显存(framebuffer)中的位图数据，而像是“浮”在之上的，就像鬼或者小妖精(Sprite)一样，因此得名。

随着CG的发展，Sprite的含义也得到拓展，只要是用于合成的相对独立的二维位图，都可以被称作Sprite，比如Flash等游戏引擎中就有使用Sprite这样的概念。另外，游戏中的Sprite通常都有自己的状态、动画，所以美术师和程序员会通过SpriteSheet这样的素材进行合作。

通过导出导入SpriteSheet的各种坐标信息，程序员就可以直接获得设计师设计好的动画效果，并且直接运用在游戏开发中。

这种做法被前端工程师以节省网络I/O（即HTTP请求线头阻塞）的目的借鉴去之后，就沿用了Sprite这个名字，配合CSS background-position，便可以做到在一张大图中切出各个小图的目的。

切割图片

调整好参数后，点击Sprite Editor

将Type改为Grid By Cell Size，Pixel Size改为16*16（因为之前设置的一个单元格16个元素，这样设置之后就是一个单元格一个图片），点击Apply，就切割好了

绘制场景

把切割好的图片拖到Tile Palette，就可以进行绘制了