Is it possible to rotate a view around its own centre?
In my present implementation the sub-views (buttons, etc) seem to move along a funny path before they end up in the desired positions (since the super view's coordinate system is rotated). I would like the views to spin 90 degrees around theire own centres as in the picture below.
I really like this question. I also find the rotation animation jarring for some interfaces. Here's how I would implement what you have pictured. A simple @interface
will be just fine.
Note: I am using ARC.
#import <UIKit/UIKit.h>
@interface ControllerWithRotatingButtons : UIViewController
@property (strong, nonatomic) IBOutlet UIButton *buttonA;
@property (strong, nonatomic) IBOutlet UIButton *buttonB;
@property (strong, nonatomic) IBOutlet UIButton *buttonC;
@end
The appropriate outlet connections are made to the buttons in the .xib
:
ControllerWithRotatingButtons.m:
#import "ControllerWithRotatingButtons.h"
@implementation ControllerWithRotatingButtons
@synthesize buttonA = _buttonA;
@synthesize buttonB = _buttonB;
@synthesize buttonC = _buttonC;
-(void)deviceRotated:(NSNotification *)note{
UIDeviceOrientation orientation = [UIDevice currentDevice].orientation;
CGFloat rotationAngle = 0;
if (orientation == UIDeviceOrientationPortraitUpsideDown) rotationAngle = M_PI;
else if (orientation == UIDeviceOrientationLandscapeLeft) rotationAngle = M_PI_2;
else if (orientation == UIDeviceOrientationLandscapeRight) rotationAngle = -M_PI_2;
[UIView animateWithDuration:0.5 animations:^{
_buttonA.transform = CGAffineTransformMakeRotation(rotationAngle);
_buttonB.transform = CGAffineTransformMakeRotation(rotationAngle);
_buttonC.transform = CGAffineTransformMakeRotation(rotationAngle);
} completion:nil];
}
-(void)viewDidLoad{
[super viewDidLoad];
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(deviceRotated:) name:UIDeviceOrientationDidChangeNotification object:nil];
}
-(void)viewDidUnload{
[super viewDidUnload];
[[NSNotificationCenter defaultCenter] removeObserver:self name:UIDeviceOrientationDidChangeNotification object:nil];
}
-(BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation{
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}
@end
And that's it. Now when you rotate your device the screen will not rotate but the buttons will as shown:
Of course if you only want the button's labels to turn you would simply apply the transform to the _buttonA.titleLabel
instead.
Note: Please note that once the device is rotated as far as any touches not on the buttons are concerned the device is still in portrait, but your response to my comment seems to indicate that's not a problem for you.
Feel free to leave a comment if you have a related question.
You can manualy rotate any UIView subclass using transform property.
#import <QuartzCore/QuartzCore.h>
myView.transform = CGAffineTransformMakeRotation(M_PI/2);