1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
| <?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" creationComplete="application1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.core.DragSource;
import mx.events.DragEvent;
import mx.events.FlexEvent;
import mx.managers.DragManager;
import spark.filters.DropShadowFilter;
private var _dragDownPt:Point;
private var _currentObjectDragging:Group;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
grpToDrop.addEventListener(DragEvent.DRAG_ENTER, onDragEnter);
grpToDrop.addEventListener(DragEvent.DRAG_DROP, onDragDrop);
}
private function onDragEnter(evt:DragEvent):void
{
// on accepte le drop sur le conteneur de drop
DragManager.acceptDragDrop(grpToDrop);
// on spécifie le type de drag & drop (ici une copie de l'objet)
DragManager.showFeedback( DragManager.COPY );
}
private function onDragDrop(evt:DragEvent):void
{
// lors du drop il ne s'agit a présent que d'ajouter l'élément droppé
// sur la cible et on peut vérifier le format des data transportées.
if( evt.dragSource.hasFormat( "item" ) )
{
var recupData:Object = evt.dragSource.dataForFormat("item");
// pour faire une vraie copy il aurait fallu cloner l'objet ...
var grp:Group = _currentObjectDragging;
grpToDrop.addElement(grp);
}
}
protected function group1_mouseDownHandler(event:MouseEvent):void
{
// on enregistre la point de départ
_dragDownPt = new Point(mouseX,mouseY);
// on enregistre l'objet en cour de dragging
if(event.target is Group)
_currentObjectDragging = event.target as Group;
else
_currentObjectDragging = (event.target as Label).parent as Group;
// puis on écoute l'éventuel déplacement de la souris
_currentObjectDragging.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMoveDuringDrag);
}
protected function group1_mouseUpHandler(event:MouseEvent):void
{
_currentObjectDragging.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMoveDuringDrag);
}
private function onMouseMoveDuringDrag(evt:MouseEvent):void
{
// astuce pour s'assurer que la souris a vraiment bouger volontairement
if(Math.abs(_dragDownPt.x - mouseX) <= 2 && Math.abs(_dragDownPt.y - mouseY) <= 2)
return;
// on ajoute un filtre d'ombre(facultatif évidement)
var _dragFilter:spark.filters.DropShadowFilter = new DropShadowFilter();
// on prépare les données qui seront transportées (optionnel si l'on souhaite l'utilisé ou pas)
var ds:DragSource = new DragSource();
ds.addData("data de tout type, Object, string , ... ","item");
// on lance le drag via le DragManager en lui passant l'UIcomponent cible, les données et l'événement
// souris qui a déclenché le drag & Drop(mouse down puis mouse move). Les autres paramêtre de la méthode
// doDrag permettent notamment d'ajouter une image pour le rendu lors du déplacement de l'objet
DragManager.doDrag(_currentObjectDragging,ds,evt);
_currentObjectDragging.filters = [_dragFilter];
return;
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Placer ici les éléments non visuels (services et objets de valeur, par exemple). -->
</fx:Declarations>
<s:HGroup width="100%" height="100%">
<s:VGroup width="100" height="100%" id="grpToDrag" top="10" left="10" bottom="10" gap="20">
<s:Group width="100" height="100" mouseDown="group1_mouseDownHandler(event)" mouseUp="group1_mouseUpHandler(event)">
<s:Rect width="100" height="100">
<s:fill>
<s:SolidColor color="#FF0000"/>
</s:fill>
</s:Rect>
<s:Label text="Drag me 1" horizontalCenter="0" verticalCenter="0"/>
</s:Group>
<s:Group width="100" height="100" mouseDown="group1_mouseDownHandler(event)" mouseUp="group1_mouseUpHandler(event)">
<s:Rect width="100" height="100">
<s:fill>
<s:SolidColor color="#0000FF"/>
</s:fill>
</s:Rect>
<s:Label text="Drag me 2" horizontalCenter="0" verticalCenter="0"/>
</s:Group>
<s:Group width="100" height="100" mouseDown="group1_mouseDownHandler(event)" mouseUp="group1_mouseUpHandler(event)">
<s:Rect width="100" height="100">
<s:fill>
<s:SolidColor color="#00FF00"/>
</s:fill>
</s:Rect>
<s:Label text="Drag me 3" horizontalCenter="0" verticalCenter="0"/>
</s:Group>
</s:VGroup>
<s:Group width="500" height="500" id="grpToDrop" >
<s:Rect width="500" height="500">
<s:fill>
<s:SolidColor color="#CDCDCD"/>
</s:fill>
</s:Rect>
<s:Label text="Drop here !!!" horizontalCenter="0" verticalCenter="0"/>
</s:Group>
</s:HGroup>
</s:Application> |
drag&drop de VGroup à Group
Répondre avec citation
Envoyé par gere34
, j'ai déjà du mal a comprendre comment il peut t'afficher ton backgroundcolor ...
Partager