VLCMiniPlaybackViewController: switch to Autolayout and adjust UI for iPhone X

Sources/VLCMiniPlaybackView.m

@@ -16,7 +16,6 @@
 #import "VLCMetadata.h"
 
 #if TARGET_OS_IOS
-#import "VLCLibraryViewController.h"
 #import "VLCKeychainCoordinator.h"
 #endif
 
@@ -29,109 +28,131 @@
     UIButton *_nextButton;
     UIButton *_expandButton;
     UILabel *_metaDataLabel;
-    UITapGestureRecognizer *_labelTapRecognizer;
-    UITapGestureRecognizer *_artworkTapRecognizer;
+    UITapGestureRecognizer *_tapRecognizer;
+    UIStackView *_stackView;
 }
 
 @end
 
 @implementation VLCMiniPlaybackView
 
-- (void)dealloc
-{
-    [[NSNotificationCenter defaultCenter] removeObserver:self];
-}
-
 - (instancetype)initWithFrame:(CGRect)viewFrame
 {
     self = [super initWithFrame:viewFrame];
-    if (!self)
-        return self;
+    if (self) {
+        [self setupSubviews];
+
+        NSNotificationCenter *center = [NSNotificationCenter defaultCenter];
+        [center addObserver:self
+                   selector:@selector(appBecameActive:)
+                       name:UIApplicationDidBecomeActiveNotification
+                     object:nil];
+#if TARGET_OS_IOS
+        [center addObserver:self
+                   selector:@selector(appBecameActive:)
+                       name:VLCPasscodeValidated
+                     object:nil];
+#endif
+    }
+    return self;
+}
 
-    CGRect previousRect;
+- (void)setupSubviews
+{
     CGFloat buttonSize = 44.;
+    CGFloat videoSize = 60.;
+    CGFloat padding = 10.;
 
-    _artworkView = [[UIImageView alloc] initWithFrame:CGRectMake(0., 0., 60., 60.)];
-    _artworkView.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
+    _artworkView = [[UIImageView alloc] initWithFrame:CGRectZero];
+    _artworkView.translatesAutoresizingMaskIntoConstraints = NO;
+    _artworkView.clipsToBounds = YES;
     _artworkView.backgroundColor = [UIColor VLCDarkBackgroundColor];
     _artworkView.opaque = YES;
     [self addSubview:_artworkView];
 
-    /* build buttons from right to left */
+    _videoView = [[UIView alloc] initWithFrame:CGRectZero];
+    [_videoView setClipsToBounds:YES];
+    _videoView.userInteractionEnabled = NO;
+    _videoView.translatesAutoresizingMaskIntoConstraints = NO;
+    [self addSubview:_videoView];
+
     _expandButton = [UIButton buttonWithType:UIButtonTypeCustom];
     [_expandButton setImage:[UIImage imageNamed:@"ratioIcon"] forState:UIControlStateNormal];
-    _expandButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
+    _expandButton.translatesAutoresizingMaskIntoConstraints = NO;
     [_expandButton addTarget:self action:@selector(pushFullPlaybackView:) forControlEvents:UIControlEventTouchUpInside];
-    _expandButton.frame = previousRect = CGRectMake(viewFrame.size.width - buttonSize, (viewFrame.size.height - buttonSize) / 2., buttonSize, buttonSize);
     _expandButton.accessibilityLabel = NSLocalizedString(@"FULLSCREEN_PLAYBACK", nil);
-    [self addSubview:_expandButton];
 
     _nextButton = [UIButton buttonWithType:UIButtonTypeCustom];
     [_nextButton setImage:[UIImage imageNamed:@"forwardIcon"] forState:UIControlStateNormal];
-    [_nextButton sizeToFit];
-    _nextButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
+    _nextButton.translatesAutoresizingMaskIntoConstraints = NO;
     [_nextButton addTarget:self action:@selector(nextAction:) forControlEvents:UIControlEventTouchUpInside];
-    _nextButton.frame = previousRect = CGRectMake(previousRect.origin.x - buttonSize, (viewFrame.size.height - buttonSize) / 2., buttonSize, buttonSize);
     _nextButton.accessibilityLabel = NSLocalizedString(@"FWD_BUTTON", nil);
-    [self addSubview:_nextButton];
 
     _playPauseButton = [UIButton buttonWithType:UIButtonTypeCustom];
     [_playPauseButton setImage:[UIImage imageNamed:@"playIcon"] forState:UIControlStateNormal];
-    [_playPauseButton sizeToFit];
-    _playPauseButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
+    _playPauseButton.translatesAutoresizingMaskIntoConstraints = NO;
     [_playPauseButton addTarget:self action:@selector(playPauseAction:) forControlEvents:UIControlEventTouchUpInside];
     _playPauseButton.accessibilityLabel = NSLocalizedString(@"PLAY_PAUSE_BUTTON", nil);
     _playPauseButton.accessibilityHint = NSLocalizedString(@"LONGPRESS_TO_STOP", nil);
-    _playPauseButton.frame = previousRect = CGRectMake(previousRect.origin.x - buttonSize, (viewFrame.size.height - buttonSize) / 2., buttonSize, buttonSize);
     UILongPressGestureRecognizer *longPressRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(playPauseLongPress:)];
     [_playPauseButton addGestureRecognizer:longPressRecognizer];
-    [self addSubview:_playPauseButton];
 
     _previousButton = [UIButton buttonWithType:UIButtonTypeCustom];
     [_previousButton setImage:[UIImage imageNamed:@"backIcon"] forState:UIControlStateNormal];
     [_previousButton sizeToFit];
-    _previousButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
+    _previousButton.translatesAutoresizingMaskIntoConstraints = NO;
     [_previousButton addTarget:self action:@selector(previousAction:) forControlEvents:UIControlEventTouchUpInside];
-    _previousButton.frame = previousRect = CGRectMake(previousRect.origin.x - buttonSize, (viewFrame.size.height - buttonSize) / 2., buttonSize, buttonSize);
     _previousButton.accessibilityLabel = NSLocalizedString(@"BWD_BUTTON", nil);
-    [self addSubview:_previousButton];
 
-    CGFloat artworkViewWidth = _artworkView.frame.size.width;
-    _metaDataLabel = [[UILabel alloc] initWithFrame:CGRectMake(artworkViewWidth + 10., 0., previousRect.origin.x - artworkViewWidth - 10., viewFrame.size.height)];
+    _metaDataLabel = [[UILabel alloc] initWithFrame:CGRectZero];
     _metaDataLabel.font = [UIFont systemFontOfSize:12.];
     _metaDataLabel.textColor = [UIColor VLCLightTextColor];
     _metaDataLabel.numberOfLines = 0;
-    _metaDataLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth;
+    _metaDataLabel.translatesAutoresizingMaskIntoConstraints = NO;
     [self addSubview:_metaDataLabel];
 
-    _labelTapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapRecognized)];
-    _labelTapRecognizer.delegate = self;
-    [_metaDataLabel addGestureRecognizer:_labelTapRecognizer];
-    _metaDataLabel.userInteractionEnabled = YES;
+    _stackView = [[UIStackView alloc] initWithArrangedSubviews:@[_previousButton, _playPauseButton, _nextButton, _expandButton]];
+    _stackView.translatesAutoresizingMaskIntoConstraints = NO;
+    _stackView.distribution = UIStackViewDistributionFillEqually;
+    [self addSubview:_stackView];
 
-    _artworkTapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapRecognized)];
-    _artworkTapRecognizer.delegate = self;
-    [_artworkView addGestureRecognizer:_artworkTapRecognizer];
-    _artworkView.userInteractionEnabled = YES;
+    UILayoutGuide *guide = self.layoutGuides.firstObject;
+    if (@available(iOS 11.0, *)) {
+        guide = self.safeAreaLayoutGuide;
+    }
 
-#if TARGET_OS_IOS
-    _labelTapRecognizer.numberOfTouchesRequired = 1;
-    _artworkTapRecognizer.numberOfTouchesRequired = 1;
-#endif
+    [NSLayoutConstraint activateConstraints:@[
+                                              [_artworkView.leftAnchor constraintEqualToAnchor:self.leftAnchor],
+                                              [_artworkView.topAnchor constraintEqualToAnchor:self.topAnchor],
+                                              [_artworkView.rightAnchor constraintEqualToAnchor:_metaDataLabel.leftAnchor constant:-padding],
+                                              [_artworkView.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor],
+                                              [_artworkView.widthAnchor constraintEqualToConstant:videoSize],
+                                              [_artworkView.heightAnchor constraintEqualToAnchor:_artworkView.widthAnchor],
+
+                                              [_videoView.leftAnchor constraintEqualToAnchor:self.leftAnchor],
+                                              [_videoView.topAnchor constraintEqualToAnchor:self.topAnchor],
+                                              [_videoView.rightAnchor constraintEqualToAnchor:_metaDataLabel.leftAnchor constant:-padding],
+                                              [_videoView.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor],
+                                              [_videoView.widthAnchor constraintEqualToConstant:videoSize],
+                                              [_videoView.heightAnchor constraintEqualToAnchor:_videoView.widthAnchor],
+
+                                              [_metaDataLabel.topAnchor constraintEqualToAnchor:self.topAnchor],
+                                              [_metaDataLabel.rightAnchor constraintLessThanOrEqualToAnchor:_stackView.leftAnchor constant:- padding],
+                                              [_metaDataLabel.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor],
+                                              [_previousButton.widthAnchor constraintEqualToConstant:buttonSize],
+
+                                              [_stackView.topAnchor constraintEqualToAnchor:self.topAnchor],
+                                              [_stackView.rightAnchor constraintEqualToAnchor:self.rightAnchor],
+                                              [_stackView.bottomAnchor constraintEqualToAnchor:guide.bottomAnchor],
+                                              ]];
+
+    _tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapRecognized)];
+    _tapRecognizer.delegate = self;
+    [self addGestureRecognizer:_tapRecognizer];
 
-    NSNotificationCenter *center = [NSNotificationCenter defaultCenter];
-    [center addObserver:self
-               selector:@selector(appBecameActive:)
-                   name:UIApplicationDidBecomeActiveNotification
-                 object:nil];
 #if TARGET_OS_IOS
-    [center addObserver:self
-               selector:@selector(appBecameActive:)
-                   name:VLCPasscodeValidated
-                 object:nil];
+    _tapRecognizer.numberOfTouchesRequired = 1;
 #endif
-
-    return self;
 }
 
 - (void)appBecameActive:(NSNotification *)aNotification
@@ -185,7 +206,6 @@
     [[UIApplication sharedApplication] sendAction:@selector(showFullscreenPlayback) to:nil from:self forEvent:nil];
 }
 
-
 - (void)updatePlayPauseButton
 {
     const BOOL isPlaying = [VLCPlaybackController sharedInstance].isPlaying;
@@ -211,28 +231,15 @@ currentMediaHasTrackToChooseFrom:(BOOL)currentMediaHasTrackToChooseFrom
 
 - (void)displayMetadataForPlaybackController:(VLCPlaybackController *)controller metadata:(VLCMetaData *)metadata
 {
+    _videoView.hidden = YES;
     if (metadata.isAudioOnly) {
         _artworkView.contentMode = UIViewContentModeScaleAspectFill;
         _artworkView.image = metadata.artworkImage?: [UIImage imageNamed:@"no-artwork"];
-        if (_videoView) {
-            [_videoView removeFromSuperview];
-            _videoView = nil;
-        }
-        [_artworkView addGestureRecognizer:_artworkTapRecognizer];
     } else {
         _artworkView.image = nil;
-        if (_videoView) {
-            [_videoView removeFromSuperview];
-            _videoView = nil;
-        }
-
         VLCPlayerDisplayController *pdc = [VLCPlayerDisplayController sharedInstance];
         if (pdc.displayMode == VLCPlayerDisplayControllerDisplayModeMiniplayer) {
-            _videoView = [[UIView alloc] initWithFrame:_artworkView.frame];
-            [_videoView setClipsToBounds:YES];
-            [_videoView addGestureRecognizer:_artworkTapRecognizer];
-            _videoView.userInteractionEnabled = YES;
-            [self addSubview:_videoView];
+            _videoView.hidden = false;
             controller.videoOutputView = _videoView;
         }
     }

Sources/VLCPlayerDisplayController.m

@@ -107,6 +107,16 @@ static NSString *const VLCPlayerDisplayControllerDisplayModeKey = @"VLCPlayerDis
     [[NSUserDefaults standardUserDefaults] setInteger:displayMode forKey:VLCPlayerDisplayControllerDisplayModeKey];
 }
 
+- (void)viewSafeAreaInsetsDidChange
+{
+    if (@available(iOS 11.0, *)) {
+        [super viewSafeAreaInsetsDidChange];
+        CGRect frame = _miniPlaybackView.frame;
+        frame.size.height = 60.0 + self.view.safeAreaInsets.bottom;
+        _miniPlaybackView.frame = frame;
+    }
+}
+
 - (VLCPlaybackController *)playbackController {
     if (_playbackController == nil) {
         _playbackController = [VLCPlaybackController sharedInstance];
@@ -293,7 +303,11 @@ static NSString *const VLCPlayerDisplayControllerDisplayModeKey = @"VLCPlayerDis
     const BOOL miniPlayerVisible = miniPlaybackView.visible;
 
     const CGRect viewRect = self.view.bounds;
-    const CGFloat miniPlayerHeight = 60.;
+
+    CGFloat miniPlayerHeight = 60.;
+    if (@available(iOS 11.0, *)) {
+        miniPlayerHeight += self.view.safeAreaInsets.bottom;
+    }
     const CGRect miniPlayerFrameIn =  CGRectMake(0., viewRect.size.height-miniPlayerHeight, viewRect.size.width, miniPlayerHeight);
     const CGRect miniPlayerFrameOut = CGRectMake(0., viewRect.size.height, viewRect.size.width, miniPlayerHeight);