wordpress邮箱修改,江西seo推广软件,孟村住房建设局网站,广告设计公司的简介怎么写以前在玩小游戏的时候发现有的小游戏背景图一直再动#xff0c;视觉效果挺好#xff0c;给人一种炫炫的感觉#xff0c;让我这写后台的码农很是羡慕和膜拜。没想到天意弄人#xff0c;我也开始写游戏前端了刚接触CocosCreator,好多东西都不懂#xff0c;整个懵逼状态…以前在玩小游戏的时候发现有的小游戏背景图一直再动视觉效果挺好给人一种炫炫的感觉让我这写后台的码农很是羡慕和膜拜。没想到天意弄人我也开始写游戏前端了刚接触CocosCreator,好多东西都不懂整个懵逼状态然后只能硬着头皮上来写其实写代码思路还是有的就是api和工具用起来有点陌生。这不下午有个前端大佬让我弄个游戏背景图循环播放功能说是游戏里会用到然后就撸起袖子开干了。大致思路:1. 既然是至少轮播得有两张图吧2. 轮播是肯定是要修改坐标的横播就是改X坐标竖播就是改y坐标3. 循环播就是一张播放完毕得重新修改它的坐标等待下次播放算了直接点还是直接来代码吧。在资源管理器新建一个TypeScript文件重命名为Game,然后把Game文件拖到层级管理器的Cavas下面。Game内容如下const {ccclass, property} cc._decorator;ccclassexport default class Game extends cc.Component {property({displayName: 播放速度})speed: number 0; // 移动时控制速度的变量property({displayName: 播放方向0横1竖})orient: number 0;// 0横 1竖property( {displayName: 背景图, type: cc.Node})bgArr: cc.Node[] []; // 用于管理背景图片结点的数组,记得回cocos面板中添加数组的结点数量curBg: cc.Node null;// 当前播放背景nextBg: cc.Node null;// 即将播放背景curIndex: number 0;// 当前播放背景索引xy:string x;// x | ywh:string w;// 宽高// 是否可以播放move:boolean true;start () {if (this.bgArr.length 0) {this.move false;return;}// 如果只有一张背景图则克隆一个if (this.bgArr.length 1) {this.bgArr[1] cc.instantiate(this.bgArr[0]);this.bgArr[0].parent.addChild(this.bgArr[1]);}this.xy this.orient 0 ? x : y;this.wh this.orient 0 ? width : height;this.curBg this.bgArr[this.curIndex];this.nextBg this.bgArr[this.curIndex 1];// 设置背景图坐标this.setBgPosition();}/*** 设置背景图坐标*/setBgPosition () {this.bgArr[this.curIndex][this.xy] 0;this.bgArr[this.curIndex 1][this.xy] - (this.curBg[this.wh] / 2 this.nextBg[this.wh] / 2);}update (dt) {this.bgMove();}/**** param bgList* param speed 速度*/bgMove() {if (this.move) {this.curBg[this.xy] this.speed;this.nextBg[this.xy] this.speed;// 当前背景图已播放完if(this.curBg[this.xy] this.curBg[this.wh]) {this.curBg this.nextBg;this.nextBg this.bgArr[this.curIndex % this.bgArr.length];this.nextBg[this.xy] this.curBg[this.xy] - this.curBg[this.wh] / 2 - this.nextBg[this.wh] / 2;}}}}把要播放的背景图拖入层级管理器的Cavas下面坐标设置如下图给Game脚本属性赋值(把背景图拖入进来)如图以上就是CocosCreator实现轮播图的一个思路。代码获取
