Hi Abdul, Thank you very much for sample code. It works nicely.
prasad > Hi, > > I have not used DragManager much, so can't help how to do this with > DragManager. But I can show you, how can you achieve the same with your > own logic: > > > <?xml version="1.0" encoding="utf-8"?> > <mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml"; > creationComplete="initApp()"> > > <mx:Script> > <![CDATA[ > > var bMouseDown:Boolean = false; > var objectBeingDragged:Object; > var origLocs:Object = {}; > var targets:Object = {}; > > > function initApp() > { > origLocs[dg] = {x:dg.x, y:dg.y}; //hard-coded object > reference, can be generalized > origLocs[dg1] = {x:dg1.x, y:dg1.y} //hard-coded object > reference, can be generalized > > targets[dg] = Canves1; //hard-coded object reference, can be > generalized > targets[dg1] = Canves1; //hard-coded object reference, can > be generalized > > cvs.setDepthAbove(Canves1); //Set the depth of Canvas(which > contains Grid) higher than the target Canvas > > > } > > function handleMouseDown(event) > { > bMouseDown = true; > objectBeingDragged = event.target; > } > > function handleMouseMoveSomewhere(event) > { > if(bMouseDown) > { > //start dragging the object, 'true' means that mouse > pointer is locked to top-left corner of object. > objectBeingDragged.startDrag(true); > > //force screen update > updateAfterEvent(); > } > } > > function handleMouseUpSomewhere(event) > { > if(bMouseDown) > { > //stop dragging.. > objectBeingDragged.stopDrag(); > bMouseDown = false; > > //get the center co-ords of object.. > var x = objectBeingDragged.x + > objectBeingDragged.width/2; > var y = objectBeingDragged.y + > objectBeingDragged.height/2; > > //get the target for this objects from hashmap > var target = targets[objectBeingDragged]; > > > //target's bound > var tx = target.x; > var ty = target.y; > var th = target.height; > var tw = target.width; > > > > //detect if x, y of object dropped falls in the bounds > of target > if ((x >= tx && x<= (tx + tw)) && (y >= ty && y<= (ty + > th))) > { > //create a imae in target container, and set the > source.. > target.createChild(mx.controls.Image,"", {source: > objectBeingDragged.source, autoLoad:true, width:32, height:32}); > objectBeingDragged.visible = false; > > } > > //restore the position of draggable once work is done, > you can hide it or remove it, depends on your requirement... > objectBeingDragged.x = origLocs[objectBeingDragged].x; > objectBeingDragged.y = origLocs[objectBeingDragged].y; > > objectBeingDragged = null; > > } > } > > ]]> > </mx:Script> > > <mx:Panel width="100%" height="100%" title="panel1"> > <mx:Canvas width="100%" height="100%"> > <mx:Canvas id="cvs" x="3" y="2" width="100%" height="50" > backgroundColor="#B9C6F9"> > <mx:Grid x="1" y="1" id="grid" > > <mx:GridRow> > <mx:GridItem> > <mx:GridItem> > <mx:Image source="jo2.jpg" width="32" > height="32" id="dg" mouseDown="handleMouseDown(event)" > mouseMoveSomewhere="handleMouseMoveSomewhere(event)" > mouseUpSomewhere="handleMouseUpSomewhere(event)" /> > </mx:GridItem> > <mx:GridItem> > <mx:Image source="jo3.jpg" width="32" > height="32" id="dg1" mouseDown="handleMouseDown(event)" > mouseMoveSomewhere="handleMouseMoveSomewhere(event)" > mouseUpSomewhere="handleMouseUpSomewhere(event)"/> > </mx:GridItem> > </mx:GridItem> > </mx:GridRow> > </mx:Grid> > </mx:Canvas> > > <!-- Drop Target --> > <mx:Canvas id="Canves1" x="4" y="65" width="100%" height="225" > backgroundColor="#DEE0FE" vScrollPolicy="auto" visible="true"> > </mx:Canvas> > </mx:Canvas> > </mx:Panel> > </mx:Application> > > > Hope that helps.. > > -abdul > -----Original Message----- > From: [email protected] [mailto:[EMAIL PROTECTED] On > Behalf Of Prasad Dhananjaya > Sent: Tuesday, September 06, 2005 12:40 PM > To: FlexML > Subject: [flexcoders] Drag and drop among components > > Hi all, > > I want to drag a image from "GridItem" and drop it on "Canvas" > (Just drag & drop).With referring "flex samples(Drag&drop-->Custom > class example)" I wrote below code. But it is not working. > This is my first drag&drop(among components) code and I am not > sure what's wrong. > > Can someone help... > > Thanks, > Prasad > > --------------------------------------------------------------------- > <?xml version="1.0" encoding="utf-8"?> > <mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml";> > > <mx:Script> > <![CDATA[ > function beginDrag1() { > var ds = new mx.core.DragSource(); > mx.managers.DragManager.doDrag(this, ds,"Canves1"); > } > > function doDragEnter1(event) { > event.handled="true"; > } > > function doDragExit1(event) { > event.target.hideDropFeedback(); > } > > function doDragOver1(event) { > event.target.showDropFeedback(); > } > > function doDragDrop1(event) { > doDragExit1(event); > } > ]]> > </mx:Script> > > <mx:Panel width="100%" height="100%" title="panel1"> > <mx:Canvas width="100%" height="100%"> > <mx:Canvas x="3" y="2" width="100%" height="50" > backgroundColor="#B9C6F9"> > <mx:Grid x="1" y="1" > > <mx:GridRow> > <mx:GridItem> > <mx:GridItem> > <mx:Image source="jo2.jpg" width="32" > height="32" id="dg" mouseMove="beginDrag1()"/> > </mx:GridItem> > <mx:GridItem> > <mx:Image source="jo3.jpg" width="32" > height="32" id="dg1" mouseMove="beginDrag1()"/> > </mx:GridItem> > </mx:GridItem> > </mx:GridRow> > </mx:Grid> > </mx:Canvas> > > <!-- Drop Target --> > <mx:Canvas id="Canves1" x="4" y="65" width="100%" height="225" > dragEnter="doDragEnter1(event)" > dragExit="doDragExit1(event)" dragDrop="doDragDrop1(event)" > dragOver="doDragOver1(event)" backgroundColor="#DEE0FE" > vScrollPolicy="auto" visible="true"> > </mx:Canvas> > </mx:Canvas> > </mx:Panel> > </mx:Application> > --------------------------------------------------------------------- > > > > > -- > Flexcoders Mailing List > FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt > Search Archives: > http://www.mail-archive.com/flexcoders%40yahoogroups.com > Yahoo! Groups Links > > > > > > > > > > > -- > Flexcoders Mailing List > FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt > Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com > Yahoo! Groups Links > > > > > ------------------------ Yahoo! Groups Sponsor --------------------~--> Fair play? Video games influencing politics. Click and talk back! http://us.click.yahoo.com/T8sf5C/tzNLAA/TtwFAA/nhFolB/TM --------------------------------------------------------------------~-> -- Flexcoders Mailing List FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/flexcoders/ <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
