将图像从面板拖放到画布后,如何使用flex4在画布中旋转删除的图像

时间:2011-05-25 13:05:48

标签: flex actionscript

这是3d旋转的代码

<s:Rotate3D id="rotate3DX"
                    target="{image}"
                    angleXFrom="0"
                    angleXTo="360"
                    duration="2000"
                    autoCenterTransform="true" />


    <s:Rotate3D id="rotate3DY"
                target="{image}"
                angleYFrom="0"
                angleYTo="360"
                duration="2000"
                autoCenterTransform="true" />

    <s:Rotate3D id="rotate3DZ"
                target="{image}"
                angleZFrom="0"
                angleZTo="360"
                duration="2000"
                autoCenterTransform="true" />

</fx:Declarations>

这是用于拖放的鳕鱼

private function mouseDownHandler(event:MouseEvent):void
            {
                var dragInitiator:Image=Image(event.currentTarget); 
                var ds:DragSource = new DragSource(); 
                ds.addData(dragInitiator, "img"); 
                DragManager.doDrag(dragInitiator, ds, event); 

            }

            private function dragEnterHandler(event:DragEvent):void
            {
                if (event.dragSource.hasFormat("img")) 
                    DragManager.acceptDragDrop(Canvas(event.currentTarget)); 

            }
            private function dropHandler(event:DragEvent):void {
                if (event.dragSource.hasFormat("img")) {
                    var draggedImage:Image = 
                        event.dragSource.dataForFormat('img') as Image;
                    var dropCanvas:Canvas = event.currentTarget as Canvas;

                    // Since this is a copy, create a new object to 
                    // add to the drop target.
                    var newImage:Image=new Image();
                    newImage.source = draggedImage.source;
                    newImage.x = dropCanvas.mouseX;
                    newImage.y = dropCanvas.mouseY;
                    newImage.height=200;
                    newImage.width=200;
                    newImage.addEventListener(MouseEvent.MOUSE_MOVE, mouseDownHandler);
                    newImage.addEventListener(DragEvent.DRAG_COMPLETE, dragCompleteHandler);
                    dropCanvas.addChild(newImage);
                    newImage.id=draggedImage.id;
                }
            }


            public function button1_clickHandler(event:MouseEvent):void
            {
                canvas1.graphics.clear();
            }
            private function dragCompleteHandler(event:DragEvent):void {
                var draggedImage:Image = 
                    event.dragInitiator as Image;
                var dragInitCanvas:Canvas = 
                    event.dragInitiator.parent as Canvas;

                if (event.action == DragManager.MOVE)
                    dragInitCanvas.removeChild(draggedImage);
            }          

图像是

<mx:Panel width="216" height="349" title="Parts" color="#010101"
                      cornerRadius="10">
                <mx:Image source="images\8.png" 
                          width="128" height="76" 
                          mouseMove="mouseDownHandler(event)"
                          id="image"


                         />
                <mx:Image source="images\10.jpg" 
                          width="110" height="87" 
                          mouseMove="mouseDownHandler(event)"/>
                <mx:Image source="images\9.jpg" 
                          width="111" height="88" 
                          mouseMove="mouseDownHandler(event)"/>
            </mx:Panel>

删除图像的画布是

        <mx:Canvas id="canvas1"
                   height="349" width="1080" 
                   backgroundColor="#BFBDBD"
                   cornerRadius="10"
                   borderColor="#000000"
                   borderVisible="true"
                   dropShadowVisible="true"
                   dragEnter="dragEnterHandler(event)"
                   dragDrop="dropHandler(event)"
                  >




            <mx:ControlBar width="100%" cornerRadius="0">
                <s:Button id="buttonX"
                          label="Rotate3D X-axis"
                          click="rotate3DX.play();" />
                <s:Button id="buttonY"
                          label="Rotate3D Y-axis"
                          click="rotate3DY.play();" />
                <s:Button id="bButtonZ"
                          label="Rotate3D Z-axis"
                          click="rotate3DZ.play();" />
            </mx:ControlBar>

        </mx:Canvas>

我希望在将图像放入画布后旋转图像。我能够在面板中旋转它们。

1 个答案:

答案 0 :(得分:0)

在这种情况下,您绑定效果的目标。简单地将ID从一个组件切换到另一个组件实际上不起作用。对原始图像的引用是实际绑定的内容。最好以编程方式在dropHandler方法中切换效果的目标。

// DON'T DO THIS
newImage.id=draggedImage.id;

// DO THIS
rotate3DY.target = newImage;
rotate3DZ.target = newImage;