AVPlayerLayer not bounds to UIView frame

Question

I'm trying to add AVPlayerLayer to UIView

    self.player = AVPlayer(URL: NSURL(fileURLWithPath: path!))
    self.playerLayer = AVPlayerLayer(player: player);
    self.playerLayer.videoGravity = AVLayerVideoGravityResizeAspectFill;
    self.playerLayer.frame =  ctrVideo.bounds;
    self.ctrVideo.layer.addSublayer(playerLayer);
    player.play();

This is the video's container (in blue):

Constraints:

Final result:

I can't figure out why video is not bounds to UIVIew coordinates. If i bounds it into controller's superview, it is ok.

Answer 1

Sublayer won't resize automatically when view's frame changes, you have to do it manually. You can subclass a UIView to make it easier.

class VideoContainerView: UIView {
  var playerLayer: CALayer?
  override func layoutSublayersOfLayer(layer: CALayer) {
    super.layoutSublayersOfLayer(layer)
    playerLayer?.frame = self.bounds
  }
}

And then in your code:

self.player = AVPlayer(URL: NSURL(fileURLWithPath: path!))
self.playerLayer = AVPlayerLayer(player: player);
self.playerLayer.videoGravity = AVLayerVideoGravityResizeAspectFill;
self.playerLayer.frame =  ctrVideo.bounds;
self.ctrVideo.layer.addSublayer(playerLayer);
self.ctrVideo.playerLayer = playerLayer;
player.play();

Just make sure that you change that class of your "ctrVideo" from UIView to VideoContainerView.

Answer 2

I adding AVPlayerLayer in viewDidLoad event... Before constraints apply.

Answer 3

Here's @almas' awesome answer in Swift 4

class VideoContainerView: UIView {    
    var playerLayer: CALayer?

    override func layoutSublayers(of layer: CALayer) {
        super.layoutSublayers(of: layer)
        playerLayer?.frame = self.bounds
    }
}

Answer 4

Here is AVPlayerLayer-backed view, that tries to keep its aspect ratio.

PlayerView.h:

@interface PlayerView : UIView

@property (strong, nonatomic) AVPlayerLayer *layer;

@end

PlayerView.m:

@interface PlayerView ()

@property (strong, nonatomic) NSLayoutConstraint *aspectConstraint;

@end

@implementation PlayerView

@dynamic layer;

+ (Class)layerClass {
    return [AVPlayerLayer class];
}

- (instancetype)init {
    self = [super init];
    if (self) {
        self.userInteractionEnabled = NO;

        [self addObserver:self forKeyPath:@"layer.videoRect" options:NSKeyValueObservingOptionInitial|NSKeyValueObservingOptionNew context:nil];
    }
    return self;
}

- (void)dealloc {
    [self removeObserver:self forKeyPath:@"layer.videoRect"];
}

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context {
    if ([keyPath isEqualToString:@"layer.videoRect"]) {
        CGSize size = [change[NSKeyValueChangeNewKey] CGRectValue].size;
        if (change[NSKeyValueChangeNewKey] && size.width && size.height) {
            self.aspectConstraint.active = NO;
            self.aspectConstraint = [self.widthAnchor constraintEqualToAnchor:self.heightAnchor multiplier:size.width / size.height];
            self.aspectConstraint.priority = UILayoutPriorityDefaultHigh;
            self.aspectConstraint.active = YES;
        }
        else {
            self.aspectConstraint.active = NO;
        }
    }
}

@end