LayaAir 绘制微信小游戏开放数据域画面

LayaAir 绘制微信小游戏开放数据域画面

请大家关注我的微博:@NormanLin_BadPixel坏像素

之前写过用cocosCreator绘制微信小游戏子域的教程,保持整体思路不变,现在再写一下用Laya的。
虽然官方有文档说明,不过我觉得写得不够详细,而且会遇到很多问题。

子域工程

子域的工程,无论大家是用什么创建的。我的是用ccc(cocosCreator,下同)创建的。

主域

创建控制子域画面的脚本。

function SubViewController() {
    this.SubView = new Laya.Sprite();
    this.Node = new Laya.View();
    this.Node.width = Laya.stage.width;
    this.Node.height = Laya.stage.height;
    Laya.stage.addChild(this.Node);
    this.Node.addChild(this.SubView);
}

上面的脚本,添加了一层画面,在这个画面上,会绘制子域的画面。跟其他UI的层级关系大家自己处理。

SubViewController.prototype.UpdateView = function () {
    if (Laya.Browser.onMiniGame) {
        this.SubView.graphics.clear();
        if (this.SharedCanva == null) {
            this.SharedCanva = wx.getOpenDataContext().canvas;
            var width = Laya.stage.width;
            var height = Laya.stage.height;
            this.SharedCanva.width = width;
            this.SharedCanva.height = height;
            //缩放子域画面。因为我子域画面的长宽比是16:9(写死吧,简单的自适应)
            //如果根据高度缩放,大家换成scaleX自己算。
            this.SubView.scaleY = (9 / 16) * (height / width);
            this.SubTex = new Laya.Texture(sharedCanvas);
        }
        if (this.SharedCanva != null) {
            this.SubTex.bitmap.alwaysChange = true;//小游戏使用,非常费,每帧刷新
            this.SubView.graphics.drawTexture(this.SubTex);
            //我这里试着不把alwaysChange设为true,结果发现没有绘制。所以这里让他设为true持续n帧。(我是设置了3帧)
            this.SubView.frameOnce(3, this, this.CloseChange);
        }
    }
}
SubViewController.prototype.CloseChange = function () {
    if (this.SubTex) {
        this.SubTex.bitmap.alwaysChange = false;
    }
}

这里注意,我这样写的前提是不是每帧都更新子域画面,因为Laya绘制子域画面性能贼差,所以我这段代码只有在需要更新画面的时候再调用。

如果你要每帧更新,那就用官方的方法吧。

猜你喜欢

转载自blog.csdn.net/Norman_Lin/article/details/80541155