Advertise here




Advertise here

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In with Google Sign In with OpenID

Rotate Knob Image by touch

HoofSCHoofSC Posts: 41Registered Users
edited August 2008 in iPhone SDK Development
Hi,

Banging my head against a wall here. I think I'm missing something elementary.

Here is what I would like to accomplish:

1. Display a UIImageView with a graphic of a volume knob.
2. Detect swipeRight/swipeLeft gesture.
3. Rotate the image in radians + or - based on the direction of the swipe.

Eventually I would like to be able to "scale" the rotation based on the distance of the swipe, but for now, I'm just trying to get a basic working model.

Here's the problem:

I can do all 3 steps, however I am using a CGAffineTransformMakeRotation(radians)

If I swipe in the opposite direction, it treats the original "zero angle" AS 0 radians, whereas I need to 'reset' the zero angle after the first animation.

Any thoughts? Is it just simple logic I'm missing??
-(void)processSwipeRight:(NSSet*)touches withEvent:event {
	float singleTurnRadians = 36 * 3.14157 / 180;

	[UIView beginAnimations:nil context:NULL];
	[UIView setAnimationDuration:.5];
	CGAffineTransform transform = CGAffineTransformMakeRotation(singleTurnRadians);
	knobImageView.transform = transform;
	[UIView commitAnimations];
	notch += 1;	
}
-(void)processSwipeLeft:(NSSet*)touches withEvent:event {
	float singleTurnRadians = 36 * 3.14157 / 180;
	
	[UIView beginAnimations:nil context:NULL];
	[UIView setAnimationDuration:.5];
	CGAffineTransform transform = CGAffineTransformMakeRotation(-singleTurnRadians);
	knobImageView.transform = transform;
	[UIView commitAnimations];
        notch -= 1;	
	
}



Thanks in advance.
Post edited by HoofSC on

Replies

  • scottiphonescottiphone Posts: 802Registered Users
    edited August 2008
    Make it relative to where it is now. Get value at the start of the method (or save it from before) and offset to relative to that.
  • HoofSCHoofSC Posts: 41Registered Users
    edited August 2008
    Make it relative to where it is now. Get value at the start of the method (or save it from before) and offset to relative to that.

    Thanks Scott

    Any suggestion on how to do that exactly? I've tried a number of things including:
    /*above -- turnRadians = 0.0*/
    
    -(void)processSwipeRight:(NSSet*)touches withEvent:event {
    	float singleTurnRadians = 36 * 3.14157 / 180;
    
            turnRadians = turnRadians + singleTurnRadians;
    
    	[UIView beginAnimations:nil context:NULL];
    	[UIView setAnimationDuration:.5];
    	CGAffineTransform transform =    CGAffineTransformMakeRotation(turnRadians);
    	knobImageView.transform = transform;
    	[UIView commitAnimations];
    	notch += 1;	
    }
    -(void)processSwipeLeft:(NSSet*)touches withEvent:event {
    	float singleTurnRadians = 36 * 3.14157 / 180;
    	
            turnRadians = turnRadians - singleTurnRadians;
    
    	[UIView beginAnimations:nil context:NULL];
    	[UIView setAnimationDuration:.5];
    	CGAffineTransform transform = CGAffineTransformMakeRotation(turnRadians);
    	knobImageView.transform = transform;
    	[UIView commitAnimations];
            notch -= 1;	
    	
    }
    

    But that still does not working properly. Somehow the behavior of CGAffineTransformMakeRotation(angle) doesn't seem to get the job done... :(

    Any code suggestions?
  • scottiphonescottiphone Posts: 802Registered Users
    edited August 2008
    If you want 1:1 movement you might skip the animation function. This is fine if you want it to autorotate a set amount but for interaction you might as well just set it directly immediately.

    You could calculate the degrees around using atan2(?) relative to the the center.
    (i.e. touch is x,y relative to center xy so it's z degrees)
    As you move your finger you recalc and use the difference to rotate.
  • HoofSCHoofSC Posts: 41Registered Users
    edited August 2008
    If you want 1:1 movement you might skip the animation function. This is fine if you want it to autorotate a set amount but for interaction you might as well just set it directly immediately.

    I do want interaction, but I guess I'm confused as to the way to "set" the rotation. The CGAffineTransformMakeRotation on every swipe method call is giving me weird erratic results (using the code block above) whether I call the UIView animation methods or not...

    Something simple I'm missing?

    ----EDITED

    Thanks Scott. It turns out that the rotation does work. It appears to be a problem with my swipe method detection that is giving erratic results.

    Here is what I have:
    -(void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event {
    	UITouch *touch = [touches anyObject];
    	startTouchPosition = [touch locationInView:self];
    	
    /*implemented this to test the progressive rotation, it works	
    if([touch tapCount] == 2) { 
    		turnRadians += singleTurnRadians;
    		knobView.transform =  CGAffineTransformMakeRotation(turnRadians);
    	}
    */
    
    	
    	
    }
    -(void)touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event {
    	UITouch *touch = [touches anyObject];
    	CGPoint currentTouchPosition = [touch locationInView:self];
    	
    	//if the swipe tracks correctly
    	if (fabsf(startTouchPosition.x - currentTouchPosition.x) >= HORIZ_SWIPE_DRAG_MIN &&
    		fabsf(startTouchPosition.y - currentTouchPosition.y) <= VERT_SWIPE_DRAG_MAX) {
    			//it appears to be a swipe
    		if (startTouchPosition.x < currentTouchPosition.x) {
    			[self processSwipeRight:touches withEvent:event];
    		}
    		else {
    			[self processSwipeLeft:touches withEvent:event];
    		}
    	}
    	else {
    			//process non-swipe event
    	}
    }
    
Sign In or Register to comment.