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

 更新时间:2014年09月03日 09:51:21   投稿:hebedich  
本部分内容详细介绍了Egret中关于视觉编程显示对象的架构设计以及一些概念,希望对大家能有所帮助

显示对象和显示列表

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

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

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

显示对象等级结构

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

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

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

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

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

显示列表

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

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

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

显示对象种类

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

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

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

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

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

相关文章

  • Node.js使用Sharp.js进行图像处理的实践与技巧

    Node.js使用Sharp.js进行图像处理的实践与技巧

    Sharp.js 是一个高性能的 Node.js 图像处理库,基于 C 语言编写的 libvips 库封装而来,提供了便捷、高效的图片编辑与转换功能,以下是对 Sharp.js 的深入解析,包括全方位实践与技巧,需要的朋友可以参考下
    2024-08-08
  • win10环境使用nvm安装多版本nodejs并配置环境变量的完整步骤

    win10环境使用nvm安装多版本nodejs并配置环境变量的完整步骤

    这篇文章主要给大家介绍了关于win10环境使用nvm安装多版本nodejs并配置环境变量的相关资料,需要的朋友可以参考下
    2024-01-01
  • CentOS7中源码编译安装NodeJS的完整步骤

    CentOS7中源码编译安装NodeJS的完整步骤

    这篇文章主要给大家介绍了关于CentOS7中源码编译安装NodeJS的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用nodejs具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-10-10
  • Node.js实现解析post请求的方法详解

    Node.js实现解析post请求的方法详解

    这篇文章主要为大家详细介绍了Node.js实现解析post请求方法的相关知识,文中的示例代码讲解详细,具有一定的学习价值,有需要的小伙伴可以了解下
    2024-04-04
  • Nodejs实现获取实时数据的三种主流方式详解

    Nodejs实现获取实时数据的三种主流方式详解

    这篇文章主要为大家详细介绍了Nodejs前端获取实时数据的三种主流方式,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-02-02
  • Bun入门学习教程吊打Node或Deno的现代JS运行时

    Bun入门学习教程吊打Node或Deno的现代JS运行时

    这篇文章主要为大家介绍了一款吊打Node或Deno的现代JS运行时,Bun入门学习教程,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • Node.js学习之地址解析模块URL的使用详解

    Node.js学习之地址解析模块URL的使用详解

    url模块是nodejs里面的一个简单的模块,下面这篇文章主要给大家介绍了关于Node.js学习之地址解析模块URL使用的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-09-09
  • Node.js包管理工具(npm、yarn、cnpm)

    Node.js包管理工具(npm、yarn、cnpm)

    本文主要介绍了Node.js包管理工具,包含npm、yarn、cnpm者三种,借助包管理工具,可以快速开发项目,提升开发效率,下面就来具体介绍一下如何使用,感兴趣的可以了解一下
    2024-08-08
  • 使用pify实现Node.js回调函数的Promise化

    使用pify实现Node.js回调函数的Promise化

    使用pify库,你可以非常便利地将任何遵循Node.js回调风格的函数转换为返回Promise对象的函数,从而使得你的异步代码更加清晰和易于维护,本文通过丰富的代码示例引导你如何有效地利用pify,需要的朋友可以参考下
    2024-06-06
  • nodejs脚本中如何执行shell命令

    nodejs脚本中如何执行shell命令

    Node.js中使用child_process模块的exec和spawn方法来执行shell命令,exec适合执行小命令,返回输出;spawn适合大命令或长时间运行的命令,实时输出
    2025-02-02

最新评论