フレックス経験のある誰かがそれについてアドバイスできることを願っています：
だから私はカスタムのタイトル付きボーダーコンテナを持つ小さなフレックス4アプリケーションを持っています.コンテナ間でそれらをドラッグアンドドロップできるようにしたいのですが...フレックスコンポーネントを扱うときはd&dは簡単ですが、このカスタムタイトル付きコンテナはラベル、ボーダー コンテナーなどのいくつかのパーツなので、そのタイトル付きコンテナーをドラッグ アンド ドロップしようとすると、タイトル付きコンテナー全体を取得することはできませんが、その一部 (ラベルまたはボーダー ボックス) の 1 つだけを取得できます。 drop then 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 と交換すると、サブグループ A がサブグループ 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の初心者なので、お手柔らかにお願いします。
問題は次のとおりです。
グループ、サブグループ、およびアイテムを相互に交換し (階層を維持)、間違った配置を禁止することができます。つまり、サブグループ B 内のサブグループ A などです。
カスタムのタイトル付きコンテナーをクリックすると、ユーザーは、タイトルではなく、コンポーネント全体、またはボーダー コンテナー、またはタイトル付きコンテナー内にあるものすべてをドラッグできる必要があります。
初心者には優しくしてください。コードを書いてくださいと言っているのではなく、適切に行う方法のガイダンスですが、コード サンプルは大歓迎です。ありがとうございました。