CGAffineTransformMakeRotation goes the other way a

Question

So,

i am trying to do a very simple disc rotation (2d), according to the user touch on it, just like a DJ or something. It is working, but there is a problem, after certain amount of rotation, it starts going backwards, this amount is after 180 degrees or as i saw in while logging the angle, -3.14 (pi).

I was wondering, how can i achieve a infinite loop, i mean, the user can keep rotating and rotating to any side, just sliding his finger? Also a second question is, is there any way to speed up the rotation?

Here is my code right now:

#import <UIKit/UIKit.h>

@interface Draggable : UIImageView {
    CGPoint firstLoc;
    UILabel * fred;
    double angle;
}

@property (assign) CGPoint firstLoc;
@property (retain) UILabel * fred;

@end


@implementation Draggable

@synthesize fred, firstLoc;

- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];

    angle = 0;
    if (self) {
        // Initialization code
    }
    return self;
}
-(void)handleObject:(NSSet *)touches
          withEvent:(UIEvent *)event
             isLast:(BOOL)lst
{
    UITouch *touch =[[[event allTouches] allObjects] lastObject];
    CGPoint curLoc = [touch locationInView:self];

    float fromAngle = atan2( firstLoc.y-self.center.y,
                            firstLoc.x-self.center.x );
    float toAngle = atan2( curLoc.y-(self.center.y+10),
                          curLoc.x-(self.center.x+10));
    float newAngle = angle + (toAngle - fromAngle);

    NSLog(@"%f",newAngle);

    CGAffineTransform cgaRotate = CGAffineTransformMakeRotation(newAngle);

    self.transform = cgaRotate;

    if (lst)
        angle = newAngle;
}

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    UITouch *touch =[[[event allTouches] allObjects] lastObject];
    firstLoc = [touch locationInView:self];
};


-(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    [self handleObject:touches withEvent:event isLast:NO];
};

-(void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    [self handleObject:touches withEvent:event isLast:YES];
}

@end

And in the ViewController:

UIImage *tmpImage = [UIImage imageNamed:@"theDisc.png"];
CGRect cellRectangle;
    cellRectangle = CGRectMake(-1,self.view.frame.size.height,tmpImage.size.width ,tmpImage.size.height );
    dragger = [[Draggable alloc] initWithFrame:cellRectangle];
    [dragger setImage:tmpImage];
    [dragger setUserInteractionEnabled:YES];

    dragger.layer.anchorPoint = CGPointMake(.5,.5);

    [self.view addSubview:dragger];

I am open to new/cleaner/more correct ways of doing this too.

Thanks in advance.

Answer 1

Flip the angle if it's below -180 or above 180 degrees. Consider the following touchesMoved implementation:

@implementation RotateView

#define DEGREES_TO_RADIANS(angle) ((angle) / 180.0 * M_PI)

CGFloat angleBetweenLinesInDegrees(CGPoint beginLineA, CGPoint endLineA, CGPoint beginLineB, CGPoint endLineB)
{
    CGFloat a = endLineA.x - beginLineA.x;
    CGFloat b = endLineA.y - beginLineA.y;
    CGFloat c = endLineB.x - beginLineB.x;
    CGFloat d = endLineB.y - beginLineB.y;

    CGFloat atanA = atan2(a, b);
    CGFloat atanB = atan2(c, d);

    // convert radians to degrees
    return (atanA - atanB) * 180 / M_PI;
}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    CGPoint curPoint  = [[touches anyObject] locationInView:self];
    CGPoint prevPoint = [[touches anyObject] previousLocationInView:self];

    // calculate rotation angle between two points
    CGFloat angle = angleBetweenLinesInDegrees(self.center, prevPoint, self.center, curPoint);

    // Flip
    if (angle > 180) {
        angle -= 360;
    } else if (angle < -180) {
        angle += 360;
    }

    self.layer.transform = CATransform3DRotate(self.layer.transform, DEGREES_TO_RADIANS(angle), .0, .0, 1.0);
}

@end

When dragging around the outer bounds of the view, it will rotate it continuously like a spinning wheel. Hope it helps.

Answer 2

You have some problems here:

1-)

CGPoint curLoc = [touch locationInView:self];

and

firstLoc = [touch locationInView:self];

You are transforming your view, and then asking for the location of a touch in it. You cannot get the correct location of a touch in a rotated view. Make them something not transformed. (for example self.superview after putting it in a container)

2-)

cellRectangle = CGRectMake(-1,self.view.frame.size.height,tmpImage.size.width ,tmpImage.size.height );

You are placing your Draggable instance out of the screen by passing self.view.frame.size.height as the CGRect's y parameter.