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


Posted in Javascript onSeptember 03, 2014

显示对象和显示列表

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

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

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

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

显示对象等级结构

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

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

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

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

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

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

显示列表

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

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

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

显示对象种类

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

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

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

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

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

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

Javascript 相关文章推荐
javascript 进度条 实现代码
Jul 30 Javascript
javascript数字数组去重复项的实现代码
Dec 30 Javascript
HTML DOM的nodeType值介绍
Mar 31 Javascript
jQuery(非HTML5)可编辑表格实现代码
Dec 11 Javascript
setTimeout内不支持jquery的选择器的解决方案
Apr 28 Javascript
浅谈document.write()输出样式
May 07 Javascript
js实现网页收藏功能
Dec 17 Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 Javascript
javascript实现table单元格点击展开隐藏效果(实例代码)
Apr 10 Javascript
解决VUEX兼容IE上的报错问题
Mar 01 Javascript
JS实现水平遍历和嵌套递归操作示例
Aug 15 Javascript
小程序双头slider选择器的实现示例
Mar 31 Javascript
Egret引擎开发指南之发布项目
Sep 03 #Javascript
Egret引擎开发指南之运行项目
Sep 03 #Javascript
JavaScript实现找出字符串中第一个不重复的字符
Sep 03 #Javascript
Egret引擎开发指南之编译项目
Sep 03 #Javascript
js和jquery中循环的退出和继续下一个循环
Sep 03 #Javascript
Egret引擎开发指南之创建项目
Sep 03 #Javascript
Mac OS X 系统下安装和部署Egret引擎开发环境
Sep 03 #Javascript
You might like
PHP 读取和修改大文件的某行内容的代码
2009/10/30 PHP
PHP中文分词的简单实现代码分享
2011/07/17 PHP
使用PHP生成二维码的方法汇总
2015/07/22 PHP
php gd等比例缩放压缩图片函数
2016/06/12 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
JQuery自定义事件的应用 JQuery最佳实践
2010/08/01 Javascript
js播放wav文件(源码)
2013/04/22 Javascript
js简易namespace管理器 实例代码
2013/06/21 Javascript
javascript:window.open弹出窗口的位置问题
2014/03/18 Javascript
node.js Web应用框架Express入门指南
2014/05/28 Javascript
Nodejs+express+html5 实现拖拽上传
2014/08/08 NodeJs
javascript 应用小技巧方法汇总
2015/07/05 Javascript
使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效
2015/09/24 Javascript
基于jQuery仿淘宝产品图片放大镜代码分享
2020/06/23 Javascript
nodejs搭建本地服务器并访问文件的方法
2017/03/03 NodeJs
vue-router 权限控制的示例代码
2017/09/21 Javascript
基于input动态模糊查询的实现方法
2017/12/12 Javascript
jQuery超简单遮罩层实现方法示例
2018/09/06 jQuery
Vue父子传递实例讲解
2020/02/14 Javascript
element中el-container容器与div布局区分详解
2020/05/13 Javascript
vue动态设置路由权限的主要思路
2021/01/13 Vue.js
Django后端接收嵌套Json数据及解析详解
2019/07/17 Python
django 基于中间件实现限制ip频繁访问过程详解
2019/07/30 Python
浅谈Pytorch中的torch.gather函数的含义
2019/08/18 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
python+opencv实现车牌定位功能(实例代码)
2019/12/24 Python
Django框架配置mysql数据库实现过程
2020/04/22 Python
网站性能延迟加载图像的五种技巧(小结)
2020/08/13 HTML / CSS
印度在线内衣和时尚目的地:Zivame
2017/09/28 全球购物
在加拿大在线租赁和购买电子游戏:Game Access
2019/09/02 全球购物
竟聘演讲稿范文
2013/12/31 职场文书
婚前财产公证书
2014/04/10 职场文书
优秀应届生求职信
2014/06/16 职场文书
基于nginx实现上游服务器动态自动上下线无需reload的实现方法
2021/03/31 Servers
查看nginx配置文件路径和资源文件路径的方法
2021/03/31 Servers
javascript中Set、Map、WeakSet、WeakMap区别
2022/12/24 Javascript