A Flash Developer Resource Site

Results 1 to 12 of 12

Thread: open and close how to?

  1. #1
    Junior Member
    Join Date
    Jun 2009
    Posts
    8

    open and close how to?

    Hi im new with actionscript an im stuck. And was wondering someone here could help me with this.

    Ive called some movieclips on stage with AS to a random position. If you click on the movieclip it goes to the center. And if you click the same clip when it is in the center it goes back to a random position

    But what i want is that if you click any of the buttons while there is a movieclip in the center. That the movieclip in the center goes back to a random position and the clicked one goes to the center.


    thanks in advance.

    my as :


    import fl.transitions.Tween;
    import fl.transitions.easing.*;
    var rArray:Array = new Array();
    var clip:MovieClip;

    function Main() {
    for (var i:int = 0; i < 6; i++) {
    var newCircle:BlueCircle = new BlueCircle();
    newCircle.x=50+Math.random()*1300;
    newCircle.y=285+Math.random()*200;
    newCircle.scaleX=newCircle.scaleY=1;
    newCircle.addEventListener(MouseEvent.ROLL_OVER, onBtn);
    newCircle.addEventListener(MouseEvent.CLICK, klik);
    this.addChild(newCircle);
    rArray.push(newCircle);
    }
    }
    Main();



    function onBtn(e:MouseEvent):void {
    clip=e.target as MovieClip;
    this.addChild(e.currentTarget as MovieClip);
    }



    function klik(e:MouseEvent):void {

    if (clip.x==stage.stageWidth/2) {
    var myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,50+Math.random( )*1300,1,true);
    var myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,100+Math.random ()*600,1,true);
    } else {
    var myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidt h/2,1,true);
    var myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeig ht/2,1,true);

    }
    }



    rArray[0].ldr.source="../images/image2.jpg";
    rArray[1].ldr.source="../images/image2.jpg";
    rArray[2].ldr.source="../images/image3.jpg";
    rArray[3].ldr.source="../images/image4.jpg";
    rArray[4].ldr.source="../images/image5.jpg";
    rArray[5].ldr.source="../images/image6.jpg";
    rArray[6].ldr.source="../images/image7.jpg";

  2. #2
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    I would suggest you create a variable that contains the name of whichever clip is in the middle, and update it anytime a movieclip is clicked.
    EDIT: Disregard this post.... move on to my next one.
    PHP Code:
    var clipAtCenter:MovieClip;

    function 
    klik(e:MouseEvent):void {
    if(
    clipAtCenter != null)
    {
         if (
    clip.x==stage.stageWidth/2) {
         var 
    myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,50+Math.random( )*1300,1,true);
         var 
    myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,100+Math.random ()*600,1,true);
         } else {
         var 
    myTween3:Tween=new Tween(clipAtCenter,"x",Back.easeOut,clip.x,50+Math.random( )*1300,1,true);
         var 
    myTween4:Tween=new Tween(clipAtCenter,"y",Back.easeOut,clip.y,100+Math.random ()*600,1,true);

         
    clipAtCenter clip;

         var 
    myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidt h/2,1,true);
         var 
    myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeig ht/2,1,true);
         }
    } else {

         
    clipAtCenter clip;

         var 
    myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidt h/2,1,true);
         var 
    myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeig ht/2,1,true);
         }

    Or something like that...
    Last edited by Taidaishar; 06-11-2009 at 03:39 PM.

  3. #3
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    Actually, I think I got it working pretty nicely. Try this:
    PHP Code:

    import fl
    .transitions.Tween;
    import fl.transitions.easing.*;
    var 
    rArray:Array = new Array();
    var 
    clip:MovieClip;
    var 
    clipAtCenter:MovieClip;  //added this

    function Main() {
        for (var 
    i:int 06i++) 
        {
            var 
    newCircle:BlueCircle = new BlueCircle();
            
    newCircle.x=50+Math.random()*1300;
            
    newCircle.y=285+Math.random()*200;
            
    newCircle.scaleX=newCircle.scaleY=1;
            
    newCircle.addEventListener(MouseEvent.ROLL_OVERonBtn);
            
    newCircle.addEventListener(MouseEvent.CLICKklik);
            
    this.addChild(newCircle);
            
    rArray.push(newCircle);
        }
    }

    Main();

    function 
    onBtn(e:MouseEvent):void 
    {
        
    clip=e.target as MovieClip;
        
    this.addChild(e.currentTarget as MovieClip);
    }

    //reworked this function

    function klik(e:MouseEvent):void 
    {
        if (
    clip == clipAtCenter
        {
            
    trace("1")
            var 
    myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,50+Math.random( )*1300,1,true);
            var 
    myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,100+Math.random ()*600,1,true);
            
    clipAtCenter null;
        } 
        else if(
    clipAtCenter == null)
        {
            
    trace("2")
            var 
    myTween5:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidth/2,1,true);
            var 
    myTween6:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeight/2,1,true);
            
    clipAtCenter clip;
        }
        else
        {
            
    trace("3")
            var 
    myTween7:Tween=new Tween(clipAtCenter,"x",Back.easeOut,clipAtCenter.x,50+Math.random( )*1300,1,true);
            var 
    myTween8:Tween=new Tween(clipAtCenter,"y",Back.easeOut,clipAtCenter.y,100+Math.random ()*600,1,true);
            
            var 
    myTween9:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidth/2,1,true);
            var 
    myTween10:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeight/2,1,true);
            
    clipAtCenter clip;
        }


  4. #4
    Junior Member
    Join Date
    Jun 2009
    Posts
    8
    Thank you very very much i would have never figured this out on my own. i was working with your first post and i didnt get it to work. i didnt expect to get any answers and you just fixed it for me!

    But what does the trace command do?

    THX AGAIN!

  5. #5
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    No problem. The trace commands just ouput something into the output window when you test the movie. They're mainly for debugging. I wanted to make sure that clicking on the circles was actually triggering the correct part of the IF statement. So, when I click on the very first circle (and nothing is in the middle yet) a "2" should output into the output window.

    Trace statements are not compiled with the code when you publish and are ignored except when using the Flash IDE.

  6. #6
    Junior Member
    Join Date
    Jun 2009
    Posts
    8
    i really apreciate this help. And that trace function is very handy and btw easy to use. but i have another question. I want to call 35 images to that stage, thats no problem. But i want to have them different random sizes to give them depth. The only problem with this is that the small images are in front of the big ones and and there depth is totaly random to...

    i understand how to call a clip to the front but i dont get how to say the first 5 arrays are size 0.5 and in the back. Array 5 to 10 is size 1 and in front of the first five arrays

    this is what i have

    newCircle.scaleX=newCircle.scaleY=0.3+Math.random( )*1;

  7. #7
    Junior Member
    Join Date
    Jun 2009
    Posts
    8
    i tried this by giving every single array a differnt vallue but then i have way to much code and its is still not working.

  8. #8
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    Actually, the way you're adding a new clip with this function:

    PHP Code:
    function onBtn(e:MouseEvent):void
    {
        
    clip=e.target as MovieClip;
        
    this.addChild(e.currentTarget as MovieClip);

    It's not going to work too well. It adds a new clip and the depth of that clip is going to be higher than anything else on the stage. So, whenever you roll over a clip, it's going to pull it to the front.

  9. #9
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    Unless that's what you're going for, try replacing that function with this:
    PHP Code:
    function onBtn(e:MouseEvent):void 
    {
        var 
    tempDepth:Number;
        
    clip=e.target as MovieClip;
        
    tempDepth getChildIndex(clip);
        
    trace(tempDepth)
        
    this.addChildAt(e.currentTarget as MovieCliptempDepth);

    That will keep the objects the same depth even after you roll over them.

    After you do that, try this updated bit of code in the first part and change it to fit your needs:

    PHP Code:

    for (var i:int 035i++) 
        {
            var 
    newCircle:BlueCircle = new BlueCircle();
            var 
    myNum:Number//added this
            
            
    newCircle.x=50+Math.random()*750;
            
    newCircle.y=285+Math.random()*200;
            
            if(
    i<10)
            {    
                
    myNum 1+Math.random( ); //added this
            
    }
            else if(
    >= 10 && 20)
            {
                
    myNum .75+Math.random( ); //added this
            
    }
            else if(
    >= 20 && 30)
            {
                
    myNum .5+Math.random( ); //added this
            
    }
            else
            {
                
    myNum .25+Math.random( ); //added this
            
    }
            
            
    newCircle.scaleX=newCircle.scaleY=myNum//modified
            
    newCircle.addEventListener(MouseEvent.ROLL_OVERonBtn);
            
    newCircle.addEventListener(MouseEvent.CLICKklik);
            
    this.addChild(newCircle);
            
    rArray.push(newCircle);
        } 

  10. #10
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    One more thing I'd suggest. Add this code:

    PHP Code:

    import fl
    .transitions.Tween;
    import fl.transitions.easing.*;
    var 
    rArray:Array = new Array();
    var 
    clip:MovieClip;
    var 
    clipAtCenter:MovieClip;
    var 
    lastDepth:Number//<----- add this 
    And this (marked with comments):
    PHP Code:

    function klik(e:MouseEvent):void 
    {
        if (
    clip == clipAtCenter
        {
            
    setChildIndex(cliplastDepth); //add
            
    trace("1")
            var 
    myTween3:Tween=new Tween(clip,"x",Back.easeOut,clip.x,50+Math.random()*750,1,true);
            var 
    myTween4:Tween=new Tween(clip,"y",Back.easeOut,clip.y,100+Math.random()*500,1,true);
            
    clipAtCenter null;
        } 
        else if(
    clipAtCenter == null)
        {
            
    lastDepth getChildIndex(clip//add
            
    trace("2")
            var 
    myTween5:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidth/2,1,true);
            var 
    myTween6:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeight/2,1,true);
            
    clipAtCenter clip;
            
    setChildIndex(clipAtCenter, (numChildren 1)); //add
        
    }
        else
        {
            
    trace("3")
            var 
    myTween7:Tween=new Tween(clipAtCenter,"x",Back.easeOut,clipAtCenter.x,50+Math.random()*750,1,true);
            var 
    myTween8:Tween=new Tween(clipAtCenter,"y",Back.easeOut,clipAtCenter.y,100+Math.random()*500,1,true);
            
    setChildIndex(clipAtCenterlastDepth//add
            
            
    var myTween9:Tween=new Tween(clip,"x",Back.easeOut,clip.x,stage.stageWidth/2,1,true);
            var 
    myTween10:Tween=new Tween(clip,"y",Back.easeOut,clip.y,stage.stageHeight/2,1,true);
            
    clipAtCenter clip;
            
    lastDepth getChildIndex(clip); //add
            
    setChildIndex(clipAtCenter, (numChildren 1)) //add
        
    }

    What this code does, is when you CLICK on something, it pulls it to the front, and when you click on something ELSE (or click it again) it sends it back to it's original depth.

    I'm out for the day. I hope that helps you out a lot. Cheers.

  11. #11
    Junior Member
    Join Date
    Jun 2009
    Posts
    8
    i modified it so when i click the MC it also grows. but the problem im having is that i cant let it go back to there original size with a tween because i have 4 different sizes of clips. so what i tried is to add an ENTER FRAME function on the part where the movieclip goes to a random position.



    addEventListener(Event.ENTER_FRAME, shrink);

    and the function is


    function shrink(e:Event):void
    {
    trace("srink")
    var i:int
    if(i<10)
    {
    trace("small")
    var myTween5:Tween=new Tween(clipAtCenter,"scaleX",Back.easeOut,clip.scal eX,0.35,1,true);
    var myTween6:Tween=new Tween(clipAtCenter,"scaleY",Back.easeOut,clip.scal eY,0.35,1,true);
    }
    else if(i >= 10 && i < 20)
    {
    trace("medium")
    var myTween5:Tween=new Tween(clipAtCenter,"scaleX",Back.easeOut,clip.scal eX,0.50,1,true);
    var myTween6:Tween=new Tween(clipAtCenter,"scaleY",Back.easeOut,clip.scal eY,0.50,1,true);
    }
    else if(i >= 20 && i < 30)
    {
    trace("large")
    var myTween5:Tween=new Tween(clipAtCenter,"scaleX",Back.easeOut,clip.scal eX,0.75,1,true);
    var myTween6:Tween=new Tween(clipAtCenter,"scaleY",Back.easeOut,clip.scal eY,0.75,1,true);
    }
    else
    {
    trace("XLXL")
    var myTween5:Tween=new Tween(clipAtCenter,"scaleX",Back.easeOut,clip.scal eX,0.75,1,true);
    var myTween6:Tween=new Tween(clipAtCenter,"scaleY",Back.easeOut,clip.scal eY,0.75,1,true);
    }
    }

    but what happens is that if i roll over any of the other mc's the middle one goes to the right size.

    thx in advance

  12. #12
    Senior Member
    Join Date
    Aug 2007
    Posts
    291
    I would put the code back the way it was, and then do the exact same thing that i did with the depth. When a movieclip gets clicked, store it's current size in a variable and THEN make it larger. Then, when it gets clicked again (or another one gets clicked) you can tween it's size back to what it was before.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center