游戏开发者社区 - 腾讯游戏学堂

返回社区首页

LayaAir HTML5游戏引擎

累计获得6赞

创建动画模板(EffectAnimation) [AS3语言]

LayaAir HTML5游戏引擎
2017-04-12

1、什么是动画模板动画模板是基于时间轴的动画效果，通过预设动画效果，然后把效果附加给某个组件。使得组件无需编码，却轻松实现与编码相同的动画效果。动画模板不能独立显示，仅可作为动效模板让UI页面中的组件获得动画效果。2、在IDE中制作与使用动画模板2.1 创建EffectAnimation模板文件在项目管理器中，鼠标右键 —> 选择新建 —> 动画。在新建动画的面板中，动画类型选为EffectAnimation。由于我们要创建一个缩放效果的动画模板，动画名称我们命名为scale，如图1所示。（图1）点击确定

游戏开发、模板、游戏视觉、 List、场景

赞0 评论0 2k浏览
用LayaAirIDE创建动画模板(EffectAnimation)

LayaAir HTML5游戏引擎
2017-04-12

1、什么是动画模板动画模板是基于时间轴的动画效果，通过预设动画效果，然后把效果附加给某个组件。使得组件无需编码却能轻松实现与编码相同的动画效果。动画模板不能独立显示，仅可作为动效模板让UI页面中的组件获得动画效果。2、在IDE中制作与使用动画模板2.1创建EffectAnimation模板文件在项目管理器中，鼠标右键—>选择新建—>动画。在新建动画的面板中，动画类型选为EffectAnimation。由于我们要创建一个缩放效果的动画模板，动画名称我们命名为scale，如图1所示。(图1)点击确定后，会创建一

游戏开发、模板、游戏视觉、 JavaScript、 List、场景

赞0 评论0 5.5k浏览
HTML5：用LayaAir引擎设置遮罩效果（JS）

LayaAir HTML5游戏引擎
2017-04-01

LayaAir的遮罩，可以设置一个对象(支持位图和矢量图)，然后根据对象形状进行遮罩显示。一、遮罩API介绍　　遮罩属性位于laya.display.Sprite API内，该属性的说明如图1所示：（图1）二、简单的遮罩示例2.1 我们先用LayaAir引擎显示一张位图，代码如下：(function(){ var Sprite = Laya.Sprite; var Texture = Laya.Texture; var Handler = Laya.Handler; var Res; var img; (f

游戏开发、 HTML5、 List、 JavaScript、游戏视觉、场景

赞0 评论0 6.5k浏览
设置遮罩(AS3)

LayaAir HTML5游戏引擎
2017-04-01

LayaAir的遮罩，可以设置一个对象(支持位图和矢量图)，然后根据对象形状进行遮罩显示。一、遮罩API介绍　　遮罩属性位于laya.display.Sprite API内，该属性的说明如图1所示：（图1）二、简单的遮罩示例2.1 我们先用LayaAir引擎显示一张位图，代码如下：package{ import laya.display.Sprite; import laya.resource.Texture; import laya.utils.Handler; public class MaskDemo

游戏开发、 HTML5、 List、游戏视觉、场景、移动前端

赞0 评论0 2.3k浏览
List示例：显示、增加、删除

LayaAir HTML5游戏引擎
2017-03-16

List（列表）是比较常用的功能。本篇结合LayaAir引擎与IDE针对List显示、增加、删除等相关操作进行逐步讲解，供开发者学习引擎与IDE的实战参考。（创建项目等基础操作，请查看其它文档，本篇跳过）一、用LayaAirIDE制作UI 1.1 创建一个View类型的UI页面（图1）创建一个名为ListPage的View类型UI页面首先，我们在LayaAirIDE的项目管理器内，创建一个View类型的UI页面，宽高为640*1136。页面命名为ListPag

游戏开发、 HTML5、 List、游戏视觉、 TPS、渲染

赞1 评论1 4.9k浏览
LayaAirIDE的项目管理器介绍

LayaAir HTML5游戏引擎
2017-03-10

面板介绍项目管理器是我们用来访问和管理项目的工作区域。在我们使用过程中，项目管理器将项目文件夹“layapages”的目录以及工程页面以树状结构展示出来。如图1所示：（图1）树状页面列表：显示已创建或已导入的项目文件夹及页面。打开所在目录：打开选中的页面的所在目录。设置属性：在弹出的属性设置窗口中，您可以设置该页面的导出类型与默认属性，如默认大小，color等，该属性全局通用。

游戏开发、模板、游戏视觉、版本管理

赞0 评论0 2.2k浏览
间隔循环执行

LayaAir HTML5游戏引擎
2017-03-08

时钟管理类laya.utils.Timer中关于间隔循环执行有两种方法，分别为按时间循环执行loop()和按帧率循环执行frameLoop()。这两种方法理解起来比较简单，我们直接看下API参数说明，如下图所示：loop按时间循环执行示例代码：1234567891011121314151617181920212223242526272829303132package{ import laya.display.Sprite; import laya.display.

游戏开发、 WebGL、 TPS

赞0 评论0 3.1k浏览
LayaAir引擎计时器：延迟调用API（JS）

LayaAir HTML5游戏引擎
2017-03-08

延迟调用callLater()是时钟管理类laya.utils.Timer中的一个常用方法。callLater是在本帧渲染之前，延迟调用某个回调函数，同一个回调函数是排重的，只会被调用一次。在涉及重复调用某个函数，使用延迟调用方法可避免重复运算或重复渲染，从而达到性能优化的目的。我们先看下该方法的API参数说明，如下图所示：callLater示例代码：123456789101112131415161718192021222324252627282930313233343536(functio

游戏开发、渲染、 WebGL、性能优化

赞0 评论0 4.1k浏览
LayaAir引擎计时器：间隔循环执行API

LayaAir HTML5游戏引擎
2017-03-08

时钟管理类laya.utils.Timer中关于间隔循环执行有两种方法，分别为按时间循环执行loop()和按帧率循环执行frameLoop()。这两种方法理解起来比较简单，我们直接看下API参数说明，如下图所示：loop按时间循环执行示例代码：1234567891011121314151617181920212223242526(function(){ var Sprite = Laya.Sprite; var Text = Laya.Text; var WebGL

游戏开发、 WebGL、 TPS

赞0 评论0 6.8k浏览
LayaAir引擎屏幕适配的缩放模式详解(AS)

LayaAir HTML5游戏引擎
2017-03-02

缩放模式是屏幕适配的重点内容，本篇从基础概念到参数说明，并结合代码实例帮助大家理解LayaAir引擎的屏幕缩放模式。在 API文档中，我们搜索laya.display.Stage，可以看到关于缩放模式的方法scleMode共有七种参数，用于实现各种屏幕适配的缩放需求，参数说明如图1所示：（图1）LayaAir引擎关于缩放模式scaleMode的参数说明简单概览一下参数说明，我们先了解一些本篇涉及的基础概念： 1、设计宽高：在项目代码中项目代码中初始化舞台Lay

游戏开发、屏幕适配、游戏视觉、 HTML5、渲染

赞0 评论0 7.2k浏览
屏幕适配的缩放模式详解

LayaAir HTML5游戏引擎
2017-03-02

缩放模式是屏幕适配的重点内容，本篇从基础概念到参数说明，并结合代码实例帮助大家理解LayaAir引擎的屏幕缩放模式。在 API文档中，我们搜索laya.display.Stage，可以看到关于缩放模式的方法scleMode共有七种参数，用于实现各种屏幕适配的缩放需求，参数说明如图1所示：（图1）LayaAir引擎关于缩放模式scaleMode的参数说明简单概览一下参数说明，我们先了解一些本篇涉及的基础概念： 1、设计宽高：在项目代码中项目代码中初始化舞台Lay

游戏开发、屏幕适配、 HTML5、渲染

赞1 评论0 7k浏览
H5游戏屏幕适配的缩放模式之：拉伸填满屏幕（LayaAir引擎）

LayaAir HTML5游戏引擎
2017-02-27

缩放模式是屏幕适配的重点内容，需要开发者通过实例体验，去深入理解。laya.display.Stage API关于缩放模式的方法scleMode共有七种参数，本篇将介绍缩放模式的拉伸填充“exactfit”。 exactfit模式是一种不考虑内容的原始比例，直接将舞台尺寸暴力拉伸，填满整个浏览器屏幕的缩放模式，下面直接上代码。exactfit模式代码示例如下：123456789101112131415161718192021222324252627282930313233343

游戏开发、移动前端、屏幕适配

赞0 评论0 4.8k浏览
HTML5屏幕适配的缩放模式之：不缩放(LayaAir引擎)

LayaAir HTML5游戏引擎
2017-02-23

缩放模式是屏幕适配的重点内容，需要开发者通过实例体验，去深入理解。关于缩放模式的API方法scleMode共有七种参数，本篇将介绍不缩放模式的“noscale”与“full”，并说明两者的区别。为了大家能更好的理解缩放模式，我们以iPhone5的屏幕像素（1136, 640）制作一张游戏加载页背景图(loadingBg.jpg)，以Phone６的屏幕像素（1334, 750）为舞台大小，并为舞台设置背景色。结合不同的缩放模式，分别在iPhone4、iPhone5、iPhone

游戏开发、屏幕适配、 HTML5

赞0 评论0 4.7k浏览
Unity导出LayaAir光照贴图的流程与注意事项

LayaAir HTML5游戏引擎
2017-02-15

LightingMap技术可以使用最小的代价提升静态场景光照效果，LayaAir的默认材质支持lightingMap，而生成lightingMap的工具可使用3DMAX等建模软件，也可使用Unity3D引擎IDE,LayaAir的unity插件可以支持导出场景模型和光照贴图等，本文详细介绍Unity导出LayaAir光照贴图于的流程和注意事项。步骤一：Unity3D中烘培光照贴图需要标记Static属性，同样LayaAir也需要这个属性，具体如图所示。步骤二：烘培光照贴图需要模型自身具有Lig

游戏开发、光照、 Unity、场景、 PS、建模

赞1 评论1 7.3k浏览
Unity导出LayaAir光照贴图的流程与注意事项

LayaAir HTML5游戏引擎
2017-02-15

LightingMap技术可以使用最小的代价提升静态场景光照效果，LayaAir的默认材质支持lightingMap，而生成lightingMap的工具可使用3DMAX等建模软件，也可使用Unity3D引擎IDE,LayaAir的unity插件可以支持导出场景模型和光照贴图等，本文详细介绍Unity导出LayaAir光照贴图于的流程和注意事项。步骤一：Unity3D中烘培光照贴图需要标记Static属性，同样LayaAir也需要这个属性，具体如图所示。步骤二：烘培光照贴图需要模型自身具有Lig

游戏开发、光照、 Unity、场景、 PS、建模

赞0 评论0 2.6k浏览
对齐模式：水平对齐与垂直对齐(JS)

LayaAir HTML5游戏引擎
2017-02-15

关于对齐模式方面，主要是常规的水平对齐与垂直对齐。LayaAir引擎可以方便快捷的配置，下面我们先了解一下API的参数说明，再通过示例代码介绍是怎么实现水平对齐和垂直对齐的。参数说明如下图所示：我们用水平居中和垂直居中的Demo 进行演示：12345678910111213141516171819(function(){ var Stage = Laya.Stage; var WebGL = Laya.WebGL; (function() { //初始化舞

游戏开发、 WebGL

赞0 评论0 3.4k浏览
npm下通过layacmd 命令行编译和发布LayaAir项目（TS）

LayaAir HTML5游戏引擎
2017-02-15

安装 Installation1npm install layacmd -g命令行下的帮助说明：123456789101112131415161718layacmd -help Usage: 编译项目命令行输入 layacmd compile 项目路径; 发布项目命令行输入 layacmd publish 项目路径 mode (0代表不合并不压缩,1代表合并js代码不压缩，2代表合并并压缩); 编译项目命令行输入 layacmd compile 项目路径 -ui clear=true; 编译并

游戏开发、游戏视觉

赞0 评论1 4.5k浏览
对齐模式：水平对齐与垂直对齐

LayaAir HTML5游戏引擎
2017-02-14

关于对齐模式方面，主要是常规的水平对齐与垂直对齐。LayaAir引擎可以方便快捷的配置，下面我们先了解一下API的参数说明，再通过示例代码进行介绍。参数说明如下图所示：我们用水平居中和垂直居中的Demo 进行演示：12345678910111213141516171819(function(){ var Stage = Laya.Stage; var WebGL = Laya.WebGL; (function() { //初始化舞台，不支持WebGL时会自

游戏开发、 WebGL

赞0 评论0 1.7k浏览
HTML5移动端屏幕适配API概述

LayaAir HTML5游戏引擎
2017-02-14

随着移动端设备(手机、平板、电视)的增多，设备碎片化、屏幕碎片化的程度也在不断增加，而我们今天要探讨的，则是对游戏显示影响比较大的屏幕碎片化，要如何去做移动端屏幕适配才能吸引玩家。为了更深入的了解屏幕适配，我们先从Iphone屏幕分辨率发展说起：在早先的移动设备中，屏幕像素都比较低，如 Iphone3，它的分辨率为320*480，在Iphone3上，一个像素等于一个屏幕物理像素。后来随着设备屏幕像素密度越来越高，从iphone4开始，苹果推出了Retina屏，分辨率变成了640*960，提高一倍，但屏幕尺寸

游戏开发、屏幕适配、 HTML5

赞0 评论1 2.1k浏览
设置自动横屏（TS）

LayaAir HTML5游戏引擎
2017-02-13

在讲到引擎的自动横屏之前，先说一说有些人对横屏游戏的误区。直到如今有些人仍在说，如果做H5游戏一定要做竖屏游戏，其实要是深入了解一下，说这些话的，很大一部分是2015年或更早进入H5游戏行业中来的，还有一部分是受到那些早期做H5游戏影响的人。他们为什么会一直有这种误区呢？那到底是哪些原因是支持竖屏游戏论呢？在和大量持此观点的人交流后，总结下来，主要有三点。第一、横屏游戏对性能的消耗更大？针对这一观点，有存在这种可能，但这是完全可以避免的。因为导致性能问题，一是某些引擎在屏幕旋转处理上，可能没有处理好。二是项

游戏开发、移动前端、渲染、用户体验、屏幕适配、游戏公司

赞0 评论0 2.8k浏览

这个家伙已过上与世隔绝的生活~