Egret引擎开发指南之视觉编程_node.js

显示对象和显示列表

“显示对象”,准确的含义是可以在舞台上显示的对象。可以显示的对象,既包括可以直接看见的图形、文字、视频、图片等,也包括不能看见但真实存在的显示对象容器。

在Egret中,视觉图形都是由显示对象和显示对象容器组成的。

如果我们要表达上图中的场景,我们应该如何通过树的方式来描述呢?

显示对象等级结构

在Egret中,显示对象被分为两大类:一种是可以包括其他显示对象的显示对象容器,简称为“容器”。另外一种是单纯的显示对象,除自身以外不能包括其他显示对象,简称“非容器对象”。

在实际的操作中,我们可以把这样一种结构看成一个树状结构,容器可理解为树枝,非容器对象则可以理解为树叶。

在这个树状结构中,处于最上层的,就是“舞台”。对应到程序中,我们可以看到一个 stage 对象。舞台是Egret显示架构中最根本的显示容器。每个Egret应用有且只有一个stage对象。舞台是这个显示树结构的根节点。

在舞台中,我们还拥有一个主容器。这个容器就是文档类所创建的容器。每一个Egret都会拥有一个文档类,这个文档类必须是一个显示对象容器。

在这个场景中,我们包含了一个场景背景,而背景是由背景图和一颗大树组成的。另外两个元素是由人物和一个草地组成的。

显示列表

上面我们所看到的树状显示对象结构图实际上就是Egret的“显示列表”。

使用显示列表管理容器和非容器对象是非常方便的,当某一个显示对象处在在显示列表中,我们就可以在画面中看到该对象。当我们将显示对象从显示列表中移除后,该对象则从画面中消失。

在Egret内部维护着一个显示列表,开发者无需关心该列表是如何运行的,你只需要对自己的显示对象进行相应的操作即可。

显示对象种类

Egret在架构设计过程中围绕显示列表的概念,对所有对象进行了严格的封装。在Egret中,所有的显示对象均继承自 DisplayObject 这个类。DisplayObject 类也就是我们前面描述的“显示对象”。在Egret中,所有的“容器”均继承自 DisplayObjectContainer

为了统一管理显示列表,所有显示对象都统一于DisplayObject类。所有的显示对象都继承自DisplayObject,而DisplayObject则继承自EventDispatcher。也就是说所有的显示对象均可以发送事件。

DisplayObjectContainer显示对象容器的父类也是DisplayObject。

我们在实际操作中把概念再次简化,可以归纳为两条规则:

直接继承自DisplayObject的类都属于非容器。继承自DisplayObjectContainer的类都属于容器。

时间: 2024-08-22 05:46:39

Egret引擎开发指南之视觉编程_node.js的相关文章

Egret引擎开发指南之创建项目_node.js

Egret提供非常方便的创建工具,我们把创建后的文件总和称之为项目.在后面的操作中,我们对创建的项目进行操作,具体创建步骤如下: 需要注意的是Egret支持Windows和Mac OS X 两个平台.在不同平台中,我们使用的Egret命令是相同.对于不同的命令,大家可以参考文档中相关平台的操作介绍. Egret在创建的时候,需要指定创建项目所在目录.Egret会将所有创建后的项目文件全部存放到指定目录中. 1.Windows系统中进入项目目录 我们在Windows中的命令行工具中敲入命令如下图:

Egret引擎开发指南之发布项目_node.js

在Egret中,使用发布功能也非常的简单.你只需要使用如下命令即可: egret publish HelloWorld 此命令中egret publish为发布命令,HelloWorld是你当前项目的名称. 执行此命令后,egret会启动发布打包工作.此时的发布过程可能相对build功能耗时更长.因为Egret工具会对你的游戏代码做最终的发布工作,这个工作是非常严格的编译过程.其中的过程非常的复杂.我们只需要了解它的作用即可. 使用Egret的发布功能还需要安装Java7.你应该安装Java7或

Egret引擎开发指南之运行项目_node.js

这是一个令人兴奋的小结,因为在这个小结中你终于能够看到你的第一个Demo的运行效果. 1.使用Egret工具运行游戏 运行Egret项目,我们需要一个已运行的HTTP服务器.在前面安装Egret的教程中,我们已经为大家推荐了一款HTTP服务器.现在我们来看一下如何使用我们egret提供的最简单的HTTP服务器来运行我们的项目. 和前面的教程一样,我们首相在终端中定位我们的项目,使用cd命令. 然后我们执行一个简单的命令来启动Egret的HTTP服务器,命令如下: egret startserve

Egret引擎开发指南之编译项目_node.js

Egret的编译功能依赖于TypeScript的编译功能.实际上TypeScript的编译过程并非传统的将程序源代码翻译为机器可执行的二级制文件过程.由于浏览器能够识别执行的脚本只有JavaScript,所以TypeScript的编译仅仅是把TypeScript翻译为对应的JavaScript脚本. 我们无需理解里面复杂的过程,我们仅仅可以把编译过程理解为将TypeScript翻译成能够被浏览器执行的JavaScript代码即可. 这个"翻译"的过程也非常简单.我们仅仅需要执行一个简单

Mac OS X 系统下安装和部署Egret引擎开发环境_node.js

 概述 Egret基于TypeScript开发的,而TypeScript编译工具tsc是基于Node.js开发的.所以在安装过程中,我们先需要对于基础支持工具进行安装.需要安装的软件如下: Node.jsTypeScript代码编辑器HTTP服务器(可选)Chrome(可选)EgretJava 这篇文档中,我们主要介绍在Mac环境中安装Egret.其安装步骤如下. 1.安装Node.js 1.1下载Node.js Node.js的安装方法非常简单,我们可以访问Node.js官网,然后进点击页面中

nodejs开发环境配置与使用_node.js

先说下nodejs这个哦,有人以为它是一种语言,其实不是,它是一个平台,一个建立在google的V8引擎上的js运行平台,就是解析js,并提供自己 的一些API给用户调用.从目前的情况来看,这个发展情况还算好,明天都有好多的前端后台工程师在加入,连一些大神也在关注甚至写博客,昨晚我还看见一篇 文章写道一个外国的网站写了将近90搞nodejs的web插件,这个真牛啊!那学习中国东东对于我们来说最直接的能带来什么利益呢:前端人员由于熟悉 js那么可以基本简单学习下linux就可以上手了,那后台工程师

浅谈node.js中async异步编程_node.js

1.什么是异步编程? 异步编程是指由于异步I/O等因素,无法同步获得执行结果时, 在回调函数中进行下一步操作的代码编写风格,常见的如setTimeout函数.ajax请求等等. 示例: for (var i = 1; i <= 3; i++) { setTimeout(function(){ console.log(i); }, 0); }; 这里大部分人会认为输出123,或者333.其实它会输出 444 这里就是我们要说的异步编程了. 高级函数的定义 这里为什么会说到高级函数,因为高级函数是异

详谈nodejs异步编程_node.js

目前需求中涉及到大量的异步操作,实际的页面越来越倾向于单页面应用.以后可以会使用backbone.angular.knockout等框架,但是关于异步编程的问题是首先需要面对的问题.随着node的兴起,异步编程成为一个非常热的话题.经过一段时间的学习和实践,对异步编程的一些细节进行总结. 1.异步编程的分类      解决异步问题方法大致包括:直接回调.pub/sub模式(事件模式).异步库控制库(例如async.when).promise.Generator等. 1.1 回调函数      

Node.js的Web模板引擎ejs的入门使用教程_node.js

Node 开源模板的选择很多,但推荐像我这样的老人去用 EJS,有 Classic ASP/PHP/JSP 的经验用起 EJS 来的确可以很自然,也就是说,你能够在 <%...%> 块中安排 JavaScript 代码,利用最传统的方式 <%=输出变量%>(另外 <%-输出变量是不会对 & 等符号进行转义的).安装 EJS 命令如下: npm install ejs JS 调用JS 调用的方法主要有两个: ejs.compile(str, options); // =