码迷,mamicode.com
首页 > 其他好文 > 详细

Erget 显示对象

时间:2016-10-02 19:30:43      阅读:830      评论:0      收藏:0      [点我收藏+]

标签:

核心显示类:

描述
DisplayObject 显示对象基类,所有显示对象均继承自此类
Bitmap 位图,用来显示图片
Shape 用来显示矢量图,可以使用其中的方法绘制矢量图形
TextField 文本类
BitmapText 位图文本类
DisplayObjectContainer 显示对象容器接口,所有显示对象容器均实现此接口
Sprite:DisplayObjectContainer 带有矢量绘制功能的显示容器
Stage:DisplayObjectContainer 舞台类

根节点:  

  Egret 的教程说 “每个Egret应用有且只有一个stage对象”,直接看 Egret 的 Player 播放器代码:

            p.init = function (container, options) {
                var option = this.readOption(container, options);
                var stage = new egret.Stage();
                stage.$screen = this;
                stage.$scaleMode = option.scaleMode;
                stage.$orientation = option.orientation;
                stage.$maxTouches = option.maxTouches;
                stage.frameRate = option.frameRate;
                stage.textureScaleFactor = option.textureScaleFactor;
                var buffer = new egret.sys.RenderBuffer(undefined, undefined, true);
                var canvas = buffer.surface;
                this.attachCanvas(container, canvas);
                var webTouch = new web.WebTouchHandler(stage, canvas);
                var player = new egret.sys.Player(buffer, stage, option.entryClassName);
                var webHide = new egret.web.WebHideHandler(stage);
                var webInput = new web.HTMLInput();
                player.showPaintRect(option.showPaintRect);
                if (option.showFPS || option.showLog) {
                    player.displayFPS(option.showFPS, option.showLog, option.logFilter, option.fpsStyles);
                }
                this.playerOption = option;
                this.container = container;
                this.canvas = canvas;
                this.stage = stage;
                this.player = player;
                this.webTouchHandler = webTouch;
                this.webInput = webInput;
                this.webHide = webHide;
                egret.web.$cacheTextAdapter(webInput, stage, container, canvas);
                this.updateScreenSize();
                this.updateMaxTouches();
                player.start();
            p.initialize = function () {
                var rootClass;
                if (this.entryClassName) {
                    rootClass = egret.getDefinitionByName(this.entryClassName);
                }
                if (rootClass) {
                    var rootContainer = new rootClass();
                    this.root = rootContainer;
                    if (rootContainer instanceof egret.DisplayObject) {
                        this.stage.addChild(rootContainer);
                    }
                    else {
                        DEBUG && egret.$error(1002, this.entryClassName);
                    }
                }
                else {
                    DEBUG && egret.$error(1001, this.entryClassName);
                }

  可以清楚地看到,egret 将 Main 这个 DisplayObjectContainer 作为了播放器的 rootContainer,并在初始化时就为 Main.stage 创建了舞台对象。

 

显示对象的基本概念:

  • 坐标:x, y
  • 缩放比例:scaleX, scaleY
  • 透明通道:alpha
  • 旋转操作:rotation
  • 设置锚点:anchorOffsetX, anchorOffsetY
  • 斜切:skewX, skewY

显示容器:

  可以包含多个 DisplayObject。

    private createGameScene():void 
    {
        console.log(this.stage.stageWidth);
        console.log(this.stage.stageHeight);
        
        console.log("Runtime start.");
        
        var testCGrid = new MyGrid();
        testCGrid.drawGrid();
        this.addChild(testCGrid);
        
        var testContainer = new MyContainer();
        testContainer.drawGrid();
        this.addChild(testContainer);

        console.log("Runtime end.");
    }
}

class MyGrid extends egret.Shape
{
    public constructor()
    {
        super();
        this.drawGrid();
    }
    
    public drawGrid()
    {
        this.graphics.beginFill(0x0000ff);
        this.graphics.drawRect(0,0,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0x0000ff);
        this.graphics.drawRect(50,50,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0xff0000);
        this.graphics.drawRect(50,0,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0xff0000);
        this.graphics.drawRect(0,50,50,50);
        this.graphics.endFill();   
    }
}

class MyContainer extends egret.DisplayObjectContainer 
{
    public constructor() 
    {
        super();
        this.drawGrid();
    }

    public drawGrid() {
        var myGrid = new egret.Shape();
        myGrid.graphics.beginFill(0x00ff00);
        myGrid.graphics.drawRect(200,200,50,50);
        myGrid.graphics.endFill();
        myGrid.graphics.beginFill(0x00ff00);
        myGrid.graphics.drawRect(250,250,50,50);
        myGrid.graphics.endFill();
        myGrid.graphics.beginFill(0xff0000);
        myGrid.graphics.drawRect(250,200,50,50);
        myGrid.graphics.endFill();
        myGrid.graphics.beginFill(0xff0000);
        myGrid.graphics.drawRect(200,250,50,50);
        myGrid.graphics.endFill();  
        this.addChild(myGrid);
        
        var myRect = new egret.Shape();
        myRect.graphics.beginFill(0xc000c0);
        myRect.graphics.drawRect(200,0, 100, 50);
        myRect.graphics.endFill();
        this.addChild(myRect);
    }
class MySprite extends egret.Sprite {
    public constructor() {
        super();
        this.drawGrid();
    }

    private drawGrid() {
        this.graphics.beginFill(0x00ff00);
        this.graphics.drawRect(200,200,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0x00ff00);
        this.graphics.drawRect(250,250,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0xff0000);
        this.graphics.drawRect(250,200,50,50);
        this.graphics.endFill();
        this.graphics.beginFill(0xff0000);
        this.graphics.drawRect(200,250,50,50);
        this.graphics.endFill();

        var myRect = new egret.Shape();
        myRect.graphics.beginFill(0xc000c0);
        myRect.graphics.drawRect(200,0,100,50);
        myRect.graphics.endFill();
        this.addChild(myRect);
    }
}

 

  • 第一个是一个自定义对象类;
  • 第二个是一个自定义容器类,包含两个自定义对象类。
  • DisplayContainer 是 Sprite 的话,由于其实现了 graphics 也是可以直接被根容器添加并显示的,它的child也会被显示。

访问容器子对象与深度:

  • getChildByName()
  • getChildAt()

  按官方说法,推荐用显示层级来获取对象效率更高。

  值得注意的是,如果对象是一个容器,容器内又包含多个对象时的层次处理。

 

Erget 显示对象

标签:

原文地址:http://www.cnblogs.com/Daniel-Liang/p/5927618.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!