PDA

View Full Version : Rotating UIImageview




x12
May 21, 2009, 08:28 AM
hey, i need some help rotating an UIImageview, i need the rotation to be continuous when another uiimageView is touched, the code i am using now will only rotate so far the it will stop, does any one have a solution or know of any good tutorials for this


-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
if ([touch view] == image1){


[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
image2.transform = CGAffineTransformMakeRotation(M_PI /12);
[UIView commitAnimations];


}


}



dejo
May 21, 2009, 09:25 AM
Assuming M_PI is a constant for ∏, M_PI / 12 (remember CGAffineTransformMakeRotation takes an angle in radians) is equivalent to about 15 degrees. How much do you want the image to rotate?

x12
May 21, 2009, 09:46 AM
i want to rotate 360d it is a circle with and image inside it so the user can see that it is rotating

dejo
May 21, 2009, 09:47 AM
360 degrees = 2∏ (or M_PI * 2, in your case).

x12
May 21, 2009, 09:52 AM
when i changed the code it does not rotate at all ?????


-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
if ([touch view] == image1){


[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
image2.transform = CGAffineTransformMakeRotation(M_PI *2);
[UIView commitAnimations];

}
}

dejo
May 21, 2009, 09:55 AM
2∏ is a full rotation so the image ends up in the same place it started. What happens if you just try M_PI? Also, what is your animationDuration set to?

x12
May 21, 2009, 10:00 AM
when i have just M_PI it rotates 180d, i havnt included the code for animation duration, wasn't sure about that as i want it to be continuously rotating until the other image is touched again

dejo
May 21, 2009, 10:07 AM
when i have just M_PI it rotates 180d, i havnt included the code for animation duration, wasn't sure about that as i want it to be continuously rotating until the other image is touched again
Continuously rotated? Well, that's gonna be a might trickier...

x12
May 21, 2009, 10:14 AM
do you know how it can be done:confused:

dejo
May 21, 2009, 10:21 AM
do you know how it can be done:confused:
Do I know? No. But I suspect you'll need to setup some kind of loop in a timer or thread to constantly rotate the image. Then based on an IBAction, you'll need a mechanism to stop that loop. But those who are more familiar with CoreAnimation may have other thoughts on how to achieve this, perhaps even simpler ways.

x12
May 21, 2009, 10:25 AM
I will look into it thanks for your help again

x12
May 21, 2009, 10:35 AM
i now have it on a loop of a 180d rotation getting closer

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
if ([touch view] == image1){


[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:1.0];
[UIView setAnimationRepeatCount:1e100f];
image2.transform = CGAffineTransformMakeRotation(M_PI );
[UIView commitAnimations];



}
}

KardelSharpeye
May 21, 2009, 11:10 AM
use this formula: radians = degrees * M_PI / 180

x12
May 21, 2009, 11:17 AM
do you mean #define radians = degrees * M_PI / 180


with this line it just rotates 180d anti-clockwise i need to go clockwise at 360d

image2.transform = CGAffineTransformMakeRotation(M_PI);

:confused::confused:

KardelSharpeye
May 21, 2009, 11:24 AM
do you mean #define radians = degrees * M_PI / 180


with this line it just rotates 180d anti-clockwise i need to go clockwise at 360d

image2.transform = CGAffineTransformMakeRotation(M_PI);

:confused::confused:

-360 for counter clockwise and 360 for clockwise?

x12
May 21, 2009, 11:34 AM
-360 for counter clockwise and 360 for clockwise?

i am so confused with this one :confused::confused:
at most i can get it rotating 180d clockwise when i put 360 in place below it doesnt move at all

#define radians = degrees * M_PI / 360

image2.transform = CGAffineTransformMakeRotation(??);

dejo
May 21, 2009, 12:30 PM
The thing to remember is that, using this technique, you are setting a start rotation (which is kinda defaulted) and an end rotation and leaving it to Core Animation to determine how to handle the animation between those. So, if you start at 0º and end at, say, 270º, the animation is going to go counter-clockwise from 360º (the same as 0º) down to 270º. The signedness of the rotation does not affect the direction of rotation. Just the end angle.

i am so confused with this one :confused::confused:
at most i can get it rotating 180d clockwise when i put 360 in place below it doesnt move at all
That's because your end angle is the same as your start angle, so nothing happens (no rotation required).

#define radians = degrees * M_PI / 360
I believe KardelSharpeye didn't intend for this to be a define but rather a variable. There is a way to make this work as a define but I suspect that is somewhat advanced for you, x12, right now. Instead, try something like:
CGFloat radians = degrees * M_PI / 360
where "degrees" can be another variable or a define or a constant. Then you would use it like so:

image2.transform = CGAffineTransformMakeRotation(radians);


All this still doesn't really address rotating your image through a full 360º, let alone doing so continually.

KardelSharpeye
May 21, 2009, 12:45 PM
First of all, its radians = degrees * M_PI / 180. And yes you replace the degrees with the ACTUAL degree that you want to rotate.

Secondly, i just tried negative degree. it works (it goes counter clockwise).

Lastly, if you want to make it move around why not have it run in a for-loop and change the angle by +/- 1 degree each iteration.

EDIT:oops for-loop might not work. you need a recursive function call which will do +/- 1 degree each call AFTER the animation is finished.
i think setAnimationDisStopSelector might work.

dejo
May 21, 2009, 12:49 PM
First of all, its radians = degrees * M_PI / 180.
Oops, sorry about that. :o

Secondly, i just tried negative degree. it works (it goes counter clockwise).
Try -270 degrees and tell me which way it turns.

KardelSharpeye
May 21, 2009, 01:01 PM
Try -270 degrees and tell me which way it turns.

the end result is that the image is lying horrizontally on its right. kinda hard to show it here but i will try to describe what i mean.

[ A ]
[B C]
[ D ]

becomes:

[ B ]
[D A]
[ C ]

or i guess it is the same as positive 90 degrees.

dejo
May 21, 2009, 01:28 PM
or i guess it is the same as positive 90 degrees.
Right. And during the animation it was turning clockwise, correct?

KardelSharpeye
May 21, 2009, 01:35 PM
Right. And during the animation it was turning clockwise, correct?

:o:( lol you're right. what the heck? anyway when i use -3 degrees it turns counter clockwise. :p

off topic of this thread: but how come when i do CGAffineTransformScale(1, 1), all of my previous rotation cancels and it goes back to its CGAffineTransformIdentity? i thought CGAffineTransformScale only change the scale why is it changing my rotation too?

dejo
May 21, 2009, 03:14 PM
Well, I was able to get a continuously rotating image without the need for a thread or loop. Here's a starting screen shot and few code snippets to demonstrate (apologies for the lack of comments):

- (void)viewDidLoad {
[super viewDidLoad];
[rotateButton setTitle:@"Stopping..." forState:UIControlStateDisabled];
[rotateButton setTitleColor:[UIColor grayColor] forState:UIControlStateDisabled];
}

-(void)rotateImage:(id)sender {
NSLog(@"rotateImage:");
if (upsideDown) {
myImage.transform = CGAffineTransformMakeRotation(M_PI * 1.0);
} else {
myImage.transform = CGAffineTransformMakeRotation(M_PI * 0.0);
}
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:@selector(didStopRotating:)];
[UIView setAnimationDuration:1.0];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
if (upsideDown) {
myImage.transform = CGAffineTransformMakeRotation(M_PI * 1.999);
} else {
myImage.transform = CGAffineTransformMakeRotation(M_PI * 0.999);
}
[UIView commitAnimations];
upsideDown = !upsideDown;
}

- (void)didStopRotating:(id)sender {
NSLog(@"didStopRotating:");
if (imageIsRotating || upsideDown) {
[self rotateImage:nil];
} else if (!upsideDown) {
rotateButton.enabled = YES;
[rotateButton setTitle:@"Rotate" forState:UIControlStateNormal];
}
}

-(IBAction)rotateButtonPressed:(id)sender {
if (!imageIsRotating) {
imageIsRotating = YES;
[rotateButton setTitle:@"Stop" forState:UIControlStateNormal];
[self rotateImage:nil];
} else {
imageIsRotating = NO;
rotateButton.enabled = NO;
}
}


(I've left out some of the "logistics" code (IBAction, IBOutlet, static variable declares, etc.)

Basically, I'm rotating 180º till my image is upside-down and then kicking off another rotation to "complete the circle". I'm also changing the title of the button to Stop while rotating and Stopping... (disabled) until the rotation is complete.

KardelSharpeye
May 21, 2009, 03:29 PM
hey dejo,

do you know how to just change the scale of an object without affecting the rotation?

i have:

UIImageView *image;

image.transform = CGAffineTransformMakeScale(1.2, 1.2);
image.transform = CGAffineTransformRotate( image.transform, degreesToRadians(-3));
image.transform = CGAffineTransformMakeScale(1, 1);



and the image turns back to CGAffineTransformIdentity...or normal when it first started...

dejo
May 21, 2009, 03:38 PM
image.transform = CGAffineTransformMakeScale(1, 1);
This is an assignment that overwrites any previous setting for image's transform. You probably need to figure out how to use CGAffineTransformScale instead.

KardelSharpeye
May 21, 2009, 03:50 PM
what my program tries to do is scale it up when the user touch the object and scale it down when the user lift up the finger. and i tried to use CGAffineTransformScale(transform, 1, 1); however the image kept on shrinking and not coming back to its original size when i kept on touching it...i think the problem is that it is shrinking during the process of growing.

and i think the way to resolve this is to check if the current object is animating or not. i tried to use setAnimationDidStopSelector but i run into a whole new problem with accessing a singleton value...

i also tried to use isAnimating BOOL but that didnt work either...

i am running out of options.

dejo
May 21, 2009, 03:56 PM
and i tried to use CGAffineTransformScale(transform, 1, 1);
All this does is (not)scale the object to its current scale, not its original scale (1 * x = x, remember?). You'll want something like CGAffineTransformScale(transform, 0.83, 0.83); instead.

KardelSharpeye
May 21, 2009, 04:06 PM
yeh sorry i actually have it transform to 0.8 and increase at 1.25...however i dont have the problem makin it shrink its jsut that it shrinks to much...is there anyway i can check if the view is animating?

dejo
May 21, 2009, 04:11 PM
yeh sorry i actually have it transform to 0.8 and increase at 1.25...however i dont have the problem makin it shrink its jsut that it shrinks to much...is there anyway i can check if the view is animating?
Is the view not fully expanded when you start the shrinking animation?

KardelSharpeye
May 21, 2009, 04:18 PM
Is the view not fully expanded when you start the shrinking animation?

i think thats the problem because when i keep on tapping it it keep on shrinking...

dejo
May 21, 2009, 04:54 PM
i think thats the problem because when i keep on tapping it it keep on shrinking...
I wonder if you can detect the current scale when the shrinking is supposed to start and then just scale by 1 / current.

KardelSharpeye
May 21, 2009, 05:26 PM
I wonder if you can detect the current scale when the shrinking is supposed to start and then just scale by 1 / current.

yeh i think the 'a' and 'd' values in CGAffineTransform struct (which has a, b, c, d, tx, ty) are the scale values. but when i tried to modify those values the image freak out when i touch on it again...i have no idea what or how to get scale values...

rd13
May 22, 2009, 01:17 AM
This discussion has been very helpful -- thank you all.

The thing to remember is that, using this technique, you are setting a start rotation (which is kinda defaulted) and an end rotation and leaving it to Core Animation to determine how to handle the animation between those. So, if you start at 0º and end at, say, 270º, the animation is going to go counter-clockwise from 360º (the same as 0º) down to 270º. The signedness of the rotation does not affect the direction of rotation. Just the end angle.
Excellent point.

However, I have a situation where I need to be able to control whether the animated rotation is done Clockwise or Counter-clockwise. For my purposes, this could be to a specified (Absolute) angle, or by a +/- Relative angle.

Any ideas how to exercise this kind of control?

Many thanks!

dejo
May 22, 2009, 09:25 AM
Any ideas how to exercise this kind of control?
You probably need to look at using keyframe animation. It's something I, myself, am considering delving deeper into.

rd13
May 22, 2009, 12:44 PM
You probably need to look at using keyframe animation. It's something I, myself, am considering delving deeper into.

Of course, that makes perfect sense -- thanks, Dejo!