• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Load a draggable MovieClip from an DropDown menu

Explorer ,
May 04, 2012 May 04, 2012

Copy link to clipboard

Copied

hi all!

I got stuck on this little interface I'm doing. It's the first time I seriously code in as3 and I guess this is over my possibility at the moment!

What I'm trying to do is:

1) a dropDown menu that loads an HTML file when clicked and also a movie clip onto the stage (this part works ok)

2)the movieClip I loaded is draggable.... and here I rest my case!

I'm thinking that the key to make it work is to embed the code that makes it draggable inside the movie clip itself; this way when I load the MC it comes already draggable... is that correct?

The main code is this;

import flash.net.URLRequest;

import flash.events.Event;

import flash.display.MovieClip;

import flash.sampler.NewObjectSample;

//define texts for the HEADING and for the PANEL's children (b1,2,3,4)

menu_event.heading.myText.text = "EVENT";

menu_event.panel.b1.myText.text = "press";

menu_event.panel.b2.myText.text = "pressNeighbour";

menu_event.panel.b3.myText.text = "bla";

menu_event.panel.b4.myText.text = "blabla";

menu_actions.heading.myText.text = "ACTIONS";

menu_actions.panel.b1.myText.text = "ledOn";

menu_actions.panel.b2.myText.text = "ledOff";

menu_actions.panel.b3.myText.text = "ledFlash";

menu_actions.panel.b4.myText.text = "ledDim";

menu_blocks.heading.myText.text = "BLOCKS";

menu_blocks.panel.b1.myText.text = "state";

menu_blocks.panel.b2.myText.text = "broadcast";

menu_blocks.panel.b3.myText.text = "onEntry";

menu_blocks.panel.b4.myText.text = "onExit";

//tell the MENU to do something depending on which target is clicked

menu_event.addEventListener(MouseEvent.CLICK, clickHandler);

menu_actions.addEventListener(MouseEvent.CLICK, clickHandler);

menu_blocks.addEventListener(MouseEvent.CLICK, clickHandler);

function clickHandler(event:MouseEvent):void

{

          if (event.target == menu_event.panel.b1)

          {

                    navigateToURL(new URLRequest("event_1.html"));

                    // Create a new MovieClip

                    var myMovieClip:MovieClip = new event_obj();

                    // Add the new MovieClip to the MainTimeline

                    // so that we can see it.

                    addChild(myMovieClip);

                    // Set the location of the new MovieClip

                    myMovieClip.x = 150;

                    myMovieClip.y = 210;

          }

          if (event.target == menu_event.panel.b2)

          {

                    navigateToURL(new URLRequest("event_1.html"));

          }

          if (event.target == menu_event.panel.b3)

          {

                    navigateToURL(new URLRequest("event_2.html"));

          }

          if (event.target == menu_event.panel.b4)

          {

                    navigateToURL(new URLRequest("event_3.html"));

          }

          ////////////////////////////////////////////////////////////////////

          if (event.target == menu_actions.panel.b1)

          {

                    navigateToURL(new URLRequest("actions_1.html"));

          }

          if (event.target == menu_actions.panel.b2)

          {

                    navigateToURL(new URLRequest("actions_2.html"));

          }

          if (event.target == menu_actions.panel.b3)

          {

                    navigateToURL(new URLRequest("actions_3.html"));

          }

          if (event.target == menu_actions.panel.b4)

          {

                    navigateToURL(new URLRequest("actions_4.html"));

          }

          ////////////////////////////////////////////////////////////////////

          if (event.target == menu_blocks.panel.b1)

          {

                    navigateToURL(new URLRequest("blocks_1.html"));

          }

          if (event.target == menu_blocks.panel.b2)

          {

                    navigateToURL(new URLRequest("blocks_2.html"));

          }

          if (event.target == menu_blocks.panel.b3)

          {

                    navigateToURL(new URLRequest("blocks_3.html"));

          }

          if (event.target == menu_blocks.panel.b4)

          {

                    navigateToURL(new URLRequest("blocks_4.html"));

          }

}

kudos for the help

TOPICS
ActionScript

Views

1.3K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

LEGEND , May 05, 2012 May 05, 2012

If you have that code inside the object, then you are not really dragging the object, you are dragging something inside it that has the instance name mc_test, and even then you might not be actually moving mc_test, but whatever graphic/object is inside of it..

If you monitor the x and y properties of myMovieClip as you drag they probably don't change.  Put this listener at the end of the clickHandler functionto check that...

     myMovieClip.addEventListener(MouseEvent.MOUSE_MOVE, checkXY);

and a

...

Votes

Translate

Translate
LEGEND ,
May 04, 2012 May 04, 2012

Copy link to clipboard

Copied

You could place the code inside the loaded movieclip or you could assign the code in the same section where you load it.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

Hi Ned,

Thanks for the suggestion... I fooled around a bit yesterday and I managed to something... It's a bit buggy but it's a first step... In the bit where I actually load the movieClip as an OBJ, I create a variable and that will initiate a new event_obj, and give it a position on screen...

function clickHandler(event:MouseEvent):void

{

          if (event.target == menu_event.panel.b1)

          {

                    navigateToURL(new URLRequest("event_1.html"));

                    // Create a new MovieClip

                    var myMovieClip:MovieClip = new event_obj();

                    // Add the new MovieClip to the MainTimeline

                    // so that we can see it.

                    addChild(myMovieClip);

                    // Set the location of the new MovieClip

                    myMovieClip.x = 150;

                    myMovieClip.y = 210;

          }

the event_obj is a movie clip that holds in this code:

stop();

buttonMode = true;

// Register mouse event functions

mc_test.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);

mc_test.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);

// Define a mouse down handler (user is dragging)

function mouseDownHandler(evt:MouseEvent):void {

          var object = evt.target;

          object.startDrag();

}

function mouseUpHandler(evt:MouseEvent):void {

          var obj = evt.target;

                    obj.stopDrag();

}

it's basically a chunk of code that turns on button mode (hand cursor) and makes the MC listen to mouse event; if there is a mouse down you drag ortherwise not...Simple as that!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

If you have that code inside the object, then you are not really dragging the object, you are dragging something inside it that has the instance name mc_test, and even then you might not be actually moving mc_test, but whatever graphic/object is inside of it..

If you monitor the x and y properties of myMovieClip as you drag they probably don't change.  Put this listener at the end of the clickHandler functionto check that...

     myMovieClip.addEventListener(MouseEvent.MOUSE_MOVE, checkXY);

and add this function to process it... outside the function

    function checkX(evt:MouseEvent):void {
           trace(evt.currentTarget.x, evt.currentTarget.y)
    }

If your intention is to move the myMovieClip object, then you want to change that code inside the object to...

     stop();

     buttonMode = true;

     // Register mouse event functions

     addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);

     addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);

    

     // Define a mouse down handler (user is dragging)

     function mouseDownHandler(evt:MouseEvent):void {

          this.startDrag();

     }

     function mouseUpHandler(evt:MouseEvent):void {

          this.stopDrag();

     }

 

Just in case, assigning buttonMode is not necessary unless you wish to have the cursor change to a hand when moving over the object.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

The thing is that both ways work fine, but I corrected it with the this. option you suggested; I guess this way you only move myMovieClip instead of something inside it, aka one less "child" to deal with...

Since we are discussing it I'd like to ask something else... I'm trying to make a chunk of code to be put inside the event_obj class so that if the DEL key is pressed the last istance (myMovieClip) created is deleted...

so when ever I click on the menu I create an instance of event_obj called myMovieCLip
var myMovieClip:MovieClip = new event_obj();

Inside event_obj I added this

    

this.addEventListener(KeyboardEvent.KEY_DOWN, erase);

          function erase(event:KeyboardEvent):void

          {

                    var object = event.target;

                    if (event.keyCode == 8)

                    {

                                                  object.removeMovieClip;

             }

          }

it doesn't work of course... I tryed different commands and methids without succes....
I'm starting to think I have to use an Array so that everytime i create an event_Obj, I place the instance in it... Then when ever I press delete Key the last instance is erased form the screen...

The logical structure would be;
Main menu > if clicked create Array> create an instance of event_obj inside Array...
     if delete key is pressed> access the array and delete the last instance inserted.

Hope this makes sense...

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

actually....
I just tried to move the chunk of code out of the movie clip like below and it kinda works...Problem is it erase all instances of myMovieClip and not the last created only... I guess it is because all new istances of myMovieClip share the same name, so if I say removeChild it erase them all...Is this correct?

function newEventMc():void

{

          var myMovieClip:MovieClip = new event_obj();

          addChild(myMovieClip);

          myMovieClip.x = 50;

          myMovieClip.y = 350;

          this.addEventListener(KeyboardEvent.KEY_DOWN, erase);

          function erase(event:KeyboardEvent):void

          {

                    if (event.keyCode == 8)

                         {

                              removeChild(myMovieClip);

                              }

              } 

}

function clickHandler(event:MouseEvent):void

{

          if (event.target == menu_event.panel.b1)

          {

                    newEventMc();

          }

etc. etc.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

First thing you need to do is avoid nesting functions within functions.  I know why you are probably doing it, but doing it is bad practice that will lead to troubles you will not understand how they happen when they do.

Anything that involves managing the objects you create is better done outside of the objects.

If you only want to remove that last child added, then you probably want to add them into an array and target the last element of the array.

Another option could be to use removeChildAt(numChildren-1);, but the hazard there is that you could end up removing beyond the first one added as well.

You do not need to be assigning that KEY_DOWN event listener more than once.  YOu do not need to create a new one each time you create an new instance.

In any case, you seem to be willing to experiment, which is a good thing.  Try things and see what works and what doesn't... that's the best way to learn... having solutions handed to you doesn't have the same impact as something you struggle with and evolve.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 05, 2012 May 05, 2012

Copy link to clipboard

Copied

LATEST

In any case, you seem to be willing to experiment, which is a good thing.  Try things and see what works and what doesn't... that's the best way to learn... having solutions handed to you doesn't have the same impact as something you struggle with and evolve.

I agree about having solutions haded out...
I'll keep on playing around...

Thanks again!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines