Skip to content

创建随机地图

Howard edited this page Jun 17, 2020 · 9 revisions

你可以通过D5引擎的随机地图,来创建一个完全随机生成的地图场景。如果你没有保存数据,那么每次进入游戏,都会产生一个完全崭新的地图。创建随机地图非常简单。

首先,我们需要两个容器,用来存放地图和角色。并以此将他们添加到舞台上。

    var map_layer:egret.DisplayObjectContainer = new egret.DisplayObjectContainer();

    var char_layer:egret.DisplayObjectContainer = new egret.DisplayObjectContainer();

    this.addChild(map_layer);

    this.addChild(char_layer);

接下来,我们准备好摄像机和角色所要使用的变量。

    var c:d5power.Camera;

    var char:d5power.SingleFrameCharacter;

就像你看到的代码,我们使用变量c来存储摄像机,使用char来存储我们的角色。由于这只是个简单的Demo。我们就使用D5中提供的单帧角色SingleFrameCharacter就可以了。它可以直接使用整张图片来作为我们的角色。

接下来,就可以创建随机地图了。

    var m:d5power.BaseRandMap = new d5power.BaseRandMap();

    m.setContainer(map_layer);

    m.generate(301,onReady,this,320,320,64,64);

我们把地图的容器设置为刚才创建好的map_layer,然后通过generate方法,产生一个包含320320块区块,每个区块尺寸为6464的地图。然后提供一个onReady方法,在地图生成好之后,将自动调用这个方法。

这里要说明的时,随机地图会自动在最靠近水的一个位置,创建角色出生点。而这个出生点的坐标将作为onReady方法的参数,在生成地图完成后自动传回。所以,接下来我们只需要在出生点来创建角色就可以了。当然,顺便我们还可以创建摄像机。

    var onReady:Function = function(p:egret.Point):void
    {

        c = new d5power.Camera(m);

        char = new d5power.SingleFrameCharacter(m);

        char.setPos(p.x,p.y);

        char.setSkin('resource/demo.png');

        c.focus = char;

        char_layer.addChild(char.monitor);

        that.addEventListener(egret.Event.ENTER_FRAME,render,this);

        that.touchEnabled = true;

    }

接下来就是渲染事件了,我们给主场景增加ENTER_FRAME侦听。然后在这个侦听中去触发摄像机、角色、地图的数据更新和渲染就OK了

    var render:Function = function():void
    {

        var t:number = egret.getTimer();
        
        char.run(t);

        c.update();

        m.render();

    }

就这么简单。下面是完整的Main.ts代码。

class Main extends egret.DisplayObjectContainer {

public constructor() {
    super();
    this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}

private onAddToStage(event: egret.Event):void {

    var that:Main = this;
    var render:Function = function():void
    {
        var t:number = egret.getTimer();
        
        char.run(t);
        c.update();
        m.render();
    }
    var onReady:Function = function(p:egret.Point):void
    {
        c = new d5power.Camera(m);
        char = new d5power.SingleFrameCharacter(m);
        char.setPos(p.x,p.y);
        char.setSkin('resource/demo.png');
        c.focus = char;

        char_layer.addChild(char.monitor);
        that.addEventListener(egret.Event.ENTER_FRAME,render,this);
        that.touchEnabled = true;
    }

    var map_layer:egret.DisplayObjectContainer = new egret.DisplayObjectContainer();
    var char_layer:egret.DisplayObjectContainer = new egret.DisplayObjectContainer();

    this.addChild(map_layer);
    this.addChild(char_layer);

    var c:d5power.Camera;
    var char:d5power.SingleFrameCharacter;
    var m:d5power.BaseRandMap = new d5power.BaseRandMap();
    m.setContainer(map_layer);
    m.generate(301,onReady,this,320,320,64,64);

    
   
}


private onUIReady():void
{

}
}

`