iOS Nổi Video Window như Youtube App

Question

Có ai biết về bất kỳ thư viện hiện có nào hay bất kỳ kỹ thuật nào về cách có được hiệu ứng tương tự như được tìm thấy trên Ứng dụng Youtube.

Video có thể được "thu nhỏ" và di chuyển ở cuối màn hình - sau đó có thể được vuốt để đóng hoặc chạm để tối đa hóa lại.

Xem:

video Playing thường: https://www.dropbox.com/s/o8c1ntfkkp4pc4q/2014-06-07%2001.19.20.png

video thu nhỏ: https://www.dropbox.com/s/w0syp3infu21g08/2014-06-07%2001.19.27.png

(Chú ý cách video hiện đang ở một cửa sổ nổi nhỏ trên góc dưới bên phải của màn hình).

Bất cứ ai cũng có bất kỳ ý tưởng nào về cách thức này đã đạt được và nếu có bất kỳ hướng dẫn hoặc thư viện hiện có nào có thể được sử dụng để có được hiệu ứng tương tự này không?

Answer 1

Nghe có vẻ thú vị, vì vậy tôi đã xem youtube. Video có vẻ như nó phát trong một hộp 16: 9 ở trên cùng, với danh sách "xem thêm" bên dưới. Khi người dùng thu nhỏ video, trình phát sẽ rơi xuống góc dưới bên phải cùng với chế độ xem "xem thêm". Đồng thời, chế độ xem "xem cũng" mờ dần trong suốt.

1) Thiết lập chế độ xem như thế và tạo ra các cửa hàng. Đây là những gì nó trông giống như trong IB. (Lưu ý rằng hai container là anh chị em ruột)

2) Cho xem video một swipe lên và trượt xuống cử chỉ recognizer:

@interface ViewController() 
@property (weak, nonatomic) IBOutlet UIView *tallMpContainer; 
@property (weak, nonatomic) IBOutlet UIView *mpContainer; 
@end 

@implementation ViewController 

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 

    UISwipeGestureRecognizer *swipeDown = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeDown:)]; 
    UISwipeGestureRecognizer *swipeUp = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeUp:)]; 

    swipeUp.direction = UISwipeGestureRecognizerDirectionUp; 
    swipeDown.direction = UISwipeGestureRecognizerDirectionDown; 

    [self.mpContainer addGestureRecognizer:swipeUp]; 
    [self.mpContainer addGestureRecognizer:swipeDown]; 
} 

- (void)swipeDown:(UIGestureRecognizer *)gr { 
    [self minimizeMp:YES animated:YES]; 
} 

- (void)swipeUp:(UIGestureRecognizer *)gr { 
    [self minimizeMp:NO animated:YES]; 
} 

3) Và sau đó là một phương pháp để biết về trạng thái hiện tại và thay đổi trạng thái hiện tại.

- (BOOL)mpIsMinimized { 
    return self.tallMpContainer.frame.origin.y > 0; 
} 

- (void)minimizeMp:(BOOL)minimized animated:(BOOL)animated { 

    if ([self mpIsMinimized] == minimized) return; 

    CGRect tallContainerFrame, containerFrame; 
    CGFloat tallContainerAlpha; 

    if (minimized) { 
     CGFloat mpWidth = 160; 
     CGFloat mpHeight = 90; // 160:90 == 16:9 

     CGFloat x = 320-mpWidth; 
     CGFloat y = self.view.bounds.size.height - mpHeight; 

     tallContainerFrame = CGRectMake(x, y, 320, self.view.bounds.size.height); 
     containerFrame = CGRectMake(x, y, mpWidth, mpHeight); 
     tallContainerAlpha = 0.0; 

    } else { 
     tallContainerFrame = self.view.bounds; 
     containerFrame = CGRectMake(0, 0, 320, 180); 
     tallContainerAlpha = 1.0; 
    } 

    NSTimeInterval duration = (animated)? 0.5 : 0.0; 

    [UIView animateWithDuration:duration animations:^{ 
     self.tallMpContainer.frame = tallContainerFrame; 
     self.mpContainer.frame = containerFrame; 
     self.tallMpContainer.alpha = tallContainerAlpha; 
    }]; 
} 

tôi không thêm video vào dự án này, nhưng nó chỉ nên thả trong. Tận dụng tối mpContainer quan điểm mẹ của quan điểm của MPMoviePlayerController và nó sẽ trông khá mát mẻ.

Answer 2

Sử dụng TFSwipeShrink và tùy chỉnh mã cho dự án của bạn.

hy vọng sẽ giúp bạn.

Answer 3

Cập nhật khung hình mới FWDraggableSwipePlayer để kéo uiview như ứng dụng YouTube.

hy vọng sẽ giúp bạn.

Answer 4

Đây là phiên bản 3 nhanh cho câu trả lời @danh đã cung cấp trước đó.

https://stackoverflow.com/a/24107949/1211470

import UIKit 

class ViewController: UIViewController { 
    @IBOutlet weak var tallMpContainer: UIView! 
    @IBOutlet weak var mpContainer: UIView! 

    var swipeDown: UISwipeGestureRecognizer? 
    var swipeUp: UISwipeGestureRecognizer? 

    override func viewDidLoad() { 
     super.viewDidLoad() 
     swipeDown = UISwipeGestureRecognizer(target: self, action: #selector(swipeDownAction)) 

     swipeUp = UISwipeGestureRecognizer(target: self, action: #selector(swipeUpAction)) 

     swipeDown?.direction = .down 
     swipeUp?.direction = .up 

     self.mpContainer.addGestureRecognizer(swipeDown!) 
     self.mpContainer.addGestureRecognizer(swipeUp!) 
    } 

    @objc func swipeDownAction() { 
     minimizeWindow(minimized: true, animated: true) 
    } 

    @objc func swipeUpAction() { 
     minimizeWindow(minimized: false, animated: true) 
    } 

    func isMinimized() -> Bool { 
     return CGFloat((self.tallMpContainer?.frame.origin.y)!) > CGFloat(20) 
    } 

    func minimizeWindow(minimized: Bool, animated: Bool) { 
     if isMinimized() == minimized { 
      return 
     } 

     var tallContainerFrame: CGRect 
     var containerFrame: CGRect 

     var tallContainerAlpha: CGFloat 

     if minimized == true { 

      let mpWidth: CGFloat = 160 
      let mpHeight: CGFloat = 90 

      let x: CGFloat = 320-mpWidth 
      let y: CGFloat = self.view.bounds.size.height - mpHeight; 

      tallContainerFrame = CGRect(x: x, y: y, width: 320, height: self.view.bounds.size.height) 
      containerFrame = CGRect(x: x, y: y, width: mpWidth, height: mpHeight) 
      tallContainerAlpha = 0.0 

     } else { 

      tallContainerFrame = self.view.bounds 
      containerFrame = CGRect(x: 0, y: 0, width: 320, height: 180) 
      tallContainerAlpha = 1.0 

     } 

     let duration: TimeInterval = (animated) ? 0.5 : 0.0 
     UIView.animate(withDuration: duration, animations: { 
      self.tallMpContainer.frame = tallContainerFrame 
      self.mpContainer.frame = containerFrame 
      self.tallMpContainer.alpha = tallContainerAlpha 
     }) 
    } 

}