游戏功能是用TS实现的
一共两个类:
游戏入口:Main.ts
游戏逻辑:Ball.ts
处理微信逻辑:Platform.ts
开发过程中 调用小游戏wx方法 报错 所以定义了 Platform.ts 并且 在bin目录下增加Platform.js 文件
Platform.js 代码如下
class WechatPlatform { Instance = wx; } window.platform = new WechatPlatform();
Platform.ts
/** * 平台数据接口。 * 由于每款游戏通常需要发布到多个平台上,所以提取出一个统一的接口用于开发者获取平台数据信息 * 通过这种方式封装平台逻辑,以保证整体结构的稳定 */ declare interface Platform { Instance; } class DebugPlatform implements Platform { Instance = {}; } if (!window.platform) { window.platform = new DebugPlatform(); } declare let platform: Platform; declare interface Window { platform: Platform; }
Main.ts
import Handler = Laya.Handler; import Loader = Laya.Loader; import Point = Laya.Point; //主函数入口 class Main { constructor() { //修改sharedCanvas 大小 用于处理排行榜 if(Laya.Browser.window.sharedCanvas){ Laya.Browser.window.sharedCanvas.width = Laya.stage.width; Laya.Browser.window.sharedCanvas.height = Laya.stage.height; } //加载资源 Laya.loader.load([ { url: "https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/background.jpg" , type: Loader.IMAGE }, { url: "https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/qiu.png" , type: Loader.IMAGE }, { url: "https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/ballshadow.png" , type: Loader.IMAGE }, ], Handler.create(this, this.onLoaded)); } private onLoaded(): void { new Ball(); } } //初始化微信小游戏 Laya.MiniAdpter.init(); Laya.init(720, 1280); console.log("Game——————Start"); new Main();
Ball.ts
import Sprite = Laya.Sprite; import Render = Laya.Render; import Browser = Laya.Browser; let Matter = Browser.window.Matter; class Ball{ private engine:any; private footBall:any; private ballshadow:Sprite; private scoreLable:Laya.Text; private score:number; private rankSprite:Sprite = null; constructor() { this.score = 0; this.initUI(); this.initMatter(); this.initWorld(); } private initUI(){ let bg = new Sprite(); bg.loadImage("https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/background.jpg"); bg.on("mousedown", this, this.mouseDown); Laya.stage.addChild(bg); //微信小游戏绘制排行榜的精灵 this.rankSprite = new Laya.Sprite(); this.rankSprite.zOrder = 100; Laya.stage.addChild( this.rankSprite); //分数 this.scoreLable = new Laya.Text(); this.scoreLable.fontSize = 40; this.scoreLable.text = "得分:0"; bg.addChild(this.scoreLable); } private initMatter():void { // 初始化物理引擎 this.engine = Matter.Engine.create({enableSleeping: true}); Matter.Engine.run(this.engine); let render = Browser.window.LayaRender.create({ engine: this.engine, width: Laya.stage.width, height: Laya.stage.height, options: { // background: 'res/UI/background.jpg', wireframes: false } }); Browser.window.LayaRender.run(render); } private initWorld():void { let GameHeight = Laya.stage.height; let GameWidth = Laya.stage.width; //上 let top = Matter.Bodies.rectangle(GameWidth/2, 0, GameWidth,1, {isStatic: true, render: {visible: false} }); let leftWall = Matter.Bodies.rectangle(0,GameHeight/2,2,GameHeight,{isStatic: true,render: {visible: false} }) let rightWall = Matter.Bodies.rectangle(GameWidth,GameHeight/2,2,GameHeight,{isStatic: true,render: {visible: false} }) //地面 let ground = Matter.Bodies.rectangle(GameWidth/2,GameHeight, GameWidth,50, {isStatic: true, render: {visible: false},label:"g"}); this.ballshadow = new Sprite(); this.ballshadow.loadImage("https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/ballshadow.png"); this.ballshadow.pos(GameWidth/2,GameHeight-40); Laya.stage.addChild(this.ballshadow); let rockOptions = { density: 0.004, restitution: 0.8, render: {sprite:{texture:"https://lg-na2wup38-1256823928.cos.ap-shanghai.myqcloud.com/qiu.png", xOffset: 75, yOffset: 75}}}; this.footBall = Matter.Bodies.circle(GameWidth/2, GameHeight-50,75,rockOptions); this.engine.world.gravity.y = 4; Matter.World.add(this.engine.world, [leftWall,rightWall,this.footBall,ground,top]); Matter.Events.on(this.engine,'tick',function(event):void{ this.ballshadow.x = this.footBall.position.x-130 }.bind(this)); Matter.Events.on(this.engine,'collisionStart',function(event):void{ let pairs = event.pairs; let pair; for (var i = 0; i < event.pairs.length; i++) { pair = pairs[i]; if(pair.bodyA.label === "g" ||pair.bodyB.label === "g"){ if(this.score>0){ window.platform.Instance.saveUserCloadStorage(this.score); this.scoreLable.text = "得分:0"; this.score = 0; Laya.timer.once(300,this,this.showRank); } } } }.bind(this)); } private mouseDown(event):void{ var point = new Laya.Point(event.stageX,event.stageY) if(Matter.Bounds.contains(this.footBall.bounds,point)){ Matter.Body.applyForce(this.footBall,point,{ x :(this.footBall.position.x - point.x)/10,y:-10}); this.score++; this.scoreLable.text = "得分:"+this.score; } if(this.rankSprite.visible){ if(event.stageX <80 || event.stageX > Laya.stage.width -80 || event.stageY < 290 || event.stageY > 960){ this.rankSprite.visible =false; } } } private onResize():void { // 设置鼠标的坐标缩放 // Laya.stage.clientScaleX代表舞台缩放 // Laya.stage._canvasTransform代表画布缩放 // Browser.window.Matter.Mouse.setScale(this.mouse, {x: 1 / (Laya.stage.clientScaleX * Laya.stage._canvasTransform.a), y: 1 / (Laya.stage.clientScaleY * Laya.stage._canvasTransform.d)}); } //显示微信排行榜 private showRank():void{ if(Laya.Browser.window.sharedCanvas){ this.rankSprite.visible = true; let texture = new Laya.Texture(Laya.Browser.window.sharedCanvas); this.rankSprite.graphics.clear(); this.rankSprite.graphics.drawTexture(texture,0,0,texture.width,texture.height); } } }
源码地址:https://download.csdn.net/download/mytop_xj/10472042