flashactionscript-3viewportdisplayobjectscrollrect

Multiple viewports of the same DisplayObject


Is it possible to have multiple view of the same display object? (e.g. same-computer multi-player game using split screen)

The sample code that failed to work follows:

    var content: Sprite = new Sprite();
    var v1: Sprite = new Sprite();
    var v2: Sprite = new Sprite();

    with(content.graphics) {
        lineStyle(2, 0xff0000);
        drawCircle(100, 100, 80);

        lineStyle(5, 0x009999);
        drawRect(50, 80, 200, 30);
    }

    v1.addChild(content);
    v1.x = 0;
    v1.y = 0;
    v1.scrollRect = new Rectangle(0, 0, 100, 100);
    addChild(v1);

    v2.addChild(content);
    v2.x = 100;
    v2.y = 0;
    v2.scrollRect = new Rectangle(0, 0, 100, 100);
    addChild(v2);

I thought this would make two viewports (v1 and v2) of the same object (content). But when I checked the docs, DisplayObjectContaner/addChild method, it says,

"If you add a child object that already has a different display object container as a parent, the object is removed from the child list of the other display object container."

Is there a solution for this?


Obtained result

Obtained result

Expected result (simulated)

Expected result (simulated) http://img337.imageshack.us/img337/7914/222mq4.png


Rendering to a bitmap as suggested by Antti is a great idea, but the rendered sprites will not be able to catch mouse events. Is there a way to redirect the mouse clicks on the bitmap to trigger clicks on the original sprites?


Solution

  • The easiest way to do this is to have a bitmap that's updated with the original display object's contents, something like:

    var bitmap:Bitmap = new Bitmap(new BitmapData(1,1));
    addChild(bitmap);
    
    addEventListener(Event.ENTER_FRAME,enterFrameHandler);
    
    function enterFrameHandler(event:Event):void {
        bitmap.bitmapData.dispose();
        bitmap.bitmapData = new BitmapData(displayObject.width, displayObject.height, true, 0x00000000);
        bitmap.bitmapData.draw(displayObject);
    }