actionscript-3flashflashdevelopanimate-cc

How to add Movie Clips of different sizes next to each other? AS3


Hello everyone so I am having some trouble with this I have Platforms that I add to the stage which are different sizes in Width. What I am trying to do in my for Loop is add more platforms on the right side of the current platforms x position on stage. I am having trouble because they are different sizes so they end up over lapping each other on this side-scroller game. I align the Platform MC's to the right of the registration like so:

enter image description here

here is the smaller size Movie clip:

enter image description here

I am doing this because I want to add different obstacles to each frame inside the Platform Movie Clip.

add Initial platform:

private function addInitPlatform():void 
    {
        platforms = new mcPlatforms();
        platforms.x = (stage.stageWidth / 2) - 380;
        platforms.y = (stage.stageHeight / 2) + 175;
        addChildAt(platforms, 1);
        aPlatformArray.push(platforms);
    }

Then add new platforms:

private function addPlatForms():void
    {
        //Loop trhough Platform Array
        for (var i:int = 0; i < aPlatformArray.length; i++) 
        {
            var currentPlat:mcPlatforms = aPlatformArray[i];

            nOffSetX += currentPlat.width + 50;

            //Add platforms
            platforms = new mcPlatforms();
            platforms.x = nOffSetX;
            platforms.y = (stage.stageHeight / 2) + 175;
            addChildAt(platforms, 1);
            aPlatformArray.push(platforms);
            break;
        }
        trace(aPlatformArray.length + " NPLATFORMS");
    }

I am trying to get the current platform which is the last platform I added to the stage and get its width so i can add it at the end but it still is doing something weird and overlapping over time,

So I was wondering if anyone knows how I should go about solving this so whenever I add on a new platform Movie Clip to the stage it aligns on the right side of the last platform Movie clip added to the stage with some space in between like so:

enter image description here

Thank you in advance!


Solution

  • I'm guessing that you have bunch of different platforms in your library with Linkage names set. Not sure if you want them to be in random order or not, but anyways you probably want to pick them up from an array, so:

    var aPlatformsArray:Array = [p1,p2,p3]; //Platform Mc's from library
    var addedPlatforms:Array = new Array(); //Array where we store added platforms
    

    The first method was to simply raise offset after adding each platform:

    var offsetX:Number = 0; //Starting x for the first platform
    
    for(var i:int=0; i<10; i++){
        //Just picking random ones from the Linkage array:
        var platform:MovieClip = new aPlatformsArray[Math.floor(Math.random() * aPlatformsArray.length)]();
        platform.y = 200;
        platform.x = offsetX;
        offsetX = platform.x + platform.width + 50;
        addChild(platform);
        addedPlatforms.push(platform);
    }
    

    And actually you don't need to worry about the second method as it's technically slower.

    But the main difference is that now we have an array where we pick platforms to the stage, and another array where we push added platforms. The second array is not needed at this point, but you'll probably need it later.

    And for offset calculations we use x and width of the "previous" element +fixed gap.

    And if you just needed fixed order for the platforms, you'd use similar condition for the loop as you already did, and pick platforms in correct order:

    for(var i:int=0; i<aPlatformsArray.length; i++){
        var platform:MovieClip = aPlatformsArray[i];
    

    Let me know if this does the job or if I got something wrong.