I'm new to AS3 and was wondering if there is anyone out there that can help me with this...
I'm creating a drag and drop Flash activity where there is 1 target and multiple draggable items. In my case I have 4 apples and I want to be able to put all apples into the same basket. I can get the draggable item into one target but i cannot get multiple draggable items into one single target...
Here is my code...
**************************************************************
import caurina.transitions.*;
//import flash.geom.Rectangle;
//var myBoundaries:Rectangle=new Rectangle(68.65,637.8,100,50);
circle1_mc.addEventListener(MouseEvent.MOUSE_DOWN, drag);
circle1_mc.addEventListener(MouseEvent.MOUSE_UP, drop);
function drag(event:MouseEvent):void {
//event.target.startDrag(true, myBoundaries);
event.target.startDrag();
}
function drop(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){
//trace("hit");
/*Remove the event listeners when a peg is correctly placed*/
event.target.removeEventListener(MouseEvent.MOUSE_DOWN, drag);
event.target.removeEventListener(MouseEvent.MOUSE_UP, drop);
event.target.buttonMode = false;
/*Adjust the peg’s position when it is correctly placed*/
event.target.x = myTarget.x;
event.target.y = myTarget.y;
/*add tween*/
Tweener.addTween(circle1_mc,{x:68.65,y:637.8,time:1,transition:"easeIn"});
} else {
//trace("try again");
/*add tween*/
Tweener.addTween(circle1_mc,{x:97.9,y:64.95,time:1,transition:"easeIn"});
}
}
circle1_mc.buttonMode = true;
**************************************************************
Hope to hear from you soon.
Perhaps wrapping the apples in to an appleContainer ( draggableItemContainer? ) then instead of dragging single apples you'll be able to focus on the appleContainer as your target?
Related
Hi I'm new to flash and as3 and have very basic knowledge with as3, I'm trying to create a simple drag and drop games, my goal the games need to be work as a stack layering objects like making a hamburger ( sorry I don't know how to say this but as below pictures )
My Timeline
My actions for frame 1
stop();
bantenbiakaon.addEventListener(MouseEvent.CLICK, bantenbiakaonquiz);
function bantenbiakaonquiz ( event:MouseEvent):void
{
gotoAndStop(2);
}
Actions at frame 2
stop();
import flash.events.MouseEvent;
import flash.display.DisplayObject;
var objectoriginalX:Number;
var objectoriginalY:Number;
sidi.buttonMode = true;
sidi.addEventListener(MouseEvent.MOUSE_DOWN, pickupObject);
sidi.addEventListener(MouseEvent.MOUSE_UP, dropObject);
function pickupObject(event:MouseEvent):void
{
event.target.startDrag();
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 matchingTarget:DisplayObject = 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;
gotoAndStop(3);
}
else
{
event.target.x = objectoriginalX;
event.target.y = objectoriginalY;
}
}
Actions at frame 3 will drag and drop to target and then open frame 4
Actions at frame 4 a Symbol MouseEvent gotoAndPlay(1); to frame 1
My problem when all object has been put into the target when the Symbol Button click back to frame 1, the object still appear. How actually to fix my problem.
Problem screenshot at frame 1
The drag and drop works, however, I have no idea how to create an if statement that goes to the next scene when all movieclips have been placed on the target.
I've tried placing the instance names in an if statement with the hittestobject however, no luck.
import flash.events.TouchEvent;
import flash.ui.Multitouch;
import flash.ui.MultitouchInputMode;
import flash.display.MovieClip;
/* Touch and Drag Event
Allows the object to be moved by holding and dragging the object.
*/
var objectoriginalX:Number;
var objectoriginalY:Number;
Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
var lemons:Array = [lemon1_mc, lemon2_mc, lemon3_mc, lemon4_mc, lemon5_mc];
for each(var lemonMC:MovieClip in lemons)
{
lemonMC.buttonMode = true;
lemonMC.addEventListener(TouchEvent.TOUCH_BEGIN, pickobject);
lemonMC.addEventListener(TouchEvent.TOUCH_END, dropobject);
lemonMC.startX = lemonMC.x;
lemonMC.startY = lemonMC.y;
}
var fl_DragBounds:Rectangle = new Rectangle(0, 0, stage.stageWidth, stage.stageHeight);
function pickobject(event:TouchEvent):void
{
event.target.startTouchDrag(event.touchPointID, false, fl_DragBounds);
event.target.parent.addChild(event.target);
objectoriginalX = event.target.x;
objectoriginalY = event.target.y;
}
function dropobject(event:TouchEvent):void
{
if(event.target.hitTestObject(target_mc)){
event.target.buttonMode = false;
event.target.x = target_mc.x;
event.target.y = target_mc.y;
event.target.visible = false;
} else {
event.target.x = event.target.startX;
event.target.y = event.target.startY;
event.target.buttonMode = true;
}
}
var melons:Array = [melon1_mc, melon2_mc, melon3_mc, melon4_mc, melon5_mc, melon6_mc, melon7_mc];
for each(var melonMC:MovieClip in melons)
{
melonMC.buttonMode = true;
melonMC.addEventListener(TouchEvent.TOUCH_BEGIN, pickobject2);
melonMC.addEventListener(TouchEvent.TOUCH_END, dropobject2);
melonMC.startX = melonMC.x;
melonMC.startY = melonMC.y;
}
var fl_DragBounds2:Rectangle = new Rectangle(0, 0, stage.stageWidth, stage.stageHeight);
function pickobject2(event:TouchEvent):void
{
event.target.startTouchDrag(event.touchPointID, false, fl_DragBounds2);
event.target.parent.addChild(event.target);
objectoriginalX = event.target.x;
objectoriginalY = event.target.y;
}
function dropobject2(event:TouchEvent):void
{
if(event.target.hitTestObject(target_null)){
event.target.buttonMode = false;
event.target.x = target_mc.x;
event.target.y = target_mc.y;
event.target.visible = false;
} else {
event.target.x = event.target.startX;
event.target.y = event.target.startY;
event.target.buttonMode = true;
}
}
How about adding a counter that is equal to number of objects to drag, then every time you drop object (and detect if it was on target) you decrements the counter and at the end of the function you check if it's 0?
An easy way to do this would be to remove your lemons/melons from their arrays when they pass the hit test. Then check if each array is empty and continue to the next scene should that be the case.
You can actually reduce redundant code and use the same function (dropobject) for both lemons and melons.
function dropobject(event:TouchEvent):void {
//Figure out which array this belongs to (is it a lemon or a melon)
var array:Array; //the array the dropped item belongs to
var hitMC:MovieClip; //the hit object for the lemon or melon
if(lemons.indexOf(event.currentTarget) > -1){ //if the lemon array contains the currentTarget
array = lemons;
hitMC = target_mc;
}else{
array = melons;
hitMC = target_null;
}
if(event.currentTarget.hitTestObject(hitMC)){
event.currentTarget.buttonMode = false;
event.currentTarget.x = hitMC.x;
event.currentTarget.y = hitMC.y;
event.currentTarget.visible = false;
//remove the item from it's array
array.removeAt(array.indexOf(event.currentTarget));
//check if there are any items left
if(lemons.length < 1 && melons.length < 1){
//both arrays are empty, so move on
play(); //or however you want to move on
}
}
}
Getting more advanced, a better way to do this would be to make a base class for your lemons, melons and anything else you want to drag in the future. Then you can add the dragging functionality into that base class and add properties for the hit target and an event for when it's hit it's target. This would give you one code base that can be easily applied to any library object.
I am doing a game for my computer science class and I am working on inventory, dragging an item into it. I do not know how to set the item as whatever the user clicked to drag.
At the moment I hard coded it to the item they are dragging, but in the future I want more items, so a variable set to the item they are dragging would make it work perfectly, but I don't know what it's called to do that.
Here is my code for inventory item dragging
function dragItem (event:MouseEvent):void
{
knife_loot.startDrag();
}
function dropItem (event:MouseEvent):void
{
knife_loot.stopDrag();
if ((knife_loot.hitTestObject(inv_game)) && (inv_game.visible == true))
{
trace("Item dropped in inventory")
trace("")
knife_loot.x = 80
knife_loot.y = 120
}
}
// end of dragging and dropping items
You can start with:
// List the items you want to drag.
var aList:Array = [knife_loot, spoon_loot, fork_loot];
// InteractiveObject is superclass for SimpleButton, Sprite and MovieClip.
// If you're sure what they all are then just use their class instead.
for each (var anItem:InteractiveObject in aList)
{
// Subscribe them all for dragging.
anItem.addEventListener(MouseEvent.MOUSE_DOWN, onDrag);
}
public var draggedItem:InteractiveObject;
function onDrag(e:MouseEvent):void
{
// Use e.currentTarget because original MouseEvent e.target
// could be something from deep inside of top object e.currentTarget.
draggedItem = e.currentTarget as InteractiveObject;
draggedItem.startDrag();
// Let's hook drop events.
stage.addEventListener(Event.MOUSE_LEAVE, onDrop);
stage.addEventListener(MouseEvent.MOUSE_UP, onDrop);
}
function onDrop(e:Event):void
{
// Unhook drop events.
stage.removeEventListener(Event.MOUSE_LEAVE, onDrop);
stage.removeEventListener(MouseEvent.MOUSE_UP, onDrop);
// Drop the item.
draggedItem.stopDrag();
if ((draggedItem.hitTestObject(inv_game)) && (inv_game.visible == true))
{
trace("Item", draggedItem.name, "was dropped to inventory.");
trace("");
draggedItem.x = 80;
draggedItem.y = 120;
}
// Forget the item.
draggedItem = null;
}
i want to make flash application that allowed users to match picture with the box containing its first letter of the word. the method is drag and drop with target. i'm really new to this.
drag and drop target is working so far but my problem is when i exit the frame after moving the object, the drag and drop object still visible.
how can i remove this object when leaving frame?
here is what i got:
import flash.events.MouseEvent;
import flash.display.DisplayObject;
var objectoriginalX:Number;
var objectoriginalY:Number;
a.buttonMode = true;
a.addEventListener(MouseEvent.MOUSE_DOWN, pickupObject);
a.addEventListener(MouseEvent.MOUSE_UP, dropObject);
function pickupObject(event:MouseEvent):void
{
event.target.startDrag();
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 matchingTarget:DisplayObject = 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;
}
else
{
event.target.x = objectoriginalX;
event.target.y = objectoriginalY;
}
}
thanks before, any suggestion will be appreciated
edited: this is the code i use to move to other scene
HOME1.addEventListener(MouseEvent.CLICK, fl_ClickToGoToScene_15);
function fl_ClickToGoToScene_15(event:MouseEvent):void
{
MovieClip(this.root).gotoAndStop(2, "Scene 1");
}
When through code you do something to a timeline object that causes the parentage to change, that timeline object will no longer be controlled by the timeline.
So when you do this:
event.target.parent.addChild(event.target);
(presumably to bring the item being dragged to the front), you are inadvertently telling Flash that this object is controlled by code now.
The solution, is to manually remove the object(s) by code when done with them. This can be done with removeChild(childObject).
Since you are likely dealing with multiple objects that can be dragged around, it would likely be easiest to just clear all children manually prior to going to the next frame:
removeChildren(); //remove all children of the current context (timeline)
nextFrame(); //go to the next frame, or play(); or whatever you want to do
If you are targeting an older version of flash (less than 11 doesn't support the removeChildren method), you can do this in it's place:
var i:int = numChildren;
while(i--){
removeChildAt(i);
}
Alternatively, if you don't desire to clear all children of the current timeline, you could just keep track of what's being dragged around and remove those object:
var draggedObjs:Array = [];
function pickupObject(event:MouseEvent):void
{
draggedObjs.push(event.target);
...rest of code
Then do this when ready to move on:
for each(obj in draggedObjs){
removeChild(obj);
}
draggedObjs = [];
nextFrame(); //or whatever
Another option, would be to duplicate the item clicked, add it to stage, then drag the duplicate and match the originals position to it on mouse move. When the drag is done, remove the duplicate from stage.
Hi I'm quite a new on flash and need some code. I have 3 MCs say MC1, MC2 and MC3. I will have 3 dedicated buttons that will pause the music of one MC and transfer the frame position to another MC and start playing. so say for example if MC2 is playing and I press the MC3 button I would like it to take the pause position of MC2 (not MC1) and continue playing from that frame on MC3 as well as switching the visuals from MC2 to MC3. it's a Multilingual app and all 3 MC's have the same frame length. in other words I would like to switch between languages.
Thanks in advance, any help would be great.
EDIT: up till now I have
mtlyrvult.stop();
itlyrvult.stop();
engvult.addEventListener(MouseEvent.CLICK, playMC1);
function playMC1(e:MouseEvent):void {
itlyrvult.stop();
enlyrvult.gotoAndPlay(itlyrvult.currentFrame);
itlyrvult.gotoAndStop(1); //frame one is empty
engvult.mouseEnabled = false;
itvult.mouseEnabled = true;
}
itvult.addEventListener(MouseEvent.CLICK, playMC2);
function playMC2(e:MouseEvent):void {
enlyrvult.stop();
itlyrvult.gotoAndPlay(enlyrvult.currentFrame);
enlyrvult.gotoAndStop(1); //frame one is empty
itvult.mouseEnabled = false;
engvult.mouseEnabled = true;
}
This switches from one language to another. Now my client gave me another language. mtlyrvult. And I don't know how AS3 will recognise which mc is playing to take the the pauseposition/currentframe from it.
I stick to your code (no class, method, members, addChild, ...). I didn't try the final draft with Flash or SDK.
I assume that you have:
3 MovieClip objects : enlyrvult, itlyrvult, mtlyrvult;
3 InteractiveObject (SimpleButton, MovieClip, ...) objects : engvult, itvult, mtvult;
and that enlyrvult is playing when we begin here (if not: enlyrvult.play(); or enlyrvult.stop();).
itlyrvult.stop(); // or itlyrvult.gotoAndStop(1);
mtlyrvult.stop(); // or mtlyrvult.gotoAndStop(1);
engvult.addEventListener(MouseEvent.CLICK, playMC1);
itvult.addEventListener(MouseEvent.CLICK, playMC2);
mtvult.addEventListener(MouseEvent.CLICK, playMC3);
// play enlyrvult
function playMC1(e:MouseEvent):void {
// stop them
itlyrvult.stop();
mtlyrvult.stop();
// play me
enlyrvult.gotoAndPlay(mtlyrvult.currentFrame);
// hide them
itlyrvult.gotoAndStop(1); //frame one is empty
mtlyrvult.gotoAndStop(1); //frame one is empty
// My trigger is out, theirs are fine
engvult.mouseEnabled = false;
itvult.mouseEnabled = true;
mtvult.mouseEnabled = true;
}
// play itlyrvult
function playMC2(e:MouseEvent):void {
// stop them
enlyrvult.stop();
mtlyrvult.stop();
// play me
itlyrvult.gotoAndPlay(enlyrvult.currentFrame);
// hide them
enlyrvult.gotoAndStop(1); //frame one is empty
mtlyrvult.gotoAndStop(1); //frame one is empty
// My trigger is out, theirs are fine
itvult.mouseEnabled = false;
engvult.mouseEnabled = true;
mtvult.mouseEnabled = true;
}
// play mtlyrvult
function playMC3(e:MouseEvent):void {
// stop them
enlyrvult.stop();
itlyrvult.stop();
// play me
mtlyrvult.gotoAndPlay(itlyrvult.currentFrame);
// hide them
enlyrvult.gotoAndStop(1); //frame one is empty
itlyrvult.gotoAndStop(1); //frame one is empty
// My trigger is out, theirs are fine
mtvult.mouseEnabled = false;
engvult.mouseEnabled = true;
itvult.mouseEnabled = true;
}
OR, for as much (300?) as you want...
// add to your import:
import flash.utils.Dictionary;
// in your const/var section
const STARTING_FRAME:int = 1;
var dict = new Dictionary(); // mapping and memory
var currentTrack:MovieClip; // we will know who's last
initAll();
playTrack(enlyrvult, STARTING_FRAME, engvult);
function clickHandler(e:MouseEvent):void {
var playheadFrame:int = currentTrack.currentFrame; // we remember position
var trigger:InteractiveObject = (e.currentTarget as InteractiveObject); // who shot me ?
var nextTrack:MovieClip = (dict[trigger] as MovieClip); // who's next ?
resetAll(); // and again.. (http://en.wikipedia.org/wiki/Sisyphus)
playTrack(nextTrack, playheadFrame, trigger);
}
function playTrack(mc:MovieClip, fram:int, iObj:InteractiveObject):void {
currentTrack = mc;
currentTrack.gotoAndPlay(fram);
iObj.mouseEnabled = false;
}
function resetAll():void {
for (var key:InteractiveObject in dict) { key.mouseEnabled = true; }
for each (var value:MovieClip in dict) { value.gotoAndStop(1); } // diff-> each
}
function initAll():void {
dict[engvult] = enlyrvult;
dict[itvult] = itlyrvult;
dict[mtvult] = mtlyrvult;
//dict[avult] = alyrvult; //<- new one like this: dict[trigger]=lyrMC; add as much as you can!
for (var key:InteractiveObject in dict) {
key.addEventListener(MouseEvent.CLICK, clickHandler);
}
resetAll();
}