**这是小蚂蚁游戏开发公众号原创的第38篇。如果你没有任何的游戏开发经验，欢迎阅读我的“人人都能做游戏”系列教程，它会手把手的教你做出自己的第一个小游戏。 在“精致1010”游戏中，我们会使用网格作为底，然后在上方放置方块，类似于下面这样。 [图片] 这一节我们就试着动态的创建一个10x10的网格。 首先，熟悉一下微信小游戏制作工具中的坐标系。 [图片] 如图，蓝色线框中间的区域为游戏最终能够显示的区域，如果一个物体位于蓝色的线框外，那么最终在游戏界面中是不会显示的。红色的坐标轴，水平方向为x轴，竖直方向为y轴，中心点（0,0）位于显示区域的正中央。图中的白色的正方形线框的位置就是（0,0），即位于屏幕的正中央。以后，当你遇到一个物体位置为（500,500）时，你就应该知道它大概位于屏幕的右上方。 接下来，我们要画一个方格，方格的中间位置位于屏幕的正中央，把它放在坐标系里应该是这个样子。 [图片] 我们将从左下角开始，一行一行的向上绘制，直到网格绘制结束。想要绘制网格，需要知道以下几项数据。 单个正方形格子的边长 n网格的总行数 r网格的总列数 c这几项数据可以帮助我们计算出起点的位置以及每一个格子的位置。 [图片] 如图，根据已知的数据，可以计算出起点的位置，然后根据起点的位置可以计算出网格中的每一个格子的位置。 下面开始进行绘制操作。 先在场景中导入一个小的正方形线框。 [图片] 如图，导入了一个边长为64的正方形线框（线框的边为2个像素），如果你没有正方形的线框资源，可以使用下方的正方形64x64的线框。 [图片] (上方是一个白色线框图片（64x64），如果你的背景是白色的话，会看不到) 先将图片保存到电脑上，然后通过微信小游戏开发工具中的“上传素材”，将线框添加到自己的素材库中，然后就可以在开发工具中使用了。 接着，我们创建几个全局变量。 [图片] “单个格子边长”，“总行数”，“总列数”是上方提到的需要设置的3个数据，“起点X坐标”“起点Y坐标”用于存储计算出的起点位置。“行号”和“列号”用于循环遍历使用。 选择“线框方块”对象，为其增加如下的逻辑。 [图片] 场景启动后，首先根据“总行数”“总列数”“单个格子的边长”三个变量计算出起点X和Y坐标，并存储在全局变量中，然后接着进行一个双层循环遍历依次创建网格中的每一个单元格。每个单元格被创建后，通过“起点坐标”，“行号”，“列号”和“格子边长”计算并设置自己的位置。 点击“预览场景”看一下结果。 [图片] 如图，在屏幕的正中央创建了一个10x10的网格。仔细观察一下，网格内部的线要比网格四周的线粗。这是因为每个单元格的边框线是2个像素，我们使用64作为单个格子边长的话，两个格子拼接处的边框线就会变为4个像素，我们调整一个“单个格子边长”的全局变量，将其数值设置为62。这样两个格子的拼接处的边框线就会重叠，依旧保持2个像素。 修改“单个格子边长”的全局变量数值为62，再次点击“预览场景”看下效果。 [图片] 可以看到所有的线都一样粗了，都是2个像素。 接着我们将“单个格子边长”设置为68，看一下。 [图片] 看起来似乎也不错，组成的网格的每个格子看起来都是独立的。 你可以通过设置“总行数”“总列数”“单个格子边长”的数值，来看一下不同的数值下最终生成的网格的效果。 总结一下： 这一节我们学习了动态的创建一个网格，并且通过设置全局变量的数值来控制最终生成的网格的效果。 练一下： 当前的网格总是在屏幕的正中间显示（即中心点为(0,0)），试着使用全局变量来设置网格的中心点。通过设置中心点的位置，来控制最终网格在屏幕中的显示位置。  最后，欢迎关注我的公众号：小蚂蚁游戏开发。有任何疑问，欢迎给我留言，我会尽可能的为你提供帮助。 [图片]

嗨！大家好，我是小蚂蚁。 今天给大家简单的介绍一下像素画，以及推荐两个画像素画的简单又好用的工具。 像素画，被称作是独立游戏开发者一人成军的必备技能。为什么这么说呢？我们都知道想要独自完成一个游戏的制作，你需要至少完成下面的这三个部分：美术，程序，音效。即使是一个再简单的游戏，这三者也缺一不可。 很多的独立游戏开发者刚开始做游戏的时候，基本上都是从某一方面擅长开始的。比如说小蚂蚁原本就是一个从事游戏程序开发的，如果我想要自己能够独立完成一个游戏的制作，就需要自己去解决美术和音效部分的内容。 音效相对容易解决，不会编曲，上网找一些开源的音效总是能够凑上的。但是美术方面就比较头疼了，为了规避美术上的短板，我一直都选择使用极简风格（不会美术又想做游戏，极简风格是最好的选择，为什么？看这里），但是极简风格终归只适合一部分类型的游戏，因为自身缺少美术能力，通常对于一些美术方面比较重要的游戏就只能搁置了。 但是，像素画给了很多没有美术功底的人一个独自完成游戏美术的机会。不论你之前学没学过美术，是否是科班出身，都没关系，你都能够用一个一个的像素点，点出像模像样的画。 [图片] 如图，这些算是最极简的像素画了，画个写实的狗咱画不出来，用像素点出个像素狗，咱还是能办的到的。当然这些都是最简单最抽象的像素画，像素也可以画出很炫酷的效果，比如说这样的像素风景画。 [图片] 很明显这样的像素画就需要具备一定的美术功底了。 总之，像素画的范围很宽广，你可以用很少的像素画出一个极其抽象的角色，也可以用很多的像素画一个写实的人物。不论你是零基础的新手，还是有美术功底的高手，像素画都能用的上。 绝大部分程序出身的独立游戏开发者，基本上都是选择从像素画入手的，因为它能够让一个美术外行，以一己之力，包办整个游戏的美术工作。这也是为什么我们常说，像素画是独立游戏开发者一人成军的必备技能。 废话说完了，接下来给大家介绍两个我用过的，觉得不错的像素画工具。 1.Piskel 官网：https://www.piskelapp.com/ 这是一款完全免费的在线使用的像素画工具，可以绘制像素画，可以绘制动画帧。不用下载安装，浏览器中打开官网就能直接使用。 [图片] [图片] 2.Aseprite 官网：https://www.aseprite.org/ 在游戏开发者中用的最多的像素画工具，功能全面，是个收费软件，官网上卖的是 19.9 美刀，在 Steam 上购买几十块人民币，如果能遇上打折的话，十几块钱就够了。 [图片] [图片] 最后，展示一下我用 Aseprite 捣鼓一天，画的几个游戏角色。 [图片] 吐槽就算了，我的美术水平自己心里有数。只要看一眼能大概知道这是画了个啥就够了，难道你看不出来右侧的那两只是邪恶的兔子吗？最右边的那只嘴里还含着半个金币。你看，这就是像素画的好处。 另外，卖个关子，这些也是我的新游戏中的角色和敌人。新游戏是个飞行射击游戏，我只想做到两点，一点是上手简单，人人拿过来都能玩。另一点是要爽快，只要打开就很爽。 新游戏正在制作中，期待早日与你见面。 --- 欢迎关注我的微信公众号【小蚂蚁教你做游戏】，每天学点儿游戏开发知识。 [图片] 也欢迎加小蚂蚁微信(xiaomayi6669)，交个朋友。 [图片] 这里是小蚂蚁的小游戏系列，闲暇之余希望能给你带来片刻的放松和愉悦。无需下载安装，微信扫码可以直接玩啦！ [图片] [图片] [图片] [图片] [图片] [图片] [图片]