Page tree
Skip to end of metadata
Go to start of metadata

This guide explains how to use Gestures in a project.

Swipe

Swipe gesture let's user to add the swipe gesture to the compatible objects which are labels, containers, dialogs, images, maps, pages, rectangles, repeatboxes, scrollviews, splashpages, template pages, tickers and webviews.

//swipe example
var rectangle1 = new SMF.UI.Rectangle({
		left : "10%",
		top : "10%",
		width : "50%",
		height : "10%",
		fillColor : "#FF00FF"
	});
page1.add(rectangle1);

 rectangle1.addGesture({
	id : "0",
	type : "swipe",
	direction : "left",
	requiredTouches : 1,
	callback : function (e) {
		alert("You swiped left" + e.id);
	}
});

Double Tap

The Double Tap gesture let's user to add the double tap gesture to the compatible objects which are labels, containers, dialogs, images , maps, pages, rectangles, repeatboxes, scrollviews, splashpages, template pages, tickers and webviews.

//doubleTap example
var rectangle1 = new SMF.UI.Rectangle({
			left : "10%",
        	top : "10%",
        	width : "50%",
        	height : "10%",
        	fillColor : "#FF00FF"
        });
page1.add(rectangle1);

 rectangle1.addGesture({
        id : "0",
        type : "tap",
        requiredTaps : 2,
        requiredTouches : 1,
        callback : function (e) {
              alert("You tapped " + e.id);
    }
});

onPinch

The onPinch gesture let's user to add the pinch gesture to the compatible objects  which are labels, containers, dialogs, images , maps, pages, rectangles, repeatboxes, scrollviews, splashpages, template pages, tickers and webviews.

//pinch example
var rectangle1 = new SMF.UI.Rectangle({
		left : "10%",
		top : "10%",
		width : "50%",
		height : "10%",
		fillColor : "#FF00FF"
	});
page1.add(rectangle1);
//e.scale : The scale factor relative to the points of the two touches in screen coordinates.
//e.velocity : The velocity of the pinch in scale factor per second.
rectangle1.addGesture({
	id : "0",
	type : "pinch",
	callback : function (e) {
		Label1.text = "scale: " + e.scale + " velocity: " + e.velocity;
	}
});