本来没有计划学前端的,更没有计划学引擎。不过还真的想一出搞一出,觉得做后端没有界面无法展示自己想要的效果,就在今年过年的时候,努力突击了一把,H5,CSS,js,看了视频之后,才发现这几种语言只是前端的基础,一般实际应用都不基于原生js开发,当时一脸懵逼,学了这么久,尼玛,竟然不用直接上,还是有点不爽,本来打算直接上原生js,做做项目算是熟悉原生js,(这个之后会安排,因为之前一个劲看视频学语法,都没实操,可以安排安排)。然后又一次公司招来了一个H5工程师,好奇心之下,就去百度搜索了一下H5是做啥的,结果就把laya air引擎搜索出来了,从此再次踏上不归路。
之前还以为H5引擎只有laya,所以就可以看视频,先做个demo试试,看了差不多了,手贱,又搜索了一下,发现H5引擎这么多,还有一个叫“白鹭”的,看着感觉时间还有点久了,并且市场份额有点大,想想要不要去学这个,后来惊醒了一下,学这么多,那有那么多精力,反正都跟laya有缘了,就选择laya把,用laya来做第一个游戏,也希望laya引擎不要那么坑,做前端比较不在行,就是单纯的想玩玩。
一不小心说了这么多,主要说了一下跟laya认识的过程,不想看的,可以忽略。下面我们来正式进入主题:初识laya.
1.认识laya
每次写文章开头,都必须要吹水,这基本概念的东西我确实不太会说,就简单的描述描述。
laya是一个国内的开源引擎,好像说在3D小游戏上面性能比较好,不过我们初学,就做做2D,3D还是先放放,因为开源,所以我们都可以下载来使用,这里粘贴了laya的官网
界面比较简单,大家可以去看看,都有文档,API,视频等等,这些就不细说了。
1.1 安装步骤
其实的免安装版的,下载下来就可以直接用了,ok,这里也不说了,比较懒,哈哈。
1.2 新建项目
laya比较好的地方,是在新建项目中有一个实例项目:
就按者这个创建,就会有一个弹箱子的小游戏,可以试着玩玩,感觉还行。
但是对我来说,我发现一个问题,就是创建好了这个实例项目之后,不知道从来开始看起,所以比较懵逼。一些js文件在里面调用,看着都懵逼了,不过你们会不会有这种感觉。
1.3 简介laya(重要)
1.3.1 语言
之前本来想直接就创建一个新项目了,不过想想还是再添加一节,来做做过渡。这一节简单描述一下开发需要的知识。laya支持3种语言,as,js,ts,官方推荐使用TS,TS是JS的超集,语法都支持JS,但是是一个强类型语言,JS是一个弱类型语言,当变量一多,就会懵逼,不过我这里使用是JS,毕竟自学了这么久的JS,不使用一些,都不会甘心。
1.3.2 场景
当你自己新创建一个laya项目的时候,肯定懵逼,尼玛,这连界面都没有,太坑了,有木有。(我在这里也纠结了大半天,尼玛怎么搞)。
后来才发现,有一个叫场景的东西,可以理解为画布,我们可以在场景里面放图片,画画,所以我们对着Scenes右击,选择新建,就有场景:
可以起名气,设置宽度和高度,这里的宽度和高度是参考的长度,这又是一坑,(手动捂脸)。
创建后,就会有一个黑色的背景,可以在各种组件,各种ui,往里放,然后按F8编译,
画重点,
编译出来在谷歌浏览器中的像素总是感觉那种不对,就是比较小,这是因为这个像素是由另一个界面控制的,为什么这么设计,对我这种初学者来说,我也不知道,反正就记住就行。
那这么设置呢?我们按下F9
出现了一个项目设置,好家伙,这里还有一个宽度和高度,这是我改过之后的了,你们可以根据自己的情况修改,就这点,也坑了我好久,不过我后面知道了之后,想起视频上是有说的,怪自己不认真,不过说实话,一直看视频确实让我想睡觉。
编译运行之后,再在谷歌浏览器看看效果,是不是舒服多了,界面变大了。
1.3.3 组件
laya是基于组件编程的,支持好多组件
这里就截两个图说明说说,确实比较多,左边的comp就是组件,组件就是在右边的basics中添加了一些功能,比较添加了图片等,所以如果可以我们先选用左边的comp。等做demo的时候,就明白,现在可以拖拖这些组件玩玩,
1.4 文档
laya的文档其实是比较丰富的,现在先有一个认识,到时候,真正做项目的时候,就有的用了。
左边有搜索框,我们比较常用的就是image,一搜索就能看到,然后点击就可以看到里面的方法和属性,都是比较方便的。现在不知道怎么用,没关系,下节就知道怎么用了。
也都比较详细,都可以在上面查查。
1.5 最后
最后说说我为什么要写laya文章,现在都养成了一种总结的习惯,每次学习,或者遇到一个新的知识,都喜欢记录下来,供以后翻阅,虽然以后看的概率不大,不过学习过程能看到一些输出,也是值得高兴的。我是初学laya,说的不准确的地方,可以联系我。