13 Oct
2014
13 Oct
'14
4:22 p.m.
Hi Peter and Gustavo!
Having a nice support for drag and drop is difficult. The idea is to go step by step. I
have introduced a new interaction, called RTDragAndDroppable. You simply need to specify
the host element, and the action you want to perform when you drag and drop.
You can run the following example after updating Roassal.
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
v := RTView new.
e1 := (RTBox new size: 10; color: Color gray) element.
e2 := (RTEllipse new size: 30; color: Color blue) element.
e1 @ RTDraggable.
e1 translateTo: 50 @ 50.
v add: e1.
v add: e2.
e2 @ (RTDragAndDroppable new
host: e1;
do: [ :fromElement :toElement |
| newElement alreadyNested |
newElement := (RTBox new size: 20) element.
v add: newElement.
alreadyNested := toElement nestedElements.
toElement unbindNestedElements.
RTNest new
layout: RTGridLayout new;
on: toElement nest: alreadyNested, (Array with: newElement) ]).
v
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
I will work today a bit more on hilighting the receiving element. This is easy to do.
Cheers,
Alexandre
On Oct 12, 2014, at 8:02 PM, Peter Uhnák <i.uhnak(a)gmail.com> wrote:
Hi,
Currently I don't see any way how to tell an element that another one has been
dropped onto him. For example if I want to drag an element into a container (see example
at the end).
Unfortunately in my solution i had to change the behaviour of Trachel (RTMorph), so could
this be in some (better) way incorporated into Roassal (Trachel)?
My solution is making a subclass
-------------------------------------
TRAbstractMouseEvent subclass: #TRMouseDragDrop
-------------------------------------
And altering mouseDragEnd
-------------------------------------
RTMorph>>rtMouseDragEnd: evt
| ee dropEvent dropShape relativePosition |
"notify the dragged element"
ee := TRMouseDragEnd new.
ee shape: shapeBeingPointed.
ee canvas: trachelCanvas.
ee morph: self.
shapeBeingPointed announce: ee.
"notify the element onto which was the drag performed"
shapeBeingPointed = trachelCanvas
ifFalse: [
shapeBeingPointed element attributes
at: #rtDroppable
ifPresent: [
relativePosition := self relativePositionFor: evt.
dropShape := self shapeWithAction: TRMouseDragDrop forPositionInPixels:
relativePosition.
dropShape = shapeBeingPointed
ifFalse: [
dropEvent := TRMouseDragDrop new
shape: shapeBeingPointed;
canvas: trachelCanvas;
morph: self.
dropShape announce: dropEvent ] ] ].
eventBeginingDragging := nil.
shapeBeingPointed := nil
-------------------------------------
Example (use case) is:
-------------------------------------
view := RTView new.
container := RTBox new size: 200; color: Color white; borderColor: Color black; element.
group := RTGroup new.
RTNest new on: container nest: group.
container trachelShape size: 200.
box := RTBox new size: 50; color: Color magenta; element.
box translateTo: 250 @ 0.
container @ RTDraggable.
container @ RTResizeable.
box @ RTDraggable.
box attributes at: #rtDroppable put: true.
container
when: TRMouseDragDrop
do: [ :event |
| el |
el := event shape element.
el attributes at: #container ifPresent: [
group remove: el.
].
group add: el.
el attributes at: #container put: group.
].
view canvas
when: TRMouseDragDrop
do: [ :event |
| el |
el := event shape element.
el attributes at: #container ifPresent: [ :parent |
parent remove: el.
el attributes removeKey: #container.
].
].
view
add: container;
add: box.
view open.
-------------------------------------
Also it would be nice to have an option to highlight the drop area. There is
TRMouseEnter/TRMouseLeave but it fires only for the top level shape, perhaps it should for
all? Or less invasive to add TRMouseDragEnter/TRMouseDragLeave which would work like
regular Enter/Leave but on the next (on z-axis) shape.
Please let me know what you think.
Peter
_______________________________________________
Moose-dev mailing list
Moose-dev(a)iam.unibe.ch
https://www.iam.unibe.ch/mailman/listinfo/moose-dev
--
_,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:
Alexandre Bergel http://www.bergel.eu
^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;._,.;:~^~:;.