个人第一个上线小程序,案例实战篇二——LayaAir游戏开始界面开发

不知不觉个人第一个小程序已经上线一周了,uv也稳定的上升着。javascript

不少人说个人小程序没啥用,我默默一笑,内心说:“它一直敦促我学习,敦促我进步”。个人以一个小程序初衷是经验分享,目前先把经验分享到博客园,边学习边完善小程序。同时我会持续学习,持续更新,功能定会一每天的完善起来。html

欢迎你们扫码体验。java

闲话少叙,今天咱们一块儿来练习LayaAirIDE搭建游戏开始界面。小程序

既然要开发游戏,那天然少不了图片素材,你们能够根据实际状况自行备图。大体一下几种素材图片:微信

一、一张背景图片(750*1333)学习

二、开始按钮背景图片,尺寸本身选择便可this

三、游戏规则按钮背景图片,尺寸本身选择便可code

四、其它的游戏名称图片和Logo之类的图片能够自行选择htm

素材准备好了,下面就是一个字,干!blog

第一步:新建一个空的LayaAir 空项目(PS:不会的话,清先跳转个人第一个上线小程序,案例实战篇一

第二步:咱们建立一个StartScene的场景,而且设置其宽度750,高度1333,点击肯定

第三步:咱们将场景切换到编辑模式,在Assets文件处右键-》新建目录-》并命名为images文件夹。如图:

而后咱们把准备好的图片素材拖拽至images文件夹上便可将图片放入该文件夹中。

第四步:咱们选中StartScene.scene场景文件,对场景进行编辑。

咱们想场景中拖入一个image,并向其经常使用属性skin中拖入咱们准备好的背景素材。

咱们继续向场景中拖一个button,并设置其var 属性为btnRule,设置其stateNum为1,向其经常使用属性skin中拖入咱们准备好的规则背景素材。

咱们继续向场景中拖一个button,并设置其var 属性为btnStart,设置其stateNum为1,向其经常使用属性skin中拖入咱们准备好的开始背景素材。

第五步:咱们把窗口切换到IDE的代码模式,在src目录下面新建一个scripts的文件夹,在scripts文件夹右键-》新建模板文件-》新建脚本文件,命名为StartScene点击肯定生成脚本文件,脚本和场景关联你们能够参考第一步。代码以下:

export default class StartScene extends Laya.Scene {

    constructor() { super(); }
    onBtnRoleClick(){

    }
    onBtnStartClick(){

    }
    onEnable() {
        this.btnRule.on(Laya.Event.CLICK,this,this.onBtnRoleClick);
        this.btnStart.on(Laya.Event.CLICK,this,this.onBtnStartClick);
    }

    onDisable() {
    }
}

  

最终效果图:

 

如果喜欢微信小游戏开发,不妨和我一块儿学习成长!!!

原文出处:https://www.cnblogs.com/wyang/p/10290218.html

相关文章
相关标签/搜索