编写一个移动的游戏背景（含素材视频教程）

教程目录：

1. 小游戏展示
2. 下载游戏引擎
3. 创作一个移动的背景
4. 让阿菌煽动翅膀
5. 让阿菌模拟重力下坠
6. 让阿菌可以摸鱼
7. 编写游戏开始与结束
8. 编写 boss 剧情
9. 部署到服务器，在手机玩耍
10. 视频教程链接

进入工程项目后就可以开始开发了，首先我们把游戏所用到的图片等资源文件放到 assets 目录中

关注公众号：阿菌的打工日记，在菜单栏即可获取资源地址

然后我们设置游戏画布的大小为 640 * 1386（阿菌自己画的背景素材也是这么大）：

接着我们把背景拖拽到节点树中，放置在 Canvas 总节点下面，这样就得到了一个静态的背景图：

想要得到一个看起来不停往后退的山水背景，我们只需要不断将图片往后移动就可以了。

于是我们编写脚本：

const {ccclass, property} = cc._decorator;@ccclass
export default class NewClass extends cc.Component {@property(cc.Node)bg1: cc.Node = nullstart () {}update (dt) {// 背景图片每一帧移动 2 this.bg1.x -= 2;}
}

当然，这么做的话，画面虽然动了起来，但是背景图片很快却移动到了屏幕外。

这个时候我们可以用两张背景图片拼接在一起，每当一张图片移动到屏幕外面后，后面拼接的图片可以补上（所有不好理解的地方请看视频哈）：

判断背景图片是否移出屏幕的代码：

update(dt) {// 背景图片逐帧移动一定的距离this.bg1.x -= 2;// 当背景移动到屏幕左边后if (this.bg1.x <= -640) {// 重新设置它的横坐标，使其从画面右侧重新进入场景this.bg1.x = 640}this.bg2.x -= 2;if (this.bg2.x <= -640){this.bg2.x = 640}
}

就这样，我们便完成了一个不断倒退的背景图片，有了一些些动感。

推荐阅读：微信飞机大战小游戏详细教程

编写一个移动的游戏背景（含素材视频教程）相关推荐

编写游戏开始界面与结束提示（含素材视频教程）
教程目录: 1. 小游戏展示 2. 下载游戏引擎 3. 创作一个移动的背景 4. 让阿菌煽动翅膀 5. 让阿菌模拟重力下坠 6. 让阿菌可以摸鱼 7. 编写游戏开始与结束 8. 编写 boss 剧情 ...
游戏轮播图片-制作煽动翅膀的效果（含素材视频教程）
教程目录: 1. 小游戏展示 2. 下载游戏引擎 3. 创作一个移动的背景 4. 让阿菌煽动翅膀 5. 让阿菌模拟重力下坠 6. 让阿菌可以摸鱼 7. 编写游戏开始与结束 8. 编写 boss 剧情 ...
编写一个C程序，实现以下功能：定义一个学生结构体Student(含学号、姓名、年龄、身高)和一个函数sort(struct Student *p)，该函数使用选择排序法按年龄由小到大排序。在主函数中
编写一个C程序,实现以下功能: 定义一个学生结构体Student(含学号.姓名.年龄.身高)和一个函数sort(struct Student *p),该函数使用选择排序法按年龄由小到大排序.在主函数中 ...
java实现：使用递归编写一个程序，逆序输出一个非负整数。例如输入1234，输出4321(不含前导0)。
验证集: 输入>输出 123>321 120>21 2040>402 204000>402 直接给代码,注释应该够了. //使用递归编写一个程序,逆序输出一个非负整数. ...
python中用于释放类占用的资源的方法是()_编写一个简易计算器,要求根据输入的数字和四则运算符号,计算运算结果并输出。_学小易找答案...
[简答题]20191220 课前作业新工作页4.1的3-5-3页的填空题,参考教材P135-P144 [简答题]AutoCAD改编视图,尽量不用虚线 1. 主视图采用局部剖,表达右上角小圆筒(及孔) ...
Java黑皮书课后题第7章：*7.13（随机数选择器）编写一个方法，返回1到54之间的随机数，但不能是传递到实参中的数。指定如下方法头
7.13(随机数选择器)编写一个方法,返回1到54之间的随机数,但不能是传递到实参中的数.指定如下方法头题目题目描述可变长参数列表破题代码运行实例题目题目描述 7.13(随机数选择器) ...
Java黑皮书课后题第5章：**5.19（打印金字塔形的数字）编写一个嵌套的for循环，打印下面的输出
**5.19(打印金字塔形的数字)编写一个嵌套的for循环,打印下面的输出题目题目概述破题代码结果进阶代码代码内容输出结果题目题目概述 5.19(打印金字塔形的数字)编写一个嵌套的 ...
Java黑皮书课后题第5章：5.6（英里与千米之间的互换）编写一个程序，并排显示下面两个表格
5.6(英里与千米之间的互换)编写一个程序,并排显示下面两个表格题目题目概述破题代码题目题目概述 5.6(英里与千米之间的互换)编写一个程序,并排显示下面两个表格英里千米千米英里 ...
Java黑皮书课后题第5章：5.5（千克与磅之间的互换）编写一个程序，并排显示下面两个表格
5.5(千克与磅之间的互换)编写一个程序,并排显示下面两个表格题目题目概述破题代码题目题目概述 5.5(千克与磅之间的互换)编写一个程序,并排显示下面两个表格千克磅磅千克 1 2. ...

编写一个移动的游戏背景（含素材视频教程）

编写一个移动的游戏背景（含素材视频教程）相关推荐

最新文章

热门文章