Rotate UI Elements programmatically after shouldAutorotate

Question

I have a viewController that should not "autorotate", but manually rotate specific GUI elements. The reason is that I use the front camera for taking a picture and I don't want the UIView that contains my UIImageView to be rotated. My code looks like this:

-(BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation {
    [self performSelector:@selector(refreshView) withObject:nil afterDelay:1.0];
    return NO; // don't autorotate!
}

and:

- (void) refreshView  {
    UIDeviceOrientation actualDeviceOrientation = [[UIDevice currentDevice] orientation];

    float    rotation        = 0;    // UIDeviceOrientationPortrait
    if      (actualDeviceOrientation == UIDeviceOrientationPortraitUpsideDown)  rotation = 180;
    else if (actualDeviceOrientation == UIDeviceOrientationLandscapeLeft)       rotation = 90;
    else if (actualDeviceOrientation == UIDeviceOrientationLandscapeRight)      rotation = 270;
    float    rotationRadians = rotation * M_PI / 180;

    [UIView animateWithDuration:0.4
                 animations:^(void) {
                     self.labelPrize.center        = self.prizeView.center;
                     self.prizeView.transform      = CGAffineTransformMakeRotation(rotationRadians);
                 } completion:^(BOOL finished){  }];
}

"labelPrize" is the label with the caption "20 EURO" that is seen on the screenshots below, "prizeView" is it's container. prizeView is the only GUI element that has constraints defined, which look like this:

Properties of prizeView

Just for clarification, here's what "labelPrize" looks like:

Properties of labelPrize

And finally, here's what the app produces:

enter image description here

This is not what I want to achieve, I'd like "prizeView"/"labelPrize" to be

always aligned to the horizon
always in the exact center of the screen

Also worth mentioning: I'd like to add labels above (header) and a button below ("okay") my "labelPrize" and rotate/position them as well in refreshView().

Thanks for any help!

score 1 · Accepted Answer · edited May 23 '17 at 11:50

There are two big problems here. Let's take them one at a time.

(1)

self.labelPrize.center = self.prizeView.center;

Think about it. labelPrize is a subview of prizeView. So you are mixing apples with oranges as far as coordinate systems go: labelPrize.center is measured with respect to prizeView.bounds, but prizeView.center is measured with respect to self.view.bounds. To keep the center of labelPrize at the center of prizeView, position it at the midpoint of prizeView's bounds. (However, you should not have to move it at all because the transform transforms the bounds.)

(2)

Rotation view transforms and auto layout are deadly enemies, as I explain here. That is why rotating the transform of prizeView seems to shift its position as well. My answer there gives you several possible workarounds.

Rotate UI Elements programmatically after shouldAutorotate

1 Answers1