Famo.us: get the new position of a draggable Surfa

问题:

After using drag and drop on a surface I want to get the exact new position of this Surface. How can I do that?

回答1:

You will be able to get the position from your Draggable modifier on end event draggable.on('end',function(e){var pos = e.position;})

Here is a link for the following code example:

var mainContext = Engine.createContext();

var transTransform = new TransitionableTransform();
transTransform.set(Transform.translate(100, 0, 0));

var surface = new Surface({
    size: [300, 100],
    properties: {
        backgroundColor: 'rgba(255,0,0,0.1)',
        cursor: 'pointer'
    }
});

var dragSurface = new Surface({
    content: 'Drag Me',
    size: [100, 100],
    properties: {
        backgroundColor: 'rgba(0,0,0,0.1)',
        cursor: 'pointer'
    }
});

var modifier = new Modifier({
    origin: [0, 0],
    align: [0, 0],
    transform: transTransform
});

var draggable = new Draggable();

draggable.subscribe(dragSurface);

var content = 'Not Draggable';
surface.setContent(content);

mainContext.add(modifier).add(surface);
mainContext.add(draggable).add(dragSurface);

draggable.on('update', function (e) {
    var pos = e.position;
    surface.setContent('Draggable Position is '+pos);
    transTransform.set(Transform.translate(pos[0]+100, pos[1], 0));
})

draggable.on('end', function (e) {
    var pos = e.position;
    surface.setContent('Draggable End Position is '+pos);
    transTransform.set(Transform.translate(pos[0]+100, pos[1], 0));
})

Note: Modifier.setTransform() has been deprecated.