美文网首页
egret基础:显示容器

egret基础:显示容器

作者: coffee1949 | 来源:发表于2019-07-07 18:54 被阅读0次

深度值

// 设置显示对象在显示容器中的深度值
显示容器.addChildAt(显示对象, 深度值)

// 交换2个显示对象的深度值
显示容器.swapChileren(显示对象, 显示对象)
显示容器.swapChildrenAt(深度值, 深度值)

// 改变显示对象的深度值
显示容器.setChildIndex(显示对象, 深度值)
class Main extends egret.DisplayObjectContainer{
    public constructor(){
        super()
        this.addEventListener(egret.Event.ADDED_TO_STAGE,this.init,this)
    }

    private init(event:egret.Event){
        // 创建一个容器
        let box:egret.Sprite = new egret.Sprite()
        // 添加到显示列表
        this.addChild(box)
        
        // 创建4个显示对象
        let rect:egret.Sprite
        for(let i:number = 0;i < 4;i++){
            rect = new egret.Sprite()
            rect.graphics.beginFill(0xffffff*Math.random())
            rect.graphics.drawRect(0,0,150,150)
            rect.graphics.endFill()
            rect.x = i*100
            // 添加到box显示容器中
            box.addChild(rect)

        }
        console.log(box.width)      // 250
        console.log(box.height)     // 100

        // 创建新的显示对象,并设置深度值
        let newRect:egret.Sprite = new egret.Sprite()
        newRect.graphics.beginFill(0xff0000)
        newRect.graphics.drawRect(0,0,500,500)
        newRect.graphics.endFill()
        newRect.y = 50
        box.addChildAt(newRect,2)       // newRect的深度值是2,相当于层级是2

        // 从新设置newRect深度值
        box.setChildIndex(newRect,1)    // newRect的深度值是1,相当于层级是1

        // 显示对象交换深度值,,,这里的rect相当于第4个显示对象,深度值是4,newRect是1,
        // 交换后newRect是4,最后的rect的深度值是1
        box.swapChildren(rect,newRect)

        // 交换深度值,
        box.swapChildrenAt(1,4)
    }

}

访问容器子对象

访问的是容器的子对象:是根据容器访问容器中的子对象

class Main extends egret.DisplayObjectContainer{
    public constructor (){
        super()
        this.addEventListener(egret.Event.ADDED_TO_STAGE,this.onAddToStage,this)
    }
    private onAddToStage(event:egret.Event){
        // 创建显示容器box并添加到显示列表
        let box:egret.Sprite = new egret.Sprite()
        this.addChild(box)

        // 创建显示对象shp
        let shp:egret.Sprite = new egret.Sprite()
        shp.graphics.beginFill(0x00ff00)
        shp.graphics.drawRect(0,0,200,200)
        shp.graphics.endFill()
        shp.name = 'hell'
        box.addChild(shp)

        // 如何获取显示对象呢,有2中方式
        // 通过显示对象的name值或深度值
        // let _shp:egret.DisplayObject = box.getChildAt(0)
        let _shp:egret.DisplayObject = box.getChildByName('hell')
        _shp.scaleX = 0.5

    }
}

相关文章

  • egret基础:显示容器

    深度值 访问容器子对象 访问的是容器的子对象:是根据容器访问容器中的子对象

  • Egret显示对象与显示容器

    显示对象 1. 基本概念 在Egret中,视觉图形都是由显示对象和显示对象容器组成的。 显示对象,是可以在舞台上显...

  • egret-显示对象和显示容器

    DisplayObject:显示对象基类,所有显示对象都继承此类 当前对象 addEventListener t...

  • egret 位图缓存

    egret文档里解释如下 通过缓存指定的显示对象来提高 Egret 的性能。让显示结果不常发生改变的显示对象变成一...

  • Egret显示深度

    处于同一显示容器的显示对象,是以类似列表的方式来管理的,每一个显示对象都有其索引,并且索引是从0开始的整数。显示列...

  • Egret基础

    命令行 egret common [-v] create create_app 从h5游戏生成app starts...

  • egret基础

    显示对象: 具体的显示出来的对象,就是我们在页面上看到的东西:比如: 显示对象公共属性 显示对象的父类 就是用来创...

  • learning egret

    learning egret Index 1.js如何调用ts?2.ts如何调用js?3.egret基础4.Q&A...

  • Flexbox [响应式设计笔记]

    使用Flexbox 基础 将布局容器的显示属性设为display : flex ; 排列方式 容器本身属性just...

  • egret+react框架搭建

    选用的游戏框架 egret为什么选egret?因为目前看来比较成熟,社区活跃度也有。 react 基础框架如何引入...

网友评论

      本文标题:egret基础:显示容器

      本文链接:https://www.haomeiwen.com/subject/osebhctx.html