RemoveEventListener in drag and drop parallax composition
Hello all,
I have a question, one of my students is making a project with a horizontal parallax and he wants to add drag and drop functionality to this. It works, only when you start to drag the object (converted to symbol) shoots to the right out of the screen.
My guess is that this happens because of the parallax.. So, i want to remove the mousemove function temporarily so the drag and drop works. The code i came up with is this:
yepnope({nope:['jquery-ui.min.js'], complete: init});
function init(){
sym.$('bamboe4').draggable();
$("#Stage").removeEventListener('mousemove', onMove, false);
sym.$('panda').droppable({
accept:sym.$('bamboe4'),
drop: function (){
//addeventlistener here..
The thing is, it doesn't work..
In composition ready (stage) is the following code:
this.onMove=function(posX, posY){
timelinecontrol = Number(posX)*5;
sym.stop(timelinecontrol);
In mousemove (stage) is the following code:
this.onMove(e.pageX, e.pageY);
I hope that someone can help me.
With regards, Michel
Can you please post a question ? If you need to bump a question just reply to it
Frank
Similar Messages
-
Drag and Drop / Parallax / Timeline
Hi! there's a way to execute timeline by dragging? (ex: drag right direction = play timeline normally || drag left direction = play reverse)
i would create a parallax draggable, but don't find nothing 4 execute a timeline animation, use always a scrollbar!
tnx...Hi AppleMan -- thank you for the reply. I think perhaps I understated my wife's competence. She's studied the online tutorials and also looked through various help resources. Let me invoke a passage from the tutorial you linked:
"...once you have a few clips in your project, you can change the order by simply dragging them around."
Unfortunately in her case she can't. When she attempts to drag them around, the application will not place them where she indicates. Instead it will randomly drop them elsewhere in the timeline. This is the problem. -
Hi! I'm having a problem with getting this code working, basically I want to drag and drop two things onto another the things dissapear then it moves onto a new page, the first item works properly but then the second item wont dissapear and remains stuck to the cursor. Heres the code I'd be greatful of any help.
import flash.events.MouseEvent;
import fl.motion.MotionEvent;
stop();
Back6_btn.addEventListener(MouseEvent.CLICK, onBack6Click)
function onBack6Click(event:MouseEvent):void{
gotoAndPlay("Bedroom2");
Forward6_btn.addEventListener(MouseEvent.CLICK, onForward6Click)
function onForward6Click(event:MouseEvent):void{
gotoAndPlay('Brother bit');
var inGran:Number=0;
Gin.addEventListener(MouseEvent.MOUSE_DOWN, dragOn);
Tonic.addEventListener(MouseEvent.MOUSE_DOWN, dragOn);
function dragOn(event:MouseEvent):void {
event.target.startDrag(false);
stage.addEventListener(MouseEvent.MOUSE_UP, dragOff);
function dragOff(event:MouseEvent):void {
event.target.stopDrag();
if (event.target.dropTarget!=null&&event.target.dropTarget.parent==Gran) {
event.target.visible=false;
inGran++;
stage.removeEventListener(MouseEvent.MOUSE_UP, dragOff);
function checkPage(e:Event):void {
if (inGran==2) {
gotoAndPlay("Bedroom1");you have some mismatched brackets, change your target properties to currentTarget (and i'm not sure you're dropping onto the correct target) but, try:
import flash.events.MouseEvent;
import fl.motion.MotionEvent;
stop();
Back6_btn.addEventListener(MouseEvent.CLICK, onBack6Click)
function onBack6Click(event:MouseEvent):void{
gotoAndPlay("Bedroom2");
Forward6_btn.addEventListener(MouseEvent.CLICK, onForward6Click)
function onForward6Click(event:MouseEvent):void{
gotoAndPlay('Brother bit');
var inGran:Number=0;
Gin.addEventListener(MouseEvent.MOUSE_DOWN, dragOn);
Tonic.addEventListener(MouseEvent.MOUSE_DOWN, dragOn);
function dragOn(event:MouseEvent):void {
event.currentTarget.parent.addChild(event.currentTarget);
event.target.startDrag(false);
stage.addEventListener(MouseEvent.MOUSE_UP, dragOff);
function dragOff(event:MouseEvent):void {
event.target.stopDrag();
if (event.target.dropTarget!=null&&event.target.dropTarget.parent==Gran) {
event.target.visible=false;
inGran++;
stage.removeEventListener(MouseEvent.MOUSE_UP, dragOff);
function checkPage(e:Event):void {
if (inGran==2) {
gotoAndPlay("Bedroom1"); -
Can you use a custom cursor with drag and drop?
Hi there! I'm a newbie flash user and working on a simulation for a graduate course in instructional design. I'm using Flash Professional CC on Mac. Here's what I'm trying to do. I have several draggable sprites on the stage and three target sprites. I have specified the original x,y locations of the sprites and have set the end x,y locations as those of each of the three targets. Items must be dragged to one of the three targets.
Some questions:
1. Can I specify more than one End x,y location for a draggable sprite? I'm creating a lesson to teach kindergartners how to sort lunchroom waste. If they have a napkin, for example, it could either go into the compost OR into the recycling. In cases like this where an item could really be placed into more than one bin, I want them to get it right if they do either of those things, rather than forcing them to choose which one.
2. To make my project more "fun" for kids, I wanted to customize the cursor with a graphic of hand. When I tried this in the flash file it works perfectly until I add the drag and drop functionality for the wasted items. Then the cursor will more around but not pick up any items. Once I revert back to the standard pointer, the correct drag and drop functionality is restored.
3. I have it set to snap back to the original location if learner attempts to drop the item on the wrong target. I want to be able to play a sound file when that happens, as well as play a sound file when it lands on the correct target, as well as shrink the item and change its opacity so that it appears invisible. I want to give the illusion of it being placed into the bin. I have no idea as to the proper way to code these events so that they happen.
4. I've watched dozens of hours of youtube tutorials before coming here. I'm a quick study, but am very new to action script. In one of the videos the developer showed referencing an external action script file which I don't think is an option in CC. The coding method he used seemed much more streamlined and "clean" than the chunks I'm working with now. Is there an easy way for me to code information about these objects than the way I've got it here now? I hate starting new things with bad habits. The perils of self-teaching.
Thanks!
I'm pasting my code from the actions panel below so you can see what's going on:
stop();
/* Custom Mouse Cursor
Replaces the default mouse cursor with the specified symbol instance.
stage.addChild(customcursor);
customcursor.mouseEnabled = false;
customcursor.addEventListener(Event.ENTER_FRAME, fl_CustomMouseCursor);
function fl_CustomMouseCursor(event:Event)
customcursor.x = stage.mouseX;
customcursor.y = stage.mouseY;
Mouse.hide();
//To restore the default mouse pointer, uncomment the following lines:
customcursor.removeEventListener(Event.ENTER_FRAME, fl_CustomMouseCursor);
stage.removeChild(customcursor);
Mouse.show();
//set up variables and objects for dragging
var offset:int = 10;
var appleStartX:int = 243;
var appleStartY:int = 156;
var appleEndX:int = 522;
var appleEndY:int = 22;
apple.buttonMode = true;
apple.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
apple.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var cupStartX:int = 39;
var cupStartY:int = 266;
var cupEndX:int = 520;
var cupEndY:int = 175;
cup.buttonMode = true;
cup.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
cup.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var barStartX:int = 178;
var barStartY:int = 234;
var barEndX:int = 522;
var barEndY:int = 22;
bar.buttonMode = true;
bar.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
bar.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var orangeStartX:int = 284;
var orangeStartY:int = 102;
var orangeEndX:int = 522;
var orangeEndY:int = 22;
orange.buttonMode = true;
orange.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
orange.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var bottleStartX:int = 172;
var bottleStartY:int = 303;
var bottleEndX:int = 520;
var bottleEndY:int = 175;
bottle.buttonMode = true;
bottle.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
bottle.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var bananaStartX:int = 113;
var bananaStartY:int = 123;
var bananaEndX:int = 522;
var bananaEndY:int = 22;
banana.buttonMode = true;
banana.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
banana.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var napkinStartX:int = 248;
var napkinStartY:int = 271;
var napkinEndX:int = 520;
var napkinEndY:int = 175;
napkin.buttonMode = true;
napkin.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
napkin.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var yogurtStartX:int = 27;
var yogurtStartY:int = 136;
var yogurtEndX:int = 518;
var yogurtEndY:int = 329;
yogurt.buttonMode = true;
yogurt.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
yogurt.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var strawberryStartX:int = 120;
var strawberryStartY:int = 285;
var strawberryEndX:int = 522;
var strawberryEndY:int = 22;
strawberry.buttonMode = true;
strawberry.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
strawberry.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var sandwichStartX:int = 7;
var sandwichStartY:int = 364;
var sandwichEndX:int = 522;
var sandwichEndY:int = 22;
sandwich.buttonMode = true;
sandwich.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
sandwich.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var juiceStartX:int = 88;
var juiceStartY:int = 347;
var juiceEndX:int = 518;
var juiceEndY:int = 329;
juice.buttonMode = true;
juice.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
juice.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var foilStartX:int = 39;
var foilStartY:int = 416;
var foilEndX:int = 520;
var foilEndY:int = 175;
foil.buttonMode = true;
foil.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
foil.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
var waxbagStartX:int = 235;
var waxbagStartY:int = 342;
var waxbagEndX:int = 522;
var waxbagEndY:int = 22;
waxbag.buttonMode = true;
waxbag.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
waxbag.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
function startDragging (e:MouseEvent) {
e.currentTarget.startDrag();
function stopDragging (e:MouseEvent) {
e.currentTarget.stopDrag();
switch (e.currentTarget) {
case apple:
if (apple.x < appleEndX - offset || apple.x > appleEndX + offset || apple.y < appleEndY - offset || apple.y > appleEndY + offset) {
apple.x = appleStartX;
apple.y = appleStartY;
else {
apple.x = appleEndX;
apple.y = appleEndY;
//checkGame();
break;
case sandwich:
if (sandwich.x < sandwichEndX - offset || sandwich.x > sandwichEndX + offset || sandwich.y < sandwichEndY - offset || sandwich.y > sandwichEndY + offset) {
sandwich.x = sandwichStartX;
sandwich.y = sandwichStartY;
else {
sandwich.x = sandwichEndX;
sandwich.y = sandwichEndY;
//checkGame();
break;
case orange:
if (orange.x < orangeEndX - offset || orange.x > orangeEndX + offset || orange.y < orangeEndY - offset || orange.y > orangeEndY + offset) {
orange.x = orangeStartX;
orange.y = orangeStartY;
else {
orange.x = orangeEndX;
orange.y = orangeEndY;
//checkGame();
break;
case strawberry:
if (strawberry.x < strawberryEndX - offset || strawberry.x > strawberryEndX + offset || strawberry.y < strawberryEndY - offset || strawberry.y > strawberryEndY + offset) {
strawberry.x = strawberryStartX;
strawberry.y = strawberryStartY;
else {
strawberry.x = strawberryEndX;
strawberry.y = strawberryEndY;
//checkGame();
break;
case napkin:
if (napkin.x < napkinEndX - offset || napkin.x > napkinEndX + offset || napkin.y < napkinEndY - offset || napkin.y > napkinEndY + offset) {
napkin.x = napkinStartX;
napkin.y = napkinStartY;
else {
napkin.x = napkinEndX;
napkin.y = napkinEndY;
//checkGame();
break;
case bar:
if (bar.x < barEndX - offset || bar.x > barEndX + offset || bar.y < barEndY - offset || bar.y > barEndY + offset) {
bar.x = barStartX;
bar.y = barStartY;
else {
bar.x = barEndX;
bar.y = barEndY;
//checkGame();
break;
case juice:
if (juice.x < juiceEndX - offset || juice.x > juiceEndX + offset || juice.y < juiceEndY - offset || juice.y > juiceEndY + offset) {
juice.x = juiceStartX;
juice.y = juiceStartY;
else {
juice.x = juiceEndX;
juice.y = juiceEndY;
//checkGame();
break;
case foil:
if (foil.x < foilEndX - offset || foil.x > foilEndX + offset || foil.y < foilEndY - offset || foil.y > foilEndY + offset) {
foil.x = foilStartX;
foil.y = foilStartY;
else {
foil.x = foilEndX;
foil.y = foilEndY;
//checkGame();
break;
case banana:
if (banana.x < bananaEndX - offset || banana.x > bananaEndX + offset || banana.y < bananaEndY - offset || banana.y > bananaEndY + offset) {
banana.x = bananaStartX;
banana.y = bananaStartY;
else {
banana.x = bananaEndX;
banana.y = bananaEndY;
//checkGame();
break;
case bottle:
if (bottle.x < bottleEndX - offset || bottle.x > bottleEndX + offset || bottle.y < bottleEndY - offset || bottle.y > bottleEndY + offset) {
bottle.x = bottleStartX;
bottle.y = bottleStartY;
else {
bottle.x = bottleEndX;
bottle.y = bottleEndY;
//checkGame();
break;
case waxbag:
if (waxbag.x < waxbagEndX - offset || waxbag.x > waxbagEndX + offset || waxbag.y < waxbagEndY - offset || waxbag.y > waxbagEndY + offset) {
waxbag.x = waxbagStartX;
waxbag.y = waxbagStartY;
else {
waxbag.x = waxbagEndX;
waxbag.y = waxbagEndY;
//checkGame();
break;
case cup:
if (cup.x < cupEndX - offset || cup.x > cupEndX + offset || cup.y < cupEndY - offset || cup.y > cupEndY + offset) {
cup.x = cupStartX;
cup.y = cupStartY;
else {
cup.x = cupEndX;
cup.y = cupEndY;
//checkGame();
break;
case yogurt:
if (yogurt.x < yogurtEndX - offset || yogurt.x > yogurtEndX + offset || yogurt.y < yogurtEndY - offset || yogurt.y > yogurtEndY + offset) {
yogurt.x = yogurtStartX;
yogurt.y = yogurtStartY;
else {
waxbag.x = waxbagEndX;
waxbag.y = waxbagEndY;
//checkGame();Some questions:
1. Can I specify more than one End x,y location for a draggable sprite?
yes, use an if-else statement
I'm creating a lesson to teach kindergartners how to sort lunchroom waste. If they have a napkin, for example, it could either go into the compost OR into the recycling. In cases like this where an item could really be placed into more than one bin, I want them to get it right if they do either of those things, rather than forcing them to choose which one.
2. To make my project more "fun" for kids, I wanted to customize the cursor with a graphic of hand. When I tried this in the flash file it works perfectly until I add the drag and drop functionality for the wasted items. Then the cursor will more around but not pick up any items. Once I revert back to the standard pointer, the correct drag and drop functionality is restored.
assign your cursor's mouseEnabled property to false:
yourcursor.mouseEnabled=false;
3. I have it set to snap back to the original location if learner attempts to drop the item on the wrong target. I want to be able to play a sound file when that happens, as well as play a sound file when it lands on the correct target, as well as shrink the item and change its opacity so that it appears invisible. I want to give the illusion of it being placed into the bin. I have no idea as to the proper way to code these events so that they happen.
use the sound class to create a sound:
// initialize your correct sound once with
var correctSound:Sound=new CorrectSound(); // add an mp3 sound to your library and assign it class = CorrectSound
// apply the play() method everytime you want your sound to play:
correctSound.play();
// change an object's opacity:
someobject.alpha = .3; // partially visible
someobject.alpha = 1; // fully visible
someobject.visible=false; // not visible, at all.
// change an object's scale
someobject.scaleX=someobject.scaleY=.5; // shink width and height by 2
someobject.scaleX=someobject.scaleY=1; // resize to original
4. I've watched dozens of hours of youtube tutorials before coming here. I'm a quick study, but am very new to action script. In one of the videos the developer showed referencing an external action script file which I don't think is an option in CC. The coding method he used seemed much more streamlined and "clean" than the chunks I'm working with now. Is there an easy way for me to code information about these objects than the way I've got it here now? I hate starting new things with bad habits. The perils of self-teaching.
you could google:
actionscript 3 class coding
actionscript 3 object oriented programming
p.s. you can simplify and streamline your coding by learning about arrays and using hitTestObject. -
Drag and Drop game with only two targets
I created a drag and drop activity where their are five boxes that are supposed to go in to two columns in any order. I found a tutorial online that I based this activity off of.
The problem is that the tutorial shows you how to make a target for each mc which has worked for all the activities I've made except for this one where I need only two targets. How would I change it so I can have multiple mc's drop on to one target?
This is my AS:
var score:Number = 0;
var objectoriginalX:Number;
var objectoriginalY:Number;
growing_mc.buttonMode = true;
growing_mc.addEventListener(MouseEvent.MOUSE_DOWN, pickupObject);
growing_mc.addEventListener(MouseEvent.MOUSE_UP, dropObject);
gorging_mc.buttonMode = true;
gorging_mc.addEventListener(MouseEvent.MOUSE_DOWN, pickupObject);
gorging_mc.addEventListener(MouseEvent.MOUSE_UP, dropObject);
dormancy_mc.buttonMode = true;
dormancy_mc.addEventListener(MouseEvent.MOUSE_DOWN , pickupObject);
dormancy_mc.addEventListener(MouseEvent.MOUSE_UP, dropObject);
cystform_mc.buttonMode = true;
cystform_mc.addEventListener(MouseEvent.MOUSE_DOWN , pickupObject);
cystform_mc.addEventListener(MouseEvent.MOUSE_UP, dropObject);
hosttrans_mc.buttonMode = true;
hosttrans_mc.addEventListener(MouseEvent.MOUSE_DOW N, pickupObject);
hosttrans_mc.addEventListener(MouseEvent.MOUSE_UP, dropObject);
function pickupObject(event:MouseEvent):void {
event.target.startDrag(true);
event.target.parent.addChild(event.target);
objectoriginalX = event.target.x;
objectoriginalY = event.target.y;
function dropObject(event:MouseEvent):void {
event.target.stopDrag();
var matchingTargetName:String = "target" + event.target.name;
var matchingTargetisplayObject = getChildByName(matchingTargetName);
if (event.target.dropTarget != null && event.target.dropTarget.parent == matchingTarget){
event.target.removeEventListener(MouseEvent.MOUSE_ DOWN, pickupObject);
event.target.removeEventListener(MouseEvent.MOUSE_ UP, dropObject);
event.target.buttonMode = false;
event.target.x = matchingTarget.x;
event.target.y = matchingTarget.y;
score++;
scoreField.text = String(score);
} else {
event.target.x = objectoriginalX;
event.target.y = objectoriginalY;
if(score == 5){
response_mc.gotoAndStop(2);var matchingTargetName:String =(event.target.name).substring(0, 1);
Change the name of the target to A and B and the mc A1, A2, A3, A4... and B1, B2,B3... -
Drag and Drop in custom components..
hello friends,
I am trying to devlop a schedule component. on part of this i trying to develop a functionality where the user can reschedure the appointment by drag and drop. the dragdrop event in the container component is not triggered when ther user drag the appointment and drop it in the another container. can any one help me on this please. i have given below my source codes.
Testbox.as
package layouts.DayViewControl.containers
import mx.core.Container;
public class TestBox extends Container
private var __timeAndXYCoOrdArray:Array;
private var __xyDiff:int=0;
public function TestBox()
super();
__timeAndXYCoOrdArray=new Array();
protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth,unscaledHeight);
var totalSlots:int=24*2;
var __lineThickness:int=1;
var __lineAlpha:int=0.2;
var boxHeight:uint=unscaledHeight/totalSlots;
graphics.clear();
var xPos:int=0;
var ypos:int=0;
graphics.lineStyle(2,0x000000,0.5);
graphics.drawRect(0,0,unscaledWidth,unscaledHeight);
var __boxHeight:int=unscaledHeight/totalSlots;
var __minusCount:int=1;
for(var i:int=0;i<totalSlots;i++){
var timeStr:String="";
if(i%2 == 0){
__lineThickness=2;
graphics.lineStyle(__lineThickness,0x000000,0.4);
}else{
__lineThickness=1;
graphics.lineStyle(__lineThickness,0x000000,0.2);
graphics.moveTo(xPos,ypos);
var tempYpos:int=ypos;
if(__xyDiff == 0){
__xyDiff=ypos-xPos;
graphics.lineTo(xPos+unscaledWidth,tempYpos);
ypos+=boxHeight;
var newYPos:int=0;
if(i == 0){
timeStr="00:00";
}else if(i%2 != 0){
if(i<=9){
timeStr="0"+(i-__minusCount).toString()+":30";
}else{
timeStr=(i-__minusCount).toString()+":30";
newYPos=ypos-__xyDiff;
}else if(i%2 == 0){
if(i<=9){
timeStr="0"+(i-__minusCount).toString()+":00";
}else{
timeStr=(i-__minusCount).toString()+":00";
__minusCount+=1;
newYPos=ypos-__xyDiff;
__timeAndXYCoOrdArray.push({XPos:xPos,YPos:newYPos,Time:timeStr});
public function getXFromtime(inputTime:String):int{
var returnVal:int=0;
if(inputTime && inputTime != ""){
for (var j:int=0;j<__timeAndXYCoOrdArray.length;j++){
if(__timeAndXYCoOrdArray[j].Time.toString() == inputTime){
returnVal=parseInt(__timeAndXYCoOrdArray[j].XPos)
break;
return returnVal;
public function getYFromtime(inputTime:String):int{
var returnVal:int=0;
if(inputTime && inputTime != ""){
for (var j:int=0;j<__timeAndXYCoOrdArray.length;j++){
if(__timeAndXYCoOrdArray[j].Time.toString() == inputTime){
returnVal=parseInt(__timeAndXYCoOrdArray[j].YPos)
break;
return returnVal;
public function getTimeDifference():int{
return __xyDiff;
TimeDividerLines.as
package layouts.DayViewControl
import flash.events.MouseEvent;
import flash.utils.Dictionary;
import layouts.DayViewControl.containers.TestBox;
import mx.collections.ArrayCollection;
import mx.core.DragSource;
import mx.core.EventPriority;
import mx.core.UIComponent;
import mx.events.DragEvent;
import mx.managers.DragManager;
public class TimeDividerLines extends TestBox
private var __linesPerHour:int=4;
private var __currentDate:Date;
private var __timeAndXYCoOrdArray:Array;
private var __dataComponentArry:Array;
private var __totalAppointment:int=5;
private var __xyDiff:int=0;
private var __apptDataInfoArry:Array;
private var __dataProviderChanged:Boolean=false;
private var __reArrangeDataArrayCol:ArrayCollection;
private var __sortedArrayCollection:ArrayCollection;
private var __dragDropEnabled:Boolean=false;
public function TimeDividerLines()
super();
//__timeAndXYCoOrdArray=new Array();
__dataComponentArry=new Array();
__apptDataInfoArry=new Array();
__sortedArrayCollection=new ArrayCollection();
public function set dragDropEnabled(inputVal:Boolean):void{
if(inputVal){
//set youself for drag and drop event
this.addEventListener(DragEvent.DRAG_ENTER,dragEnterEventHandler,false,EventPriority.DEFA ULT_HANDLER);
this.addEventListener(DragEvent.DRAG_OVER,dragOverEventHandler,false,EventPriority.DEFAUL T_HANDLER);
this.addEventListener(DragEvent.DRAG_DROP,dragDropEventHandler,false,EventPriority.DEFAUL T_HANDLER);
this.addEventListener(DragEvent.DRAG_COMPLETE,dropCompleteHandler);
}else{
this.removeEventListener(DragEvent.DRAG_ENTER,dragEnterEventHandler,false);
this.removeEventListener(DragEvent.DRAG_OVER,dragOverEventHandler,false);
this.removeEventListener(DragEvent.DRAG_DROP,dragDropEventHandler,false);
__dragDropEnabled=inputVal;
private function dropCompleteHandler(event:DragEvent):void{
trace("inside drop complete handler");
private function dragEnterEventHandler(event:DragEvent):void{
if(event.dragSource.hasFormat("Appointment")){
var dropTarget:UIComponent=UIComponent(event.currentTarget);
DragManager.acceptDragDrop(dropTarget);
DragManager.showFeedback(event.ctrlKey ? DragManager.COPY : DragManager.MOVE);
return;
DragManager.showFeedback(DragManager.NONE);
private function dragOverEventHandler(event:DragEvent):void{
/* if(event.dragSource.hasFormat("Appointment")){
if(event.ctrlKey){
DragManager.showFeedback(DragManager.COPY);
return
}else{
DragManager.showFeedback(DragManager.MOVE);
return
DragManager.showFeedback(DragManager.NONE); */
private function dragDropEventHandler(event:DragEvent):void{
//We need to do two things here. you need to add the dropped data to the data provider list.
//and need need to update this entry to DB
/* if(event.dragSource.hasFormat("Appointment")){
var draggedbox:AppointmentDisplayBox=event.dragSource.dataForFormat("Appointment") as AppointmentDisplayBox;
var dropBox:TimeDividerLines=event.currentTarget as TimeDividerLines;
//create a new copy
var newBox:AppointmentDisplayBox=new AppointmentDisplayBox();
newBox=draggedbox;
newBox.x=dropBox.mouseX;
newBox.y=dropBox.mouseY;
this.addChild(newBox);
trace("11111111111111111111111111111111111111111")
private function mouseDownHandler(event:MouseEvent):void{
var draginit:AppointmentDisplayBox=AppointmentDisplayBox(event.currentTarget);
var ds:DragSource=new DragSource();
ds.addData(draginit,"Appointment");
DragManager.doDrag(draginit,ds,event);
override protected function createChildren():void{
super.createChildren();
override protected function commitProperties():void{
if(__dataProviderChanged){
__dataComponentArry=new Array();
for (var k:int=0;k<__apptDataInfoArry.length;k++){
var tempDispBox:AppointmentDisplayBox=new AppointmentDisplayBox();
tempDispBox.currentDate=this.currentDate;
tempDispBox.startTime=__apptDataInfoArry[k].StartTime.toString();
tempDispBox.endTime=__apptDataInfoArry[k].EndTime.toString();
tempDispBox.apptDataXml=__apptDataInfoArry[k].Data as XML;
tempDispBox.addEventListener(MouseEvent.MOUSE_DOWN,mouseDownHandler);
this.addChild(tempDispBox);
__dataComponentArry.push(tempDispBox);
__dataProviderChanged=false;
private function sortTheCollectionValues(__inputArrayCol:ArrayCollection):ArrayCollection{
var returnArrayCollection:ArrayCollection=new ArrayCollection();
var tempArray:Array=new Array();
for(var i:int=0;i<__inputArrayCol.length;i++){
tempArray.push({Length:(__inputArrayCol[i] as Array).length,Index:i});
tempArray.sortOn("Length",Array.DESCENDING|Array.NUMERIC);
for(var j:int=0;j<tempArray.length;j++){
returnArrayCollection.addItem(__inputArrayCol[tempArray[j].Index]);
return returnArrayCollection;
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth,unscaledHeight);
if(__dataComponentArry.length > 0){
__sortedArrayCollection=new ArrayCollection();
sortArray(__dataComponentArry);
if(__sortedArrayCollection.length > 0 ){
//you need to sort the arraycollection based on the length first to draw the highest no. child array first
__sortedArrayCollection=sortTheCollectionValues(__sortedArrayCollection);
var appGap:int=2;
var endGap:int=10;
//var drawnApptObj:Array=new Array();
var existingChildArray:Array=new Array();
var drawnApptObj:Dictionary=new Dictionary();
for(var l:int=0;l<__sortedArrayCollection.length;l++){
var apptWidth:int=0;
var innerArry:Array=__sortedArrayCollection[l] as Array;
existingChildArray=new Array();
//you need to recalculate the width
//for the first iteration you need to sort by height
//if(l == 0){
// innerArry.sortOn("apptHeight",Array.NUMERIC|Array.DESCENDING);
//}else{
innerArry.sortOn(["isChild","apptHeight"],Array.NUMERIC|Array.DESCENDING);
//innerArry.sortOn("apptHeight",Array.NUMERIC|Array.DESCENDING);
//first we need to find out any intersection appointment is there
var count:int=0;
for each(var tempApptDispBox:AppointmentDisplayBox in innerArry){
if(drawnApptObj[tempApptDispBox] == tempApptDispBox){
if(apptWidth < tempApptDispBox.width){
apptWidth=tempApptDispBox.width;
existingChildArray.push({index:count,object:tempApptDispBox});
count++;
if(apptWidth == 0){
apptWidth=(unscaledWidth - (endGap + (appGap*innerArry.length)))/innerArry.length;
//now you need to layout the childrens
var canDraw:Boolean=false;
var ismatch:Boolean=false;
for (var childCnt:int=0;childCnt < innerArry.length;childCnt++){
var tempDispBox:AppointmentDisplayBox=innerArry[childCnt] as AppointmentDisplayBox;
for (var i:int=0;i<existingChildArray.length;i++){
if(existingChildArray[i].index == childCnt){
ismatch=true;
break;
if(childCnt == 0 && !ismatch){
tempDispBox.x=this.getXFromtime(tempDispBox.startTime.toString())+2;
canDraw=true;
}else if(existingChildArray.indexOf(childCnt) > -1 && childCnt != 0){
//tempDispBox.x=(existingChildArray[childCnt] as AppointmentDisplayBox).x+apptWidth+appGap;
canDraw=false;
}else if(childCnt != 0 && !ismatch){
tempDispBox.x=((existingChildArray[childCnt-1].object) as AppointmentDisplayBox).x+apptWidth+appGap;
canDraw=true;
if(canDraw){
tempDispBox.y=this.getYFromtime(tempDispBox.startTime.toString());
tempDispBox.width=apptWidth;
tempDispBox.height=tempDispBox.apptHeight-2;
if(tempDispBox.isChild){
drawnApptObj[tempDispBox]=tempDispBox;
existingChildArray.push({index:childCnt,object:tempDispBox});
canDraw=false;
ismatch=false;
//first we need to sort the component array based on the height property to position the biggest appointment first
private function sortArray(tempArry:Array):void{
//var tempArry:Array=arrayClone(__datacompArray);
for(var i:int=0;i<tempArry.length;i++){
var tempDispBox:AppointmentDisplayBox=tempArry[i] as AppointmentDisplayBox;
var start:int=this.getYFromtime(tempDispBox.startTime.toString());
var end:int=this.getYFromtime(tempDispBox.endTime.toString());
tempDispBox.apptHeight=end-start;
var indexArray:Array=new Array();
var canContinue:Boolean=false;
var loopArray:Array=new Array();
loopArray=tempArry.concat(); // this will copy the array to loopArray
var copyArry:Array=new Array();
var k:int=0;
while(k<loopArray.length){
loopArray.sortOn("apptHeight",Array.NUMERIC|Array.DESCENDING);
if(indexArray.length > 0){
if(indexArray.indexOf(k) >= 0){
canContinue=false;
}else{
canContinue=true;
}else{
canContinue=true;
if(canContinue){
var newArry:Array=new Array();
//newArry.push(tempArry[k]);
for (var innerCnt:int=0;innerCnt<loopArray.length;innerCnt++){
var locCanContinue:Boolean=false;
if(indexArray.length > 0){
if(indexArray.indexOf(innerCnt) >= 0){
locCanContinue=false;
}else{
locCanContinue=true;
}else{
locCanContinue=true;
if(locCanContinue && k != innerCnt){
var outerstartTime:Number=parseFloat(loopArray[k].startTime.toString().replace(":","."));
var outerendtime:Number=parseFloat(loopArray[k].endTime.toString().replace(":","."));
var innerStartTime:Number=parseFloat(loopArray[innerCnt].startTime.toString().replace(":","." ));
var innerEndtime:Number=parseFloat(loopArray[innerCnt].endTime.toString().replace(":","."));
if(outerstartTime == innerStartTime && outerendtime == innerEndtime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
indexArray.push(innerCnt);
}else if(outerstartTime == innerStartTime && outerendtime > innerEndtime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
indexArray.push(innerCnt);
}else if(outerstartTime < innerStartTime && outerendtime == innerEndtime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
indexArray.push(innerCnt);
}else if(outerstartTime < innerStartTime && outerendtime > innerEndtime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
indexArray.push(innerCnt);
}else if(outerstartTime > innerStartTime && outerendtime > innerEndtime && innerEndtime > outerstartTime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
loopArray[innerCnt].isChild=true;
//indexArray.push(innerCnt);
}else if(outerstartTime < innerStartTime && outerendtime < innerEndtime && innerStartTime < outerendtime){
//newArry.push(tempArry.splice(innerCnt,1));
newArry.push(loopArray[innerCnt]);
loopArray[innerCnt].isChild=true;
//indexArray.push(innerCnt);
}else if(outerstartTime == innerStartTime && outerendtime < innerEndtime){
newArry.push(loopArray[innerCnt]);
loopArray[innerCnt].isChild=true;
}else if(outerstartTime > innerStartTime && outerendtime == innerEndtime){
newArry.push(loopArray[innerCnt]);
loopArray[innerCnt].isChild=true;
//newArry.push(tempArry.splice(k,1));
indexArray.push(k);
newArry.push(loopArray[k]);
__sortedArrayCollection.addItem(newArry);
copyArry=loopArray.concat();
loopArray=new Array();
for (var j:int=0;j<copyArry.length;j++){
if(indexArray.indexOf(j) < 0){
loopArray.push(copyArry[j]);
indexArray=new Array();
private function arrayClone(source:Array):Array{
var returnArray:Array=new Array();
for(var j:int=0;j<source.length;j++){
returnArray.push(source[j]);
return returnArray;
public function set currentDate(inputVal:Date):void{
if(__currentDate != inputVal){
__currentDate=inputVal;
public function get currentDate():Date{
return __currentDate;
public function set apptDataArray(inputVal:Array):void{
if(!__dataProviderChanged && inputVal.length > 0){
__apptDataInfoArry=inputVal;
__dataProviderChanged=true;
invalidateProperties();
invalidateDisplayList();
AppointmentDisplayBox.as
package layouts.DayViewControl
import mx.controls.TextInput;
import mx.core.UIComponent;
public class AppointmentDisplayBox extends UIComponent
private var __startTime:String;
private var __EndTime:String;
private var __currentDate:Date;
private var __apptData:XML;
private var __height:Number;
private var __isChild:Boolean=false;
private var __modifiedWidth:Boolean=false;
private var __docNameLable:TextInput;
private var __appDetails:TextInput;
public function AppointmentDisplayBox()
super();
this.setStyle("horizontalScrollPolicy","off");
this.setStyle("verticalScrollPolicy","off");
this.setStyle("borderStyle","solid");
this.setStyle("verticalGap","0");
this.setStyle("borderStyle","outset");
this.buttonMode=true;
protected override function createChildren():void{
super.createChildren();
if(!__docNameLable){
__docNameLable=new TextInput();
__docNameLable.editable=false;
__docNameLable.setStyle("horizontalScrollPolicy","off");
__docNameLable.setStyle("verticalScrollPolicy","off");
__docNameLable.setStyle("borderStyle","none");
//__docNameLable.setStyle("borderThickness","0");
__docNameLable.buttonMode=true;
addChild(__docNameLable);
if(!__appDetails){
__appDetails=new TextInput();
__appDetails.editable=false;
__appDetails.setStyle("horizontalScrollPolicy","off");
__appDetails.setStyle("verticalScrollPolicy","off");
__appDetails.setStyle("borderStyle","none");
__appDetails.setStyle("backgroundColor","0xB1FB17");
__appDetails.buttonMode=true;
// __appDetails.setStyle("borderThickness","0");
addChild(__appDetails);
protected override function commitProperties():void{
super.commitProperties();
if(__apptData != null){
__docNameLable.text=__apptData.DocName.toString();
__appDetails.text=__apptData.PatientID.toString()+"\n"+__apptData.Description.toString();
invalidateDisplayList();
protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
super.updateDisplayList(unscaledWidth,unscaledHeight);
__docNameLable.setActualSize(unscaledWidth-1,20);
__docNameLable.move(1,1);
graphics.clear();
var lineColor:uint=0x000000;
graphics.lineStyle(1,lineColor,1);
graphics.beginFill(0xFEFDFD,1)
graphics.drawRect(0,0,unscaledWidth,22);
graphics.endFill();
__appDetails.setActualSize(unscaledWidth-1,unscaledHeight-22);
__appDetails.move(1,23);
graphics.drawRect(0,22,unscaledWidth,unscaledHeight-20);
public function set startTime(inputVal:String):void{
__startTime=inputVal;
public function get startTime():String{
return __startTime;
public function set endTime(inputVal:String):void{
__EndTime=inputVal;
public function get endTime():String{
return __EndTime;
public function set currentDate(inputVal:Date):void{
__currentDate=inputVal;
public function get currentDate():Date{
return __currentDate;
public function set apptHeight(inputVal:Number):void{
__height=inputVal;
public function get apptHeight():Number{
return __height;
public function set isChild(inputVal:Boolean):void{
__isChild=inputVal;
public function get isChild():Boolean{
return __isChild;
public function set isModifiedWidth(inputVal:Boolean):void{
__modifiedWidth=inputVal;
public function get isModifiedWidth():Boolean{
return __modifiedWidth;
public function set apptDataXml(inputVal:XML):void{
if(__apptData != inputVal){
__apptData=inputVal;
invalidateProperties();
invalidateDisplayList();
public function get apptDataXml():XML{
return __apptData;
Test.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:layouts="layouts.*"
xmlns:DayViewControl="layouts.DayViewControl.*" xmlns:test="layouts.DayViewControl.containers.*">
<mx:Script>
<![CDATA[
import mx.controls.TextInput;
import layouts.DayViewControl.TimeDividerLines;
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
import layouts.DayViewControl.AppointmentDisplayBox;
private function mouseDownHandler(event:MouseEvent):void{
var dragint:AppointmentDisplayBox=AppointmentDisplayBox(event.currentTarget);
//var dragint:TextInput=TextInput(event.currentTarget);
var ds:DragSource=new DragSource();
ds.addData(dragint,"Appoitment");
DragManager.doDrag(dragint,ds,event);
private function dragEnterHandler(event:DragEvent):void{
if(event.dragSource.hasFormat("Appoitment")){
var droptarget:TimeDividerLines=TimeDividerLines(event.currentTarget);
DragManager.acceptDragDrop(droptarget);
DragManager.showFeedback(event.ctrlKey?DragManager.COPY:DragManager.MOVE);
return;
DragManager.showFeedback(DragManager.NONE);
private function dragDropHandler(event:DragEvent):void{
if(event.dragSource.hasFormat("Appoitment")){
var droppedObj:AppointmentDisplayBox=AppointmentDisplayBox(event.dragSource.dataForFormat("Ap poitment"));
//var droppedObj:TextInput=TextInput(event.dragSource.dataForFormat("Appoitment"));
var dropTarget:TimeDividerLines=TimeDividerLines(event.currentTarget);
droppedObj.x=dropTarget.mouseX;
droppedObj.y=dropTarget.mouseY;
dropTarget.addChild(droppedObj);
]]>
</mx:Script>
<mx:HBox width="100%" height="100%">
<DayViewControl:TimeDividerLines width="50%" height="100%">
<DayViewControl:AppointmentDisplayBox width="50" height="100" mouseDown="mouseDownHandler(event)"/>
</DayViewControl:TimeDividerLines>
<DayViewControl:TimeDividerLines width="50%" height="100%" dragEnter="dragEnterHandler(event)" dragDrop="dragDropHandler(event)"/>
</mx:HBox>
</mx:Application>First 3 .as are the component
source. in the last test.mxml file i have written the drag and drop functionality.
can any help me?? please -
Drag and Drop with multiple targets
I'm having a problem find a solution to my drag and drop problem. Here is what this flash piece is basically supposed to do:
9 dragable items on the stage
5 targets, numbers 1 - 5, where the items can be placed
5 of the 9 dragable items are the correct answer and the user needs to drag them to the correct target, and have to be in order from 1-5. (eg. let's say the instructions are:
Please place the, in the correct order, the 5 steps to getting ready in the morning
Drag items Targets
Brush teeth 1.
Change oil in car 2.
Wash face 3.
Put pants on 4.
Shower 5.
Get out of bed
Do tax's
So far I have it so if you drop the correct answer into its correct target it snaps to it and disable it's eventListeners. If you drop the drag item on the other targets they snap to it and disable it as well. They only problem is if the user accidentally drops the item anywheres else on the stage it locks it in place. Instead I want it to return to the orginal x and y position. Can anyone help?!?
Here is my code
DragDrop.as
package
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.filters.DropShadowFilter;
public class DragDrop extends MovieClip
public var _targetPiece:*;
public function DragDrop()
this.addEventListener(MouseEvent.MOUSE_DOWN, dragMovie);
this.addEventListener(MouseEvent.MOUSE_UP, dropMovie);
this.buttonMode = true;
private function dragMovie(event:MouseEvent):void
this.startDrag();
this.filters = [new DropShadowFilter(0.5)];
this.parent.addChild(this);
private function dropMovie(event:MouseEvent):void
this.stopDrag();
this.filters = [];
public function disable():void
this.buttonMode = false;
this.removeEventListener(MouseEvent.MOUSE_DOWN, dragMovie);
this.removeEventListener(MouseEvent.MOUSE_UP, dropMovie);
DragGame.as
package
import flash.display.MovieClip;
import flash.events.MouseEvent;
import DragDrop;
import BL;
import BR;
import BM;
import TL;
import TR;
import TM;
import BC;
import TC;
import BA;
public class DragGame extends MovieClip
private var bl:BL;
private var br:BR;
private var bm:BM;
private var tl:TL;
private var tr:TR;
private var tm:TM;
private var bc:BC;
private var tc:TC;
private var ba:BA;
private var _totalPieces:Number;
private var _currentPieces:Number;
private var _submit:Number;
private var _reveal:Number;
public function DragGame()
_totalPieces = 5;
_currentPieces = 0;
createPieces();
_submit = 6;
_reveal = 1;
private function createPieces():void
bl = new BL();
addChild(bl);
bl._targetPiece = blt_mc;
bl.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition1(bl);
br = new BR();
addChild(br);
br._targetPiece = brt_mc;
br.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition2(br);
bm = new BM();
addChild(bm);
bm._targetPiece = bmt_mc;
bm.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition3(bm);
tl = new TL();
addChild(tl);
tl._targetPiece = tlt_mc;
tl.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition4(tl);
tr = new TR();
addChild(tr);
tr._targetPiece = trt_mc;
tr.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition5(tr);
tm = new TM();
addChild(tm);
tm._targetPiece = tmt_mc;
tm.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition6(tm);
bc = new BC();
addChild(bc);
bc._targetPiece = trt_mc;
bc.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition7(bc);
tc = new TC();
addChild(tc);
tc._targetPiece = trt_mc;
tc.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition8(tc);
ba = new BA();
addChild(ba);
ba._targetPiece = trt_mc;
ba.addEventListener(MouseEvent.MOUSE_UP, checkTarget);
piecePosition9(ba);
private function checkTarget(event:MouseEvent):void
if(event.currentTarget.hitTestObject(event.currentTarget._targetPiece))
event.currentTarget.x = event.currentTarget._targetPiece.x;
event.currentTarget.y = event.currentTarget._targetPiece.y;
event.currentTarget.removeEventListener(MouseEvent.MOUSE_UP, checkTarget);
event.currentTarget.disable();
_currentPieces ++;
_submit --;
if(_currentPieces >= _totalPieces)
wrong_txt.visible = false;
answer_txt.visible = true;
if(_submit <= _reveal)
submit_mc.visible = true;
submit_mc.buttonMode = true;
else
event.currentTarget.x= event.currentTarget.dropTarget.parent.x;
event.currentTarget.y= event.currentTarget.dropTarget.parent.y;
event.currentTarget.disable();
if(_submit <= _reveal)
submit_mc.visible = true;
submit_mc.buttonMode = true;
private function piecePosition1(piece:*):void
piece.x = 50.2;
piece.y = 87.2;
piece._origX = 50.2;
piece._origY = 87.1;
private function piecePosition2(piece:*):void
piece.x = 50.2;
piece.y = 109.2;
piece._origX = 50.2;
piece._origY = 109.2;
private function piecePosition3(piece:*):void
piece.x = 50.2;
piece.y = 131.2;
piece._origX = 50.2;
piece._origY = 131.2;
private function piecePosition4(piece:*):void
piece.x = 50.2;
piece.y = 153.3;
piece._origX = 50.2;
piece._origY = 153.3;
private function piecePosition5(piece:*):void
piece.x = 50.2;
piece.y = 175.3;
piece._origX = 50.2;
piece._origY = 175.3;
private function piecePosition6(piece:*):void
piece.x = 50.2;
piece.y = 197.3;
piece._origX = 50.2;
piece._origY = 197.3;
private function piecePosition7(piece:*):void
piece.x = 50.2;
piece.y = 219.4;
piece._origX = 50.2;
piece._origY = 219.4;
private function piecePosition8(piece:*):void
piece.x = 50.2;
piece.y = 241.4;
piece._origX = 50.2;
piece._origY = 241.4;
private function piecePosition9(piece:*):void
piece.x = 50.2;
piece.y = 263.7;
piece._origX = 50.2;
piece._origY = 263.7;create an array of your droptargets (eg, droptargetA) and check if the object is dropped on a droptarget. you don't even need the if-branch of the following if-else unless you do something that depends on whether the correct droptarget is hit.
function checkTarget(event:MouseEvent):void
if(event.currentTarget.hitTestObject(event.currentTarget._targetPiece ))
event.currentTarget.x = event.currentTarget._targetPiece.x;
event.currentTarget.y = event.currentTarget._targetPiece.y;
event.currentTarget.removeEventListener(MouseEvent.MOUSE_UP, checkTarget);
event.currentTarget.disable();
else
var x:Number=event.currentTarget.dropTarget._origX;
var y:Number=event.currentTarget.dropTarget._origY;
for(var i:uint=0;i<droptargetNum;i++){
if(event.currentTarget.hitTestObject(droptargetA[i] )){
x=droptargetA[i].x;
y=droptargetA[i].y;
break
event.currentTarget.x=x;
event.currentTarget.y=y; -
Drag and drop to target simple errors, expecting identifier?
im creating a drag and drop. moving a guitarest name to a target e.g draging a movieclip called slash to a dynamic text box called box_slash this is my code and i get 2 stupid errors but have been up all night and cant figure it out!
flash cs5 actionscript 3, is this code for actionscript3 i found the base for it here: http://edutechwiki.unige.ch/en/Flash_drag_and_drop_tutorial any help would be incredible as it for an assignment and im new to flash
var hits = 0;
// Register mouse event functions
slash.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
slash.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
clapton.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
clapton.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
hendrix.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
hendix.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
// Define a mouse down handler (user is dragging)
function mouseDownHandler(evt:MouseEvent):void {
var object = evt.target;
// we should limit dragging to the area inside the canvas
object.startDrag();
function mouseUpHandler(evt:MouseEvent):void {
var obj = evt.target;
// obj.dropTarget will give us the reference to the shape of
// the object over which we dropped the circle.
var target = obj.dropTarget;
// If the target object exists the we ask the test_match function
// to compare moved obj and target where it was dropped.
if (target != null)
test_match(target, obj);
obj.stopDrag();
function test_match(target,obj) {
// test if either one of the four pairs match
if ( (target == box_slash && obj == slash) ||
(target == box_clapton && obj == clapton) ||
(target == box_hendrix && obj == hendrix) || )
// we got a hit
hits = hits+1;
textField.text = "Correct! :)";
// make the object transparent
obj.alpha = 0.5;
// kill its event listeners - object can't be moved anymore
obj.removeEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
obj.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
// Test if we are done
if (hits == 3)
textField.text = "Well Done";
else
textField.text = "wrong! :(";
the errors are: i have highlighted the lines
Scene 1, Layer 'Actions', Frame 1, Line 39
1084: Syntax error: expecting rightparen before leftbrace.
Scene 1, Layer 'Actions', Frame 1, Line 38
1084: Syntax error: expecting identifier before rightparen.Thankyou very much that does get rid of that error now i get
Scene 1, Layer 'Actions', Frame 1, Line 42
1120: Access of undefined property textField.
Scene 1, Layer 'Actions', Frame 1, Line 51
1120: Access of undefined property textField.
Scene 1, Layer 'Actions', Frame 1, Line 56
1120: Access of undefined property textField.
now im sure this is simple but im as im sure you have figured out im a complete noob to flash
textField.text = "Correct! :)";
textField.text = "Well Done";
textField.text = "wrong! :(";
is this something to do with an instance name? -
Drag and drop to multiple targets
Hi
Im trying to create a simple drag and drop app where you can drap a movieclip into multiple areas.
This is the code i have so far (taken from a tutorial i found) thats works perfectly for 1 target but not for multiples. I initially tried giving the targets the same instance name but that didnt work.
stop();
var startX:Number;
var startY:Number;
square_mc.addEventListener(MouseEvent.MOUSE_DOWN, pickUp);
square_mc.addEventListener(MouseEvent.MOUSE_UP, dropIt);
function pickUp(event:MouseEvent):void {
square_mc.gotoAndStop (2);
event.target.startDrag(true);
event.target.parent.addChild(event.target);
startX = event.target.x;
startY = event.target.y;
function dropIt(event:MouseEvent):void {
event.target.stopDrag();
var myTargetName:String = "target" + event.target.name;
var myTarget:DisplayObject = getChildByName(myTargetName);
if (event.target.dropTarget != null && event.target.dropTarget.parent == myTarget){
reply_txt.text = "you have 5 days left";
event.target.removeEventListener(MouseEvent.MOUSE_DOWN, pickUp);
event.target.removeEventListener(MouseEvent.MOUSE_UP, dropIt);
event.target.buttonMode = false;
event.target.x = myTarget.x;
event.target.y = myTarget.y;
} else {
square_mc.gotoAndStop (1);
event.target.x = startX;
event.target.y = startY;
if(counter == 4){
reply_txt.text = "Congrats, you're finished!";
square_mc.buttonMode = true;
does anyone have any ideas?
Many thanks
SimonHere you go, I changed a couple things. First, I made the "decision" that all your drop targets would be named 'target'.
stop();
var startX:Number;
var startY:Number;
square_mc.addEventListener(MouseEvent.MOUSE_DOWN, pickUp);
square_mc.addEventListener(MouseEvent.MOUSE_UP, dropIt);
square_mc.buttonMode = true;
function pickUp(event:MouseEvent):void
square_mc.gotoAndStop (2);
event.target.startDrag()//true);
event.target.parent.addChild(event.target);
startX = event.target.x;
startY = event.target.y;
function dropIt(event:MouseEvent):void
// changed the bit here to set 'myTarget' after the null and name checks are made
event.target.stopDrag();
if (event.target.dropTarget != null && event.target.dropTarget.parent.name == "target")
var myTarget = event.target.dropTarget.parent;
reply_txt.text = "you have 5 days left";
event.target.removeEventListener(MouseEvent.MOUSE_DOWN, pickUp);
event.target.removeEventListener(MouseEvent.MOUSE_UP, dropIt);
event.target.buttonMode = false;
event.target.x = myTarget.x;
event.target.y = myTarget.y;
} else {
square_mc.gotoAndStop (1);
event.target.x = startX;
event.target.y = startY;
if(counter == 4)
reply_txt.text = "Congrats, you're finished!";
HTH!
-Ted -
Hello, I'm making a game in which I have some drag and drop items that they can be multiplied as many as you want. This items have to stay in the scene and I also have a bin in the menu where If you drag them they have to disappear.The problem is that I tried with multiple coordinates and they disappear also in the scene in the moment that I'm dragging them out of the menu. So, my question is:What could be wrong? Is the issue in the code?
Thank you for taking the time to help me. It's my first game in AS3 so I'm not so familiar with the codes.
import flash.display.Sprite;
import flash.events.MouseEvent;
DDB1.addEventListener(MouseEvent.MOUSE_DOWN, createDDB1);
var _DDB1:Sprite;
function createDDB1(evt:MouseEvent){
_DDB1 = new DDB1MC();
_DDB1.x = evt.stageX;
_DDB1.y = evt.stageY;
_DDB1.rotation = evt.currentTarget.rotation;
_DDB1.transform.colorTransform = evt.currentTarget.transform.colorTransform
addChild(_DDB1);
_DDB1.startDrag(false);
_DDB1.addEventListener(MouseEvent.MOUSE_DOWN, dragDDB1);
stage.addEventListener(MouseEvent.MOUSE_UP, dropDDB1);
function dragDDB1(evt:MouseEvent){
evt.stopPropagation();
_DDB1 = evt.currentTarget as Sprite;
_DDB1.startDrag(false);
stage.addEventListener(MouseEvent.MOUSE_UP, dropDDB1);
function dropDDB1(e:MouseEvent):void {
_DDB1.stopDrag();
stage.removeEventListener(MouseEvent.MOUSE_UP,dropDDB1);
if (_DDB1.x>700 || _DDB1.x < 755 || _DDB1.y < 240 || _DDB1.y > 155) {
_DDB1.removeEventListener(MouseEvent.MOUSE_DOWN, dragDDB1);
_DDB1.parent.removeChild(_DDB1);
_DDB1 = null;Chances are that the problem lies in the following line:
if (_DDB1.x>700 || _DDB1.x < 755 || _DDB1.y < 240 || _DDB1.y > 155) {
That line essentially says if(the object is anywhere) due to using the OR ( || ) operator. If any one of those things is true then the condition is satisfied, which becxause they overlap will always be true for at least two of them. If that is supposed to be restricting the object to within an area you likely want to all of those conditions to be satsified. So in that case you need to use the AND operator ( && ). -
AS3 drag and drop masked bitmaps - not working
I have a drag and drop project using bitmaps that were masked using fireworks. All bitmaps are PNG (fireworks files) and one object is GIF. All objects were converted into movie clips.
PROBLEM
All movie clips from PNG's can be dragged, but they can't be dropped. However, the GIF movie clip responds to both drag and drop.
ActionScript worked when all movie clips had GIF's.
Is this problem because the objects were masked or for any other reason?
Note: Objects were masked because their border is very fussy and cropping them doesn't help with the quality of their image.
// ACTION SCRIPT
var startX:Number;
var startY:Number;
var counter:Number = 0;
name_mc1.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc1.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc2.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc2.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc3.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc3.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc4.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc4.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc5.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc5.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc6.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc6.addEventListener(MouseEvent.MOUSE_UP, placeDown);
name_mc7.addEventListener(MouseEvent.MOUSE_DOWN, placeUP);
name_mc7.addEventListener(MouseEvent.MOUSE_UP, placeDown);
function placeUP(event:MouseEvent):void {
event.target.startDrag(true);
mess_txt.text = "";
event.target.parent.addChild(event.target);
startX = event.target.x;
startY = event.target.y;
function placeDown(event:MouseEvent):void {
event.target.stopDrag();
var myTargetName:String = "target" + event.target.name;
var myTarget:DisplayObject = getChildByName(myTargetName);
if (event.target.dropTarget != null && event.target.dropTarget.parent == myTarget){
mess_txt.text = "Good Job!";
event.target.removeEventListener(MouseEvent.MOUSE_DOWN, placeUP);
event.target.removeEventListener(MouseEvent.MOUSE_UP, placeDown);
event.target.buttonMode = false;
event.target.x = myTarget.x;
event.target.y = myTarget.y;
counter++;
} else {
mess_txt.text = "Try Again!";
event.target.x = startX;
event.target.y = startY;
if(counter == 7){
mess_txt.text = "Congratulations, you're finished!";
name_mc1.buttonMode = true;
name_mc2.buttonMode = true;
name_mc3.buttonMode = true;
name_mc4.buttonMode = true;
name_mc5.buttonMode = true;
name_mc6.buttonMode = true;
name_mc7.buttonMode = true;
Thanks for any help!
GermanKglad:
Thanks. Your code worked as well.
German -
Drag and Drop Feature in Flash
I have multiple elements on my artboard that include the Drag and Drop feature allowing for the elements to be placed on top (overlapping) one another. When the third or fourth element is selected the previous element is forced behind its previous element. Is there anyway to keep the previously placed elements from repositioning, just keeping them stationery. Below is the code applied to the button instance which is inside of its respective movie clip.
on (press, dragOver) {
startDrag(_root.Element2);
on (release, rollOut, dragOut) {
stopDrag();
on (press, release, dragOver, dragOut) {
_root.x +=9;
_root.Element2.swapDepths(_root.x);Try...
Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag_2);
function fl_ClickToDrag_2(event:MouseEvent):void
Ring2.startDrag();
this.setChildIndex(Ring2, numChildren-1)
or...
Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag_2);
function fl_ClickToDrag_2(event:MouseEvent):void
Ring2.startDrag();
addChild(Ring2);
You do not have to write unique drag/drop functions for each ring. You can have a generic one that is shared by all...
Ring1.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag);
Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag);
Ring3.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag);
function fl_ClickToDrag(event:MouseEvent):void
MovieClip(event.currentTarget).startDrag();
addChild(MovieClip(event.currentTarget));
stage.addEventListener(MouseEvent.MOUSE_UP, dropRing);
function dropRing(evt:MouseEvent):void
stage.removeEventListener(MouseEvent.MOUSE_UP, dropRing);
stopDrag(); -
Problem Cursor disappears / Drag and Drop doesn't work
Hey everybody,
I have an urgent problem!
Three butterflies are supposed to be dragged in an object. My customized cursor is sort of a landing net to catch these butterflies.
For the cursor I have this code:
cursor_mc.startDrag("true");
Mouse.hide();
My drag and drop code is:
cursor_mc.addEventListener(MouseEvent.MOUSE_DOWN, startMove);
redbutterfly_mc.addEventListener(MouseEvent.MOUSE_DOWN, startMove);
violetbutterfly_mc.addEventListener(MouseEvent.MOUSE_DOWN, startMove);
yellowbutterfly_mc.addEventListener(MouseEvent.MOUSE_DOWN, startMove);
cursor_mc.addEventListener(MouseEvent.MOUSE_UP, stopMove);
redbutterfly_mc.addEventListener(MouseEvent.MOUSE_UP, stopMove);
violetbutterfly_mc.addEventListener(MouseEvent.MOUSE_UP, stopMove);
yellowbutterfly_mc.addEventListener(MouseEvent.MOUSE_UP, stopMove);
function startMove(evt:MouseEvent):void {
redbutterfly_mc.startDrag();
cursor_mc.startDrag();
violetbutterfly_mc.startDrag();
yellowbutterfly_mc.startDrag();
function stopMove(evt:MouseEvent):void {
redbutterfly_mc.stopDrag();
cursor_mc.stopDrag();
violetbutterfly_mc.stopDrag();
yellowbutterfly_mc.stopDrag();
But when I'm clicking on a butterfly my cursor stops to move and stays on the position of the butterfly, which i'm dragging. After dropping it, there is no cursor at all so one doesn't know where the mouse is currently located.
Does someone know why this doesn't work? I'm working currently with a mousefollower, because at the moment this is the only way it works..
The mousefollower code is:
addEventListener(Event.ENTER_FRAME, enterFrameHandler)
function enterFrameHandler(event:Event):void {
cursor_mc.x += cursor_mc.mouseX / 4;
cursor_mc.y += cursor_mc.mouseY / 4;
But now I have the problem that only the yellow butterfly moves even if I'm clicking on the red or the violet...
Please help me!! Thank you in anticipation!You've solved the problem, thank you very much!
Since it seems you know all about actionscript or at least all answers to my questions, I try my luck a further time
If I wanted to collect the caught butterflies in a certain target, for example a flowerpot, where the butterflies can't be removed after dragged in, is this more or less the code for it? I haven't tried it yet but I'm searching the internet for something like that and maybe it is the right thing? And is in this case "myTarget" the name of the picture which is used as the target? Thank you in advance!
function pickUp(event:MouseEvent):void {
event.target.startDrag(true);
event.target.parent.addChild(event.target);
startX = event.target.x;
startY = event.target.y;
function dropIt(event:MouseEvent):void {
event.target.stopDrag();
var myTargetName:String = "target" + event.target.name;
var myTarget:DisplayObject = getChildByName(myTargetName);
if (event.target.dropTarget != null && event.target.dropTarget.parent == myTarget){
event.target.removeEventListener(MouseEvent.MOUSE_DOWN, pickUp);
event.target.removeEventListener(MouseEvent.MOUSE_UP, dropIt);
event.target.buttonMode = false;
event.target.x = myTarget.x;
event.target.y = myTarget.y;
counter++; -
How to use the palette or drag and drop functions in netbean?
Is there anyone who can help me out on using drag and drop function in netbean to design GUI inteface..??
Is palette is the tool that can be used to drag and drop.??
thank you in advance.I actually really like the GUI builder in netbeans. I used to be a big eclipse user so I am very familiar with coding GUIs by hand, and most of what I do involves GUI's or at least swing.
At first I hated netbeans, I hated that I couldn't edit the code most. Then I decided to take a deep breath and really examine the issue. What I discovered is that most of the edits I wanted to make but couldn't really weren't the right way to be doing it in the first place, for the rest the code is actually really easy to change you just have to know how.
Now my palette is huge, probably about 250 objects in it organized into sections that work for me. Basically if I want a object to do something that is not already in the palette I simply write a new object and add it to the palette. I started small like with rounded buttons/progress bars, and as I got comfortable I now have some fairly advanced objects like grids, isometric grids, alpha composits, an animated hourglass countdown timer, and an animated "loading/activity" indicator that is not tied to a progress indicator.
The main reason I stuck with the netbeans drag and drop GUI builder is it's layout manager is really a very nice layout manager, you couldn't pay me enough to go back to eclipse or codeing GUIs by hand, as I can now do in one day what used to take me several weeks.
So what I am saying is stick with netbeans and the drag and drop, it sucks at first, but once you get to a point where you are comfortable with it and adding to the palette it will become a great tool.
JSG -
I'm creating a drag and drop game for grades K-2 and two of
my pieces stick to the mouse when clicked. I'm not sure what the
problem is as I've used the same code for all of my pieces.
The pants1_mc and the glasses_mc are the problems.I think the problem might also be that you are listening for
the Mouse Up on each of your draggable items. Instead you should
register just one listener on the stage so that if the pointer
isn't over your drag when you release it still will be able to
"dropIt".
My guess would be that the pants and the glasses are a shape
where when you stuck the pointer to the registration point (with
the true inside the startDrag) the pointer wasn't actually over a
pixel of the artwork. The other shapes weren't like that.
So removing the true might work for you here, but what if you
wanted the true? Or what if you were going to constrain the
dragging to a specific area and it was possible that the pointer
would move off the artwork. You would have this problem again.
So I would add to the pickUp function:
addEventListener(MouseEvent.MOUSE_UP,dropIt);
event.target.startDrag()
Then inside the dropIt function
removeEventListener(MouseEvent.MOUSE_UP,dropIt);
stopDrag();
Finally you won't need each of the individual dropIt
registrations in your main code.
Maybe you are looking for
-
Print Button on Drop-Down window
Hello, our internal customer wants to be able to print topics from a drop-down window. This worked well with "RoboHelp for Word" and WinHelp output, but I fail to add the same functionality in a "Robohelp for HTML" (R 7) project with HTML Help (CHM)
-
Can I set up storage in icloud for the entire family?
Can I set up storage in iCloud for the entire family under 1 account?
-
Okay so I dropped my iPhone 3G today and ever since it has been stuck on this white screen that has stripes on it. I have tried holding the home button with the up volume and the power button for a while and that didn't work. I also tried just the ho
-
Music library and Music.app problems
Hi, recently I've update to 5.0.1 from 4.1 (clean restore of an iPhone 4). I'm having issues with the music library of the iPhone. I have the "manually manage music" option selected so I can change information of the songs (like the title for example
-
My itunes library got erased for some reason after I either started Genious or burned a cd into my library, how do I transfer songs from my ipod back into the library so I can update my ipod without losing everything?