How to handle the change of orientation like the standard camera application on the iPhone

Question

I use AVFoundation framework to get access to camera. In the standard camera application, when the orientation changes only the rotation of the icons on the buttons. But when I try to do something like, I have a problem related to the orientation changes animation. Preview view is rotated and the area behind it is black and has image jerks when turning.

Now I have this code:

-(void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {

    [CATransaction begin];
    [CATransaction setValue:[NSNumber numberWithFloat:duration]
                     forKey:kCATransactionAnimationDuration];
    if (toInterfaceOrientation==UIInterfaceOrientationLandscapeLeft){
        captureManager.previewLayer.transform=CATransform3DMakeRotation(M_PI/2, 0, 0, 1.0);
        captureManager.previewLayer.frame = CGRectMake(0, 0, 480, 320);
    } else if (toInterfaceOrientation==UIInterfaceOrientationPortrait){
        captureManager.previewLayer.transform=CATransform3DMakeRotation(0, 0, 0, 1.0);
        captureManager.previewLayer.frame = CGRectMake(0, 0, 320, 480);
    } else if (toInterfaceOrientation==UIInterfaceOrientationLandscapeRight){
        captureManager.previewLayer.transform=CATransform3DMakeRotation(M_PI+M_PI/2, 0, 0, 1.0);
        captureManager.previewLayer.frame = CGRectMake(0, 0, 480, 320);
    }

    [CATransaction commit];
}

My idea it is use transform animation to deal with rotation animation but I get problems with glithes.

How can create camera preview view and solve problems with orientation change? May be I must use other instrument to work with camera? Not AVFoundation framework?

I know that I can lock orientation and use accelerometer to deal with buttons icons. But the i get problems with some subviewcontrollers.

Sorry for terrible english.

Answer 1

You need to disable landscape orientation for your controller and update layout of icons etc by handling orientation change notifications. In this topic it is described right - How to handle autorotation in AVCaptureVideoPreviewLayer?

Answer 2

Nikita's answer works but requires extra code to handle the behavior of the UI elements when the device rotates. If that's too much trouble, another option (which I implemented and works) is to have 2 different UIWindow instances, one for the camera's preview layer and one for the UI elements to display on to. Notice that for this to work, the Window with the UI elements needs to have a transparent background.

Answer 3

I handle preview rotation change in the following way.

P.S all subviews have corresponding constraints set on storyboard so i only update the frame of videoPreviewLayer.

override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
    DispatchQueue.main.async {
        self.videoPreviewLayer.frame = self.previewView.bounds
        self.setRotation()
    }
}



func setRotation() {
    let deviceOrientation = UIDevice.current.orientation
    switch deviceOrientation {
    case .landscapeLeft:
        videoPreviewLayer?.connection?.videoOrientation = AVCaptureVideoOrientation.landscapeRight
        break
    case .landscapeRight:
        videoPreviewLayer?.connection?.videoOrientation = AVCaptureVideoOrientation.landscapeLeft
        break
    case .portrait:
        videoPreviewLayer?.connection?.videoOrientation = AVCaptureVideoOrientation.portrait
        break
    case .portraitUpsideDown:
        videoPreviewLayer?.connection?.videoOrientation = AVCaptureVideoOrientation.portraitUpsideDown
        break
    default:
        break
    }
}