Gesture Detection Classes « cocos2d for iPhone

cocos2d for iPhone » Programming » physics

Gesture Detection Classes

(11 posts) (10 voices)

Started 2 years ago by Metric
Latest reply from obaidsaleem

Tags:

Metric
Member

Hey,

I have been messing around and have come up with different gesture methods all built into a class to share.

Here is the location the zip file you can grab: http://www.vantagetechnic.com/programming/iphone/Gestures.zip

Also, I have included a CGPointUtil.h which houses:

CGFloat distanceBetweenPoints (CGPoint first, CGPoint second);
CGFloat angleBetweenPoints(CGPoint first, CGPoint second);

typedef struct
{
	CGPoint point1;
	CGPoint point2;
} CGLine;

typedef struct
{
	CGPoint center;
	CGFloat radius;
} CGCircle;

typedef struct
{
	CGLine line1;
	CGLine line2;

	CGPoint center;
} CGX;

typedef struct
{
	CGPoint center;
	CGFloat width;
	CGFloat height;
} CGSquare;

CGCircle CGMakeCircle(CGPoint center, CGFloat radius);
CGX CGMakeX(CGLine line1, CGLine line2, CGPoint center);
CGLine CGMakeLine(CGPoint point1, CGPoint point2);
CGSquare CGMakeSquare(CGPoint center, CGFloat width, CGFloat height);

CGFloat angleBetweenLines(CGLine line1, CGLine line2);
CGFloat distanceBetweenLines(CGLine line1, CGLine line2);
BOOL CGCircleCollision(CGCircle circle1, CGCircle circle2);

The main class that you will want to import for all gestures is "Gestures.h"

In Gestures you will have access to Gestures.circle - for circle gesture, Gestures.X - an X like Gesture, and Gestures.square - square like Gesture. Also, the Gestures class itself has isSwipeLeft, isSwipeRight, isSwipeUp, and isSwipeDown. Along with that you will be using [Gestures startTouch:CGPoint], and [Gestures addPoint:CGPoint]. If you do use the Gestures startTouch and addPoint, then you will have access to the following two functions: [Gestures accelerationSpeedX] - the acceleration speed in X direction of the touch, and [Gestures accelerationSpeedY] - the acceleration speed in Y direction of the touch. Each of those functions uses the standard Acceleration = distance / (0.5 * time^2) formula.

Here are the headers for each file:

Gestures.h

#import <UIKit/UIKit.h>
#import "CGPointUtils.h"
#import "circleGesture.h"
#import "xGesture.h"
#import "squareGesture.h"

@interface Gestures : NSObject {
	circleGesture *circle;
	xGesture *X;
	squareGesture *square;

	NSMutableArray *points;

	CGPoint firstTouch;
	CGPoint lastTouch;

	NSTimeInterval firstTouchTime;
	NSTimeInterval lastTouchTime;
}

@property (nonatomic, retain) circleGesture *circle;
@property (nonatomic, retain) NSMutableArray *points;
@property (nonatomic, retain) xGesture *X;
@property (nonatomic, retain) squareGesture *square;

@property (readwrite) CGPoint firstTouch;
@property (readwrite) CGPoint lastTouch;

@property (readwrite) NSTimeInterval firstTouchTime;
@property (readwrite) NSTimeInterval lastTouchTime;

-(BOOL) isSwipeLeft:(int) tolerance;
-(BOOL) isSwipeRight:(int) tolerance;
-(BOOL) isSwipeUp:(int) tolerance;
-(BOOL) isSwipeDown:(int) tolerance;

-(void) addPoint:(CGPoint) point;

-(CGPoint) getLeft;
-(CGPoint) getRight;
-(CGPoint) getDown;
-(CGPoint) getUp;

-(CGFloat) accelerationSpeedX;
-(CGFloat) accelerationSpeedY;

@end

circleGesture.h

#import <UIKit/UIKit.h>
#import "CGPointUtils.h"

@interface circleGesture : NSObject {
	NSMutableArray *points;
	CGPoint firstTouch;
	NSTimeInterval firstTouchTime;

	float CircleClosureDistanceVariance;
	float MaximumCircleTime;
	float RadiusVariancePercent;
	float OverlapTolerance;
}

@property (nonatomic, retain) NSMutableArray *points;
@property (readwrite) CGPoint firstTouch;
@property (readwrite) NSTimeInterval firstTouchTime;

@property (readwrite) float CircleClosureDistanceVariance;
@property (readwrite) float MaximumCircleTime;
@property (readwrite) float RadiusVariancePercent;
@property (readwrite) float OverlapTolerance;

-(void) startCircle:(CGPoint) touch;
-(void) addPoint:(CGPoint)touch;
-(CGCircle) getCircle;
-(BOOL) isCompleteCircle:(CGPoint)touch;

@end

squareGesture.h

#import <UIKit/UIKit.h>
#import "CGPointUtils.h"

@interface squareGesture : NSObject {
	NSMutableArray *points;
	CGPoint firstTouch;
	CGPoint lastTouch;

	CGSquare gestureSquare;

	NSTimeInterval firstTouchTime;

	float SquareClosureTolerance;
	float timeTolerance;
	float straightnessTolerance;
	float squarenessTolerance;
}

@property (nonatomic, retain) NSMutableArray *points;

@property (readwrite) CGPoint firstTouch;
@property (readwrite) CGPoint lastTouch;
@property (readwrite) CGSquare gestureSquare;

@property (readwrite) NSTimeInterval firstTouchTime;
@property (readwrite) float SquareClosureTolerance;
@property (readwrite) float timeTolerance;
@property (readwrite) float straightnessTolerance;
@property (readwrite) float squarenessTolerance;

-(void) startSquare:(CGPoint) touch;
-(void) addPoint:(CGPoint)touch;
-(CGSquare) getSquare;
-(BOOL) isCompleteSquare;

@end

xGesture.h

#import <UIKit/UIKit.h>
#import "CGPointUtils.h"

@interface xGesture : NSObject {
	CGX gestureX;

	CGFloat centerTolerance;
	CGFloat timeTolerance;

	CGPoint firstTouch;
	CGPoint lastTouch;

	NSTimeInterval firstLineTime;
	NSTimeInterval secondLineTime;

	int count;

	CGLine line1;
	CGLine line2;
}

@property (readwrite) CGFloat centerTolerance;
@property (readwrite) CGFloat timeTolerance; 

@property (readwrite) CGPoint firstTouch;
@property (readwrite) CGPoint lastTouch;

@property (readwrite) int count;

@property (readwrite) NSTimeInterval firstLineTime;
@property (readwrite) NSTimeInterval secondLineTime;

@property (readwrite) CGX gestureX;
@property (readwrite) CGLine line1;
@property (readwrite) CGLine line2;

-(void) addLine:(CGLine) line;
-(void) startTouch:(CGPoint) point;
-(void) endTouch:(CGPoint) point;

-(BOOL) isX;

-(CGX) getX;
@end

Also here are examples on how to use each one:

Example of all the complex Gestures:

// Note this is assuming you have allocated the Gestures Class in gesture.
// self.gesture = [[Gestures alloc] init];

-(BOOL) ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {

	UITouch *touch = [touches anyObject];
	CGPoint point = [touch locationInView: [touch view]];
	CGPoint converted = [[Director sharedDirector] convertCoordinate:point];

	[self.gesture.circle startCircle:converted];
	[self.gesture.X startTouch:converted];
        [self.gesture.square startSquare:converted];

	return kEventHandled;
}

-(BOOL) ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint point = [touch locationInView: [touch view]];
	CGPoint converted = [[Director sharedDirector] convertCoordinate:point];

        [self.gesture.circle addPoint:converted];

        // This part of circle is only needed on move if you
        // wish to continue detecting the circle on move instead of
        // on release of touch
        /*if([self.gesture.circle isCompleteCircle:converted])
          {
                 // Do whatever here on complete circle
                 // Start a new circle so on move we can keep detecting
                 // Circles
		[self.gesture.circle startCircle:converted];
	  }

        // Reset the start of the circle if over a certain point count
        // keeps us from staying in an indefinite NO circle detection
        // on move only
	if([self.gesture.circle.points count] > 15)
	{
		[self.gesture.circle startCircle:converted];
	}*/

	[self.gesture.square addPoint:converted];
}

-(BOOL) ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
	UITouch *touch = [touches anyObject];
	CGPoint point = [touch locationInView: [touch view]];
	CGPoint converted = [[Director sharedDirector] convertCoordinate:point];

	[self.gesture.X endTouch:converted];
	if([self.gesture.X isX])
	{
            //Do whatever on successful X Gesture
	}

	if([self.gesture.square isCompleteSquare])
	{
             ///Do whatever on successful square gesture
        }
}

You may wish to play around with the following settings on the Circle Gesture:

self.gesture.circle.CircleClosureDistanceVariance = CGFloat;
	self.gesture.circle.MaximumCircleTime = float;
	self.gesture.circle.RadiusVariancePercent = float;
	self.gesture.circle.OverlapTolerance = float;

        //These are the default values for them:
        //CircleClosureDistanceVariance = 50.0;
	//MaximumCircleTime             = 2.0;
	//RadiusVariancePercent         = 25.0;
	//OverlapTolerance              = 3;

You may wish to play around with the following settings on the Square Gesture:

self.gesture.square.SquareClosureTolerance = float;
	self.gesture.square.timeTolerance = float;
	self.gesture.square.straightnessTolerance = float;
	self.gesture.square.squarenessTolerance = float;

        //These are the default values
        //The values of 80 for straightness and square seem to do
        //a good job of keeping it square without allowing a circle
        //but yet allowing a loose enough square shape to be detected
	//SquareClosureTolerance = 20;
	//timeTolerance = 20;
	//straightnessTolerance = 80;
	//squarenessTolerance = 80;

You may wish to play around with the following on X Gesture:

self.gesture.X.centerTolerance = CGFloat;
	self.gesture.X.timeTolerance = CGFloat;

        //These are the default values
        //centerTolerance = 8;
	//timeTolerance = 10;

I have tested each one of the complex gestures and they do work. I have not taken the time to fully test the isSwipe methods, but in theory they should work just fine.

One more note, if you have c++ files you only need to change the .m of these to .mm to be included with other c++ files properly.

Posted 2 years ago #

onedayitwillmake
Member

Amazing~!

Great work, i think ill start messing with this right away :)

Posted 2 years ago #
edisonslabs
Member

Wow, thanks a lot for sharing this. Gestures is something I always wanted to look into, but never had the time to.

Thanks a ton! Are you interested in creating it as an open source Google Project? Perhaps other people can improve on it or add features to it as well.

Anyhow thanks!

P.S. - I feel like the forum should have a dedicated section for people to share code. I see all these interesting code posts by users, but its so hard to find them later for a reference.

Posted 2 years ago #
Codemattic
Moderator

Thanks for contributing Metric - looks very useful!

Posted 2 years ago #
XyrisKenn
Member

Terrific and generous, thank you for sharing!

Posted 2 years ago #
slipster216
Moderator

Hey metric, a few comments:

This would be a nice thing to add to the extra's folder in cocos (where my joystick and proximity manager are stored). If riq's ok with it, would you mind contributing it there?

CGFloat distanceBetweenPoints (CGPoint first, CGPoint second);
CGFloat angleBetweenPoints(CGPoint first, CGPoint second);

These functions are already implemented in Cocos in CGPointExtension.h.

Posted 2 years ago #
Metric
Member

Yeah, slipster I don't mind at. If Riq is OK with it, feel free to add it to the extra's folder in development for cocos.

Hehe I didn't realize, that Riq or another developer had already implemented those two function in the CGPointExtension.h. I guess I should check next time ;P. If you don't mind you can remove them if you wish before putting them into the extras folder. Then just import the CGPointExtension.h into the files or just into the CGPointUtils.h

Edison, I already consider it open source. So anyone can take it and modify it at will, and improve on it. I am sure there are other gestures that could be implemented. I just felt that the X, square, Circle, swipes, and acceleration between two points would be the best things to start with.

Posted 2 years ago #
recobe
Member

thanks a lot metric
after i tested circle gesture i found a problem
i draw a square gesture and it was detected as circle (i didnt add square gesture detection to my game)
which property i should adjust to detect only circle ?

sry for some stupid question

Posted 2 years ago #
javy
Member
Thanks for submitting and sharing code - it's always welcome!

Haven't entirely read all the code above, however, I've read the implementation section. As a helpful critique, would it make it easier to have it track gestures like this:
```
// in ccTouchesBegan
[self.gesture startDetection:converted];

// in ccTouchesMoves
if([self.gesture isDetected:converted])
{
    // get the detected gesture (from gesture)
    // do something
    // then reset detection
}

// in ccTouchesEnded
// shouldn't be needed, because any complete gesture would have already been
// detected in touchesMoved, but added here anyway
{
    // get the detected gesture (from gesture)
    // do something
    // Do something then reset detection
}
```
In the init method or in gestures settings, a user could select which gestures they want to check for, e.g:
```
self.gestures.detectCircles = YES;
self.gestures.detectSquare = NO;
self.gestures.detectSwipeHorizontal = YES;
...
```
Perhaps all gesture detection modes should be NO by default, and the user must specify which ones will be checked for?

Might also be a good idea to use delegates instead of the above code. Just use callbacks to get informed when a gesture was detected.

Okay, I think I'll download the source and start messing with this!
Posted 2 years ago #
mamaoyot
Member

More Info iPhone Circle Gesture Detection
http://devicegadget.com/iphone/iphone-circle-gesture-detection/660/

Posted 11 months ago #
obaidsaleem
Member

Can anybody tell me how can i modify the CircleGesture class to recognize a half circle gesture?
I want to to detect when a user draws a half circle above or near my sprite then i want to make it jump.

Posted 4 months ago #

RSS feed for this topic

Reply

You must log in to post.