IOS YouTube Mini Player Emulation
In the YouTube app, I can continue watching the video using the mini-player in the lower right corner (see the video titled "The Chainsmokers"), which overlays on top of all other view controllers as I navigate the app screen. No matter which page I am on, I can watch the video in the mini-player.
If you drag with the mouse from the mini-player, the entire video view screen appears. But it is always on top of other pages. I am trying to figure out how to copy this method using Swift so that I can watch videos from any page.
The way to structure my application is via UIPageViewController
. I am implementing three unique navigation controllers (for navigation use (see code below)). I want to understand how to use the mini player. Does it look like a mini VC mod on YouTube? How is this structured and if you know how can I incorporate this into my current layout?
class PageViewController: UIPageViewController, UIPageViewControllerDataSource, UIPageViewControllerDelegate {
private var pages: [UINavigationController]!
private var currentPageIndex: Int!
override func viewDidLoad() {
super.viewDidLoad()
self.dataSource = self
self.delegate = self
self.pages = [
self.storyboard!.instantiateViewControllerWithIdentifier("Nav1") as! UINavigationController,
self.storyboard!.instantiateViewControllerWithIdentifier("Nav2") as! UINavigationController,
self.storyboard!.instantiateViewControllerWithIdentifier("Nav3") as! UINavigationController
]
(self.pages[0].topViewController as! Nav1).parentPageViewController = self
(self.pages[1].topViewController as! Nav2).parentPageViewController = self
(self.pages[2].topViewController as! Nav3).parentPageViewController = self
self.currentPageIndex = 1
let startingViewController = self.pages[1] as UINavigationController
self.setViewControllers([startingViewController], direction: .Forward, animated: false, completion: nil)
}
func pageViewController(pageViewController: UIPageViewController, viewControllerAfterViewController viewController: UIViewController) -> UIViewController? {
let index = (self.pages as NSArray).indexOfObject(viewController)
self.currentPageIndex = index
// if currently displaying last view controller, return nil to indicate that there is no next view controller
return (self.currentPageIndex == self.pages.count - 1 ? nil : self.pages[self.currentPageIndex + 1])
}
func pageViewController(pageViewController: UIPageViewController, viewControllerBeforeViewController viewController: UIViewController) -> UIViewController? {
let index = (self.pages as NSArray).indexOfObject(viewController)
self.currentPageIndex = index
// if currently displaying first view controller, return nil to indicate that there is no previous view controller
return (index == 0 ? nil : self.pages[index - 1])
}
func displayPageForIndex(index: Int, animated: Bool = true) {
assert(index >= 0 && index < self.pages.count, "Error: Attempting to display a page for an out of bounds index")
// nop if index == self.currentPageIndex
if self.currentPageIndex == index { return }
if index < self.currentPageIndex {
self.setViewControllers([self.pages[index]], direction: .Reverse, animated: true, completion: nil)
} else if index > self.currentPageIndex {
self.setViewControllers([self.pages[index]], direction: .Forward, animated: true, completion: nil)
}
self.currentPageIndex = index
}
}
source to share
It's pretty easy to do this. You'll subclass UIWindow, add a mini-player view, and make sure it's always at the top of the view hierarchy. First in AppDelegate
add this code to overwrite your window:
/*!
* Subclassing UIWindow
*/
-(UIWindow *)window
{
static YourWindow *customWindow = nil;
if (!customWindow) customWindow = [[YourWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
return customWindow;
}
And now in the class YourWindow
add miniPlayer
:
-(void)awakeFromNib
{
[self addMiniPlayer];
}
-(void)addMiniPlayer
{
UIView *miniPlayer = [[UIView alloc] initWithFrame:CGRectMake(0,0,100,100)]; //change to your frame here
[self addSubview:miniPlayer];
miniPlayer.backgroundColor = [UIColor redColor];
self.miniPlayer = miniPlayer;
}
-(void)layoutSubviews
{
[super layoutSubviews];
[self bringSubviewToFront:self.miniPlayer];
// You would like to update your miniplayer frame here.
//CGRect frame = self.miniPlayer.frame;
//frame.origin.x = self.frame.size.width - frame.size.width - 5;
//frame.origin.y = 70;
//self.appInfoLabel.frame = frame;
}
Now your task is to customize the behavior miniPlayer
. You can access it from AppDelegate
something like this:self.window.miniPlayer
UPDATED: Here's an example written by Swift: https://github.com/sahara108/TestCustomWindow
source to share