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创建一个选择文件的对话框代码
Jun 16 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
Dec 25 Javascript
js不能跳转到上一页面的问题解决方法
Mar 01 Javascript
快速解决jQuery与其他库冲突的方法介绍
Jan 02 Javascript
两种不同的方法实现js对checkbox进行全选和反选
May 13 Javascript
JavaScript实现鼠标滑过处生成气泡的方法
May 16 Javascript
js变形金刚文字特效代码分享
Aug 20 Javascript
用v-html解决Vue.js渲染中html标签不被解析的问题
Dec 14 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
Sep 18 Javascript
3种vue路由传参的基本模式
Feb 22 Javascript
react实现点击选中的li高亮的示例代码
May 24 Javascript
Weex开发之地图篇的具体使用
Oct 16 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
对squid中refresh_pattern的一些理解和建议
2009/04/17 PHP
php实现文件下载(支持中文文名)
2013/12/04 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
PHP使用正则表达式获取微博中的话题和对象名
2015/07/18 PHP
[原创]保存的js无法执行的解决办法
2007/02/25 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
2010/10/22 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
JS中eval函数的使用示例
2013/07/21 Javascript
基于Jquery代码实现支持PC端手机端幻灯片代码
2015/11/17 Javascript
快速使用Bootstrap搭建传送带
2016/05/06 Javascript
jQuery实现拖动效果的实例代码
2017/06/25 jQuery
纯JS实现简单的日历
2017/06/26 Javascript
js封装成插件的步骤方法
2017/09/11 Javascript
解决layer 动态加载select 失效的问题
2019/09/18 Javascript
ES6学习笔记之let与const用法实例分析
2020/01/22 Javascript
封装 axios+promise通用请求函数操作
2020/08/11 Javascript
浅谈Python数据类型判断及列表脚本操作
2016/11/04 Python
Python打印输出数组中全部元素
2018/03/13 Python
mac PyCharm添加Python解释器及添加package路径的方法
2018/10/29 Python
python使用mitmproxy抓取浏览器请求的方法
2019/07/02 Python
详解Python修复遥感影像条带的两种方式
2020/02/23 Python
python实现字符串和数字拼接
2020/03/02 Python
Pytorch mask-rcnn 实现细节分享
2020/06/24 Python
使用Python中tkinter库简单gui界面制作及打包成exe的操作方法(二)
2020/10/12 Python
Python虚拟环境virtualenv创建及使用过程图解
2020/12/08 Python
利用python为PostgreSQL的表自动添加分区
2021/01/18 Python
python 30行代码实现蚂蚁森林自动偷能量
2021/02/08 Python
css3一款3D字体带阴影效果的实现步骤
2013/03/20 HTML / CSS
波兰汽车配件网上商店:iParts.pl
2020/09/08 全球购物
小学师德标兵先进事迹材料
2014/05/25 职场文书
劳动争议仲裁代理词
2015/05/25 职场文书
该怎么书写道歉信?
2019/07/03 职场文书
共青团优秀团员申请书(范文)
2019/08/15 职场文书
导游词之蓬莱长岛
2019/12/17 职场文书
MySQL选择合适的备份策略和备份工具
2022/06/01 MySQL
小程序实现侧滑删除功能
2022/06/25 Javascript