拖放自定义标题边框盒Flex 4点中的问题

希望有人柔性经验将能够给出的建议是：拖放自定义标题边框盒Flex 4点中的问题

所以我有一个定制标题边框容器小的Flex 4应用程序，我想能够将它们拖放到容器之间，但是... d &处理flex组件时，d很简单，但此自定义标题容器由几个部分组成，例如：label，border container ...我尝试拖放标题容器，然后我不能抓住整个标题容器，但只是其中一个部分（标签或边框），当我放弃然后flex引发错误，该元素不在同一组。

我知道这可能不是对问题最简单的解释，但也许有人已经遇到过这个问题，或者有了一些这方面的经验，任何帮助表示赞赏。

嗨，我已经编辑我的问题，以提供更好的理解这个问题，所以我有自定义标题容器的像这样的布局：

----Group A -------------------------------- 
|           | 
| --- Sub Group A -------------------- | 
| |         | | 
| | --- Item A1 -- --Item A2--- | | 
| | |   |  |   | | | 
| | |   |  |   | | | 
| | |------------- ------------ | | 
| |         | | 
| |----------------------------------- | 
|           | 
|------------------------------------------- 

----Group B -------------------------------- 
|           | 
| --- Sub Group B -------------------- | 
| |         | | 
| | --- Item B1 -- --Item B2--- | | 
| | |   |  |   | | | 
| | |   |  |   | | | 
| | |------------- ------------ | | 
| |         | | 
| |----------------------------------- | 
|           | 
|-------------------------------------------

II希望能够交换集团A组和B组（也就是A组和B组子女）（子组A & B）必须可以互换，最后子组A & B的子女也必须可交换。现在我已经设法让子组的子组交换能力，并且子组也可以彼此交换，但是... 有时，当我将子组A与子组B交换时，子组G在子组内部B.这是一个工作的进展情况和我张贴与我建立了可运行的代码，但不包括TitledContainer，如果你需要这个组件让我知道：

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:titledContainer="titledContainer.*" 
       > 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import mx.core.DragSource; 
      import mx.core.IUIComponent; 
      import mx.core.IVisualElement; 
      import mx.events.DragEvent; 
      import mx.managers.DragManager; 

      import spark.components.SkinnableContainer;   


      //------------------------------------------------------------------- 
      // ITEM BOXES DRAG FUNCTIONS 
      //-------------------------------------------------------------------- 

      private function handleStartDrag(evt:MouseEvent):void 
      { 
       // grab the item renderer and relevant data 
       var dragItem:IUIComponent = evt.target as IUIComponent; 
       var dragSource:DragSource = new DragSource(); 
       dragSource.addData(dragItem, "item"); 
       DragManager.doDrag(dragItem, dragSource, evt); 

      } 

      protected function handleDragEnter(evt:DragEvent):void 
      { 
       if(evt.dragSource.hasFormat("item")) 
        DragManager.acceptDragDrop(evt.target as IUIComponent); 

      } 

      protected function handleDragDrop(evt:DragEvent):void 
      { 
       var dragItem:Object = evt.dragSource.dataForFormat("item"); 
       var dragItemOwner:SkinnableContainer = (dragItem.owner as 
        SkinnableContainer); 
       dragItemOwner.removeElement(dragItem as IVisualElement); 
       var targetOwner:SkinnableContainer = (evt.target as 
        SkinnableContainer); 
       targetOwner.addElement(dragItem as IVisualElement); 
      } 

      //------------------------------------------------------------------- 
      // SUB GROUPS CONTAINERS DRAG FUNCTIONS 
      //-------------------------------------------------------------------- 


      private function handleStartDragSub(evt:MouseEvent):void 
      { 
       // grab the item renderer and relevant data 
       var dragItem:IUIComponent = evt.target as IUIComponent; 
       var dragSource:DragSource = new DragSource(); 
       dragSource.addData(dragItem, "item"); 
       DragManager.doDrag(dragItem, dragSource, evt); 

      } 

      protected function handleDragEnterSub(evt:DragEvent):void 
      { 
       if(evt.dragSource.hasFormat("item")) 
        DragManager.acceptDragDrop(evt.target as IUIComponent); 

      } 

      protected function handleDragDropSub(evt:DragEvent):void 
      { 
       var dragItem:Object = evt.dragSource.dataForFormat("item"); 
       var dragItemOwner:SkinnableContainer = (dragItem.owner as 
        SkinnableContainer); 
       dragItemOwner.removeElement(dragItem as IVisualElement); 
       var targetOwner:SkinnableContainer = (evt.target as 
        SkinnableContainer); 
       targetOwner.addElement(dragItem as IVisualElement); 
      } 

     ]]> 
    </fx:Script> 

    <!-- MAIN CONTAINER ~~~~~~~~~~~~~~~~~~~~~~--> 
    <s:SkinnableContainer x="50" y="50" width="100%" height="100%" > 
     <s:layout> 
      <s:VerticalLayout /> 
     </s:layout> 


     <!-- FIRST ROW ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~--> 

     <s:SkinnableContainer width="100%" > 
      <s:layout> 
       <s:HorizontalLayout /> 
      </s:layout> 

      <!-- First Group --> 
      <titledContainer:TitledContainer label="Group A" width="50%" dragEnter="handleDragEnterSub(event)" dragDrop="handleDragDropSub(event)"> 
       <titledContainer:layout> 
        <s:VerticalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
       </titledContainer:layout> 

       <s:Group width="100%" mouseDown="handleStartDragSub(event);" > 
        <s:layout> 
         <s:HorizontalLayout /> 
        </s:layout> 

        <titledContainer:TitledContainer label="Sub Group A" width="500" dragEnter="handleDragEnter(event)" dragDrop="handleDragDrop(event)"> 
         <titledContainer:layout> 
          <s:HorizontalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
         </titledContainer:layout> 

         <s:Group mouseDown="handleStartDrag(event);"> 

          <titledContainer:TitledContainer label="Item A 1" > 
           <titledContainer:layout> 
            <s:VerticalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
           </titledContainer:layout> 
          </titledContainer:TitledContainer> 

         </s:Group> <!-- Item 1 end--> 

         <s:Group mouseDown="handleStartDrag(event);"> 

          <titledContainer:TitledContainer label="Item A 2" > 
           <titledContainer:layout> 
            <s:VerticalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
           </titledContainer:layout> 
          </titledContainer:TitledContainer> 

         </s:Group> <!-- Item 2 end--> 

        </titledContainer:TitledContainer><!-- Front cover 2 end--> 

       </s:Group> 

       <s:Group width="100%" mouseDown="handleStartDragSub(event);" > 
        <s:layout> 
         <s:HorizontalLayout /> 
        </s:layout> 

        <titledContainer:TitledContainer label="Sub Group B" width="500" dragEnter="handleDragEnter(event)" dragDrop="handleDragDrop(event)"> 
         <titledContainer:layout> 
          <s:HorizontalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
         </titledContainer:layout> 

         <s:Group mouseDown="handleStartDrag(event);"> 

          <titledContainer:TitledContainer label="Item B3" > 
           <titledContainer:layout> 
            <s:VerticalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
           </titledContainer:layout> 
          </titledContainer:TitledContainer> 

         </s:Group> <!-- Item 3 end--> 

         <s:Group mouseDown="handleStartDrag(event);"> 

          <titledContainer:TitledContainer label="Item B4" > 
           <titledContainer:layout> 
            <s:VerticalLayout paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" gap="10"/> 
           </titledContainer:layout> 
          </titledContainer:TitledContainer> 

         </s:Group> <!-- Item 4 end--> 

        </titledContainer:TitledContainer><!-- Front cover 3 end--> 



       </s:Group> 

      </titledContainer:TitledContainer><!-- Front cover 1 end--> 

     </s:SkinnableContainer> <!-- first row end--> 


    </s:SkinnableContainer> 

</s:Application>

请注意，我是一个Flex和AS3初学者所以请对我温柔，

的问题是：

能够交换组，子组和项目相互（保持层次结构），并禁止错位置，即：分A组，小组B组等内部
当单击自定义标题容器用户应该能够拖动整个组件，而不是标题，或边框容器或其他标题容器内部的内容。

请温柔的初学者，我不要求你写的代码为我，而是指导如何做正确，但代码样本的欢迎，谢谢大家。

来源

2013-04-26 Kugarek

您希望能够在容器之间拖放** WHAT **？ Flex会抛出什么错误？你能分享一些代码吗？也许是一个可运行的样本。 – JeffryHouser 2013-04-26 15:27:54

嗨，我已经更新了这个问题，所以现在它更容易理解，请你看看，并可能帮助我一下，谢谢。 – Kugarek 2013-04-29 11:39:55

正确显示对象问题

传递父定制容器的startDrag代替其元素。要做到这一点，你必须像往常一样检测拖动

MOUSE_DOWN, MOUSE_MOVE,

事件。

我想你这样做了，不过，下面的例子可能是你写

e.target.startDrag(false, new Rectangle(bla, bla));

而不是写

myCustomContainer.startDrag(false, new Rectangle(bla,bla));

对于这样做的有两个先决条件：

1）找到如果鼠标在子控件上跳舞，则正在拖动的正确容器。这可能相对容易，如果你的控件是直接的displayObject后裔，在显示列表父树上移动，只需检查容器类就足够了。用于检测母体一个非常基本的代码的例子是这样的：

public function detectMyContainer(t: DisplayObject){ 

while((t)&&(t !== root)){ 
    if(t is YourCustomContainer){ 
     return(t); 
    }  
    t = DisplayObject(t).parent; 
} 
return(null); 
}

2）不应该阻止鼠标按下和鼠标移动事件传播在所述容器的子控件，因为这将使容器聋...

现在，这将部分解决您的问题，意味着到目前为止您正在设法找到正确的父母并移动它，而不是子控件。

正确的组问题

当你开始拖动一个DisplayObject，你应该放弃它，以相同的父。

如果不是这样，因为你已经看到，AS3会骂你......

如果你想在不同的家长移动显示对象，你应该重写这个行为，你必须跟着我将伪步骤下面的代码：

首先你应该包含不同的父母，你将整个移动孩子的你最终的父级DisplayObjectContainer决定的，通常这是阶段，但我们将其称之为舞台。

让我们打电话给被拖动的对象拖动（是的，我在这个小时缺乏创造力）:)。

1）正确检测拖动。

look detectMyContainer.

）网友的拖坐标阶段。

use localToGlobal.

3）如果竞技场是不阶段的坐标映射到竞技场。

use globalToLocal

4）拆下拖动从其父并添加到竞技场。

use arena.addChild(drag)

5）将drag.x和drag.y设置为舞台映射坐标。现在你有一个更深的父母一样的地方拖...

6）开始阻力

7）听MOUSE_UP开始拖动

use drag.startDrag(...)

8）当鼠标上升，看拖的下降目标...现在有

first stopDrag()

9）检测的DropTarget的approp相反，它可能不是你猜到的，所以看看它的班级和家长等，以确定是否有一个有效的和哪个。 10）如果dropTarget不存在，则添加将拖回到原始父级，并设置其原始坐标...（当你习惯了事情，你会补间动画，我打赌）。

11）现在拖的 COORDS映射舞台DropTarget的

if arena is not stage make a localToGlobal for drag in arena make a globalToLocal for drag global to dropTarget local

12）从舞台删除阻力并添加到其新的父的DropTarget。

use dropTarget.addChild(drag)

13）将drag.x和drag.y设置为dropTarget映射坐标。

这就是所有，这是当你的代码这个短，不要害怕......

我祝你好运。

来源

2013-04-26 20:56:08 Ihsan

嗨Ihsan，谢谢你的回答，我相信它提供了解决这个问题的办法，我会跟着你指导和回报，谢谢 – Kugarek 2013-04-29 08:40:08

拖放自定义标题边框盒Flex 4点中的问题

回答

相关问题