konstantinbueschel
7/9/2011 - 6:12 PM

Drag and drop example for Titanium

Drag and drop example for Titanium

var circle = Titanium.UI.createView({
	height:200,
	width:200,
	borderRadius:50,
	backgroundColor:'#336699',
	top:10,
	left:50
});

currentWindow.add(circle);

// object to store last event position
var touchMoveBase = {
	set: function(point) {
		this.x = point.x;
		this.y = point.y;
	}
}
// circle position before it has been animated
var circlePosition = { top: circle.top, left: circle.left };

circle.addEventListener('touchstart', function(e) {
	Titanium.API.info('Touch start: ' + JSON.stringify(e));
	// get absolute position at start
	touchMoveBase.set(e.globalPoint);
});

circle.addEventListener('touchmove', function(e) {
	Titanium.API.info('Moving: ' + JSON.stringify(e));
	// update the co-ordinates based on movement since last movement or touch start
	circlePosition.top += e.globalPoint.y - touchMoveBase.y; 
	circlePosition.left += e.globalPoint.x - touchMoveBase.x;
	circle.animate({
		top: circlePosition.top, 
		left: circlePosition.left,
		duration: 1 
	});
	// reset absolute position to current position so next event will be relative to current position
	touchMoveBase.set(e.globalPoint);
});

circle.addEventListener('touchend', function(e) {
	Titanium.API.info('Stop drag: ' + JSON.stringify(e));
});