Создание параллакса на фоне мозаики - PullRequest
0 голосов
/ 13 февраля 2010

Я использую технику блинтинга, которую Джефф из 8bitrocket.com использует для создания плиток. Я пытаюсь нарисовать 2 слоя bitmapdata на bitmap. Одним из первых слоев является фон (1 изображение). и второй слой - это плитки. В этом классе ниже. updateMap - это метод, который вызывается в цикле для перерисовки изображения.

package com.eapi 
{
    /**
     * ...
     * @author Anthony Gordon
     */
    import com.objects.XmlManager;
    import flash.display.MovieClip;
    import flash.display.Sprite;
    import flash.events.*;
    import flash.display.BitmapData;
    import flash.display.Bitmap
    import flash.geom.Rectangle;
    import flash.geom.Point;
    import flash.display.DisplayObject;

    public class EngineApi extends MovieClip
    {
        public var images:Array;
        public var world:Array;
        //w stands for world, how big it is in columns and rows
        private var wCols:Number = 50;
        private var wRows:Number = 16;

        public var wWidth:Number;
        public var wHeight:Number;
        //v stands for view, which means your field of view
        public var vRows:Number;
        public var vCols:Number;

        public var vWidth:Number = 540;
        public var vHeight:Number = 360;
        //how big your indivual tile is
        public var tileW:Number = 80;
        public var tileH:Number = 80;

        public var offsX:Number = 0;
        public var offsY:Number = 0;
        public var xEnd:Number = 0;
        public var yEnd:Number = 0;
        public var tilex:int;
        public var tiley:int;

        public var scrollx:Number = 0;
        public var scrolly:Number = 0;

        private var screen:Bitmap;
        private var canvas:BitmapData;
        private var buffer:BitmapData;
        public var mapHolder:Array;
        private var scrollLoop:Boolean;

        private var minLoop:Number;
        private var maxLoop:Number;

        public var currentMap:Number = 0;
        private var queue:Array;

        public var currentCol:Number = 0;
        public var currentRow:Number = 0;
        public var enviroment:Array;
        public var currentTileSheet:Number = 0;

        private var layer1:Sprite;
        private var layer2:Sprite;
        private var layer3:Sprite;
        private var layer4:Sprite;
        private var layer5:Sprite;

        public var background:BitmapData

        protected var stageObject:Array;
        protected var gameObjects:Array;

        public function EngineApi(w:Number = 540,h:Number = 360, tw:Number = 50, th:Number = 50) 
        {

            stageObject = new Array();
            gameObjects = new Array();

            //Add Layers
            layer1 = new Sprite();
            layer2 = new Sprite();
            layer3 = new Sprite();
            layer4 = new Sprite();
            layer5 = new Sprite();
            //end

            images = new Array();
            vWidth = w;
            vHeight = h;
            tileW = tw;
            tileH = th;
            queue = new Array();

            mapHolder = new Array();

            vCols = Math.floor(vWidth/tileW);
            vRows = Math.floor(vHeight/tileH);

            wWidth = wCols * tileW;
            wHeight = wRows * tileH;

            canvas = new BitmapData(vWidth,vHeight,true,0x000000);
            buffer = new BitmapData(vWidth + 2 * tileW, vHeight + 2 * tileH ,false,0x000000);           
            screen = new Bitmap(canvas);

            addChild(screen);

            addChild(layer1);
            addChild(layer2);
            addChild(layer3);
            addChild(layer4);
            addChild(layer5);
        }

        public function addGameChild(object:IGameObject, layer:Number):void
        {
            switch(layer)
            {
                case 1:
                    layer1.addChild(DisplayObject(object));
                break;
                case 2:
                    layer2.addChild(DisplayObject(object));
                break;
                case 3:
                    layer3.addChild(DisplayObject(object));
                break;
                case 4:
                    layer4.addChild(DisplayObject(object));
                break;
                case 5:
                    layer5.addChild(DisplayObject(object));
                break;
                default:
            }

            if (object.IsDisplay == true)
                gameObjects.push(object);

            stageObject.push(object);
        }

        public function UpDateMap():void
        {
            offsX += scrollx;
            offsY += scrolly;

            tilex = int(offsX/tileW);
            tiley = int(offsY/tileH);

            xEnd = tilex + vWidth;
            yEnd = tiley + vHeight;

            var tileNum:int;

            var tilePoint:Point = new Point(0,0);
            var tileRect:Rectangle = new Rectangle(0, 0, tileW, tileH);

            var rowCtr:int=0;
            var colCtr:int=0;

            for (rowCtr=0; rowCtr <= vRows; rowCtr++) {
                for (colCtr = 0; colCtr <= vCols; colCtr++) {

                    currentCol = colCtr+tilex;
                    currentRow = rowCtr+tiley;
                    tileNum = mapHolder[currentMap][rowCtr+tiley][colCtr+tilex];
                    tilePoint.x = colCtr * tileW;
                    tilePoint.y = rowCtr * tileH;
                    tileRect.x = int((tileNum % 100))* tileW;
                    tileRect.y = int((tileNum / 100))* tileH;
                    buffer.copyPixels(images[currentTileSheet],tileRect,tilePoint);
                }               
            }//End Loop
            var bgRect:Rectangle = new Rectangle(0, 0, 544, 510);
            var bgPoint:Point = new Point(0, 0);

            var bufferRect:Rectangle = new Rectangle(0,0,vWidth,vHeight);
            var bufferPoint:Point = new Point();            

            bufferRect.x = offsX % tileW;
            bufferRect.y = offsY % tileH;

            canvas.copyPixels(background,bgRect,bgPoint);
            canvas.copyPixels(buffer,bufferRect,bufferPoint);

        }//End UpdateMap

        public function StartRender():void
        {
            addEventListener(Event.ENTER_FRAME, loop);
        }

        protected function loop(e:Event):void
        {           
            UpDateMap();
            UpdateObjects();
        }

        protected function UpdateObjects():void
        {
            for (var i:Number = 0; i < stageObject.length; i++)
            {
                stageObject[i].UpdateObject();
            }

            for (var g:Number = 0; g < stageObject.length; g++)
            {
                if (stageObject[g].Garbage && stageObject[g].IsDisplay)
                {
                    removeChild(DisplayObject(stageObject[g]));
                    stageObject[g] = null;
                }
                else if (stageObject[g].Garbage == true && stageObject[g].IsDisplay == false)
                {
                    stageObject[g] = null;                  
                }
            }

        }

        public function StopRender():void
        {
            removeEventListener(Event.ENTER_FRAME, loop);
        }

    }

}

Это не полный код, но если я удаляю canvas.copyPixels(background,bgRect,bgPoint); или canvas.copyPixels(buffer,bufferRect,bufferPoint);, я вижу либо либо, либо. Если я нарисую их обоих, то смогу увидеть только тот, который нарисовал последним. Мое мозаичное изображение имеет размер 128 x 32. 0 - 3. массив 3 является прозрачным изображением. Я использовал это, надеясь, что смогу видеть сквозь изображение и видеть фон. Я был не прав.

Сначала это был полностью черный фон, но затем я изменил прозрачный конструктор на true для переменной буфера. Теперь он показывает белый фон (как сцена), но все еще не имеет фонового изображения.

Ответы [ 2 ]

0 голосов
/ 21 февраля 2010

Я взял отдельный видеоклип и использовал его в качестве параллакса за мигающими плитками.

0 голосов
/ 13 февраля 2010

Я не уверен, что полностью понимаю пример, но похоже, проблема в том, что вы используете copyPixels - это должно заменить старые пиксели в canvas bmp новыми значениями.

Попробуйте использовать draw вместо переднего плана:

canvas.copyPixels(background, bgRect, bgPoint);
canvas.draw(buffer, transform, null, null, clipRect);

Кроме того, я не уверен, почему вы рисуете фоновое изображение в другом прямоугольнике, чем на переднем плане? Там что-то может быть.

...