AVCaptureVideoPreviewLayer doesn't fill up whole iPhone 4S Screen

IphoneIos4Avfoundation

Iphone Problem Overview


AVCaptureVideoPreviewLayer *avLayer = 
                [AVCaptureVideoPreviewLayer layerWithSession:session];
avLayer.frame = self.view.frame;
[self.view.layer addSublayer:avLayer];

I use AVCaptureVideoPreviewLayer to display video on the view. But the video's view didn't fill up the full iPhone4's screen.(two grey bar at the right&left side)

I want the video fills up full screen. How can I deal with it? Thank you very much!

enter image description here

Iphone Solutions


Solution 1 - Iphone

Maybe this solves it?

CGRect bounds=view.layer.bounds;
avLayer.videoGravity = AVLayerVideoGravityResizeAspectFill;
avLayer.bounds=bounds;
avLayer.position=CGPointMake(CGRectGetMidX(bounds), CGRectGetMidY(bounds));

Solution 2 - Iphone

One potential cause of confusion is that the AVCaptureVideoPreviewLayer is a CoreAnimation layer and in all of the answers above is being positioned statically (e.g. without constraints) relative a view. If you use constraints to layout the view, these don't automatically resize the preview layer.

This means that you cannot set up the preview layer in viewDidLoad as the layout has not yet taken place and the preview layer will sized how it was in Interface Builder.

Instead, override viewDidLayoutSubviews on your ViewController and position the preview layer there.

- (void)viewDidLayoutSubviews
{
    CGRect bounds=view.layer.bounds;
    avLayer.videoGravity = AVLayerVideoGravityResizeAspectFill;  
    avLayer.bounds=bounds;
    avLayer.position=CGPointMake(CGRectGetMidX(bounds), CGRectGetMidY(bounds));
}

Solution 3 - Iphone

@fitzwald's answer will give you the desired result, but there is an easier way. What is happening is that the session preset defaults to Video - High (which doesn't match the aspect ratio of the screen). A full screen preview (like in Camera.app) can be achieved by using the Photo preset. Simply set

session.sessionPreset = AVCaptureSessionPresetPhoto;

before you start your session. Here's the Apple Documentation if you want to learn more.

Solution 4 - Iphone

For Google's sake, this is the accepted answer but using Swift which is slightly different:

var bounds:CGRect = self.view.layer.bounds
previewLayer?.videoGravity = AVLayerVideoGravityResizeAspectFill
previewLayer?.bounds = bounds
previewLayer?.position = CGPointMake(CGRectGetMidX(bounds), CGRectGetMidY(bounds))

Solution 5 - Iphone

The accepted answer

Swift 3:

  let bounds = view.layer.bounds
  self.cameraLayer.videoGravity = AVLayerVideoGravityResizeAspectFill
  self.cameraLayer.bounds = bounds
  self.cameraLayer.position = CGPoint(x:bounds.midX, y:bounds.midY)
  self.cameraView?.layer.addSublayer(self.cameraLayer)

Swift 4:

  let bounds = view.layer.bounds
  self.cameraLayer.videoGravity = AVLayerVideoGravity.resizeAspectFill
  self.cameraLayer.bounds = bounds
  self.cameraLayer.position = CGPoint(x:bounds.midX, y:bounds.midY)
  self.cameraView?.layer.addSublayer(self.cameraLayer)

Solution 6 - Iphone

Swift 5

I solve the problem by using the following code:

    let bounds = view.layer.bounds
    let previewLayer = AVCaptureVideoPreviewLayer(session: captureSession)
    view.layer.addSublayer(previewLayer)
    previewLayer.videoGravity = AVLayerVideoGravity.resizeAspectFill
    previewLayer.bounds = bounds
    previewLayer.position = CGPoint(x:bounds.midX, y:bounds.midY)

Solution 7 - Iphone

I use the following code to achieve this

previewLayer.frame = CGRectMake(0, 0, self.view.frame.size.width,self.view.frame.size.height);
previewLayer.orientation = [[UIDevice currentDevice] orientation];
previewLayer.contentsGravity = kCAGravityResizeAspectFill;

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRaferView Question on Stackoverflow
Solution 1 - IphoneflitzwaldView Answer on Stackoverflow
Solution 2 - IphonemarkoView Answer on Stackoverflow
Solution 3 - IphoneeschurterView Answer on Stackoverflow
Solution 4 - IphoneRajView Answer on Stackoverflow
Solution 5 - IphoneAllenView Answer on Stackoverflow
Solution 6 - IphoneAngela LiView Answer on Stackoverflow
Solution 7 - Iphoneraju_krView Answer on Stackoverflow