我的第一个上线小程序,案例实战篇二——LayaAir游戏开始界面开发
不知不觉我的第一个小程序已经上线一周了,uv也稳定的上升着。
很多人说我的小程序没啥用,我默默一笑,心里说:“它一直敦促我学习,敦促我进步”。我的以一个小程序初衷是经验分享,目前先把经验分享到博客园,边学习边完善小程序。同时我会持续学习,持续更新,功能定会一天天的完善起来。
欢迎大家扫码体验。
闲话少叙,今天我们一起来练习LayaAirIDE搭建游戏开始界面。
既然要开发游戏,那自然少不了图片素材,大家可以根据实际情况自行备图。大致一下几种素材图片:
1、一张背景图片(750*1333)
2、开始按钮背景图片,尺寸自己选择即可
3、游戏规则按钮背景图片,尺寸自己选择即可
4、其它的游戏名称图片和Logo之类的图片可以自行选择
素材准备好了,下面就是一个字,干!
第一步:新建一个空的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() { } }
最终效果图:
若是喜欢微信小游戏开发,不妨和我一起学习成长!!!
- 我的第一个上线小程序,案例实战篇一
- 【Cocos2d-X游戏实战开发】捕鱼达人之开始场景的创建(三)
- Scala 深入浅出实战经典 第97讲:使用SBT开发Akka第一个案例环境搭建详解
- IOS开发笔记 (4) ---第一个IOS界面程序兼谈IB在XCode4.2中的应用
- 跟着BOY学习开发cocos2d-x 游戏 实战篇(6)之 游戏主界面 -----绚丽的魔法特效
- 跟着BOY学习开发cocos2d-x 游戏 实战篇(3)之 游戏主界面 -----武器系统---散花弹
- 如意小程序开发实战:实现九宫格界面的导航
- IT运维人员追女友必备神器之运维开发实战程序案例
- 跟着BOY学习开发cocos2d-x 游戏 实战篇(3)之 游戏主界面 -----武器系统---散花弹
- Android开发_libgdx游戏引擎教程 ApplicationListener,着手第一个程序! (六)
- cocos2d-x游戏开发 跑酷(一)开始界面
- 第92讲:Akka第一个案例动手实战开发环境的搭建
- quick cocos2d-x 实战:做一个手机横版格斗游戏3:游戏开始界面切图
- 【代码笔记】多线程游戏开发——伏魔记:第一步——开始游戏界面实现(一)
- 参与开发的第一个ipad游戏上线――缅怀曾..
- 第93讲(HelloActor整体介绍):Akka第一个案例动手实战开发消息实体类
- [Cocos2d塔防游戏开发]Cocos2dx-3.X完成塔防游戏《王国保卫战》--游戏开始界面
- Html5 Egret游戏开发 成语大挑战(三)开始界面
- 跟着BOY学习开发cocos2d-x 游戏 实战篇(4)之 游戏主界面 -----怪物系统---赌徒来袭
- 跟着BOY学习开发cocos2d-x 游戏 实战篇(2)之 欢迎 界面编写