Demo App for Picture-in-Picture of Arbitrary UIView in iOS

Related tags

Layout UIPiPDemo
Overview

> 日本語

UIPiPDemo

This is a demo app for displaying an arbitrary UIView in iOS using picture-in-picture. It can be used to display information that changes in real time (e.g. stock prices) in a PiP so that you can check it while other apps are running. I hope you'll use this sample to implement some interesting ideas!

How to use

Load it in Xcode and run the build for ACTUAL DEVICES. Launch the app and start Start PiP to play the video showing the current time in PiP. The video will continue to play even if the app is put back in the background.

Implementation

A new AVPictureInPictureController.ContentSource has been added since iOS15. (Official Link) This allows you to use the PiP video source This allows us to handle AVSampleBufferDisplayLayer as a PiP video source, and also provides a callback function, which greatly expands the range of things we can express with PiP. For example, UIView, which is the basic View class when written in UIKit, can now be easily displayed in PiP almost as is.

In this sample repository, UIView is converted to UIImage, then to CMSampleBuffer, and then to AVSampleBufferDisplayLayer by enque. In this repository, the current time is displayed for UILabel.

Class structure

  • VideoProvider.swift
    • A class that holds an AVSampleBufferDisplayLayer and provides a video.
    • This class is used to convert the UILabel into a video source.
  • ViewController.swift
    • Class that holds the start button for PiP and AVSampleBufferDisplayLayer with addSubview.
    • This class implements PiP by following the documentation of the official page almost directly. PiP implementation.

Notes.

I don't know much about AVKit and AVFoundation, so this may be a useless implementation. In particular, the conversion from UIImage to CMSampleBuffer is done once via Data (jpeg), so I would be very happy if you could optimize that.

If there's a positive response, I'm thinking of providing a library like PiPView that inherits from UIView, that can also be used as a UIView, and when you hit the API, it will PiP the contents.

Since the contents of the UIView will be displayed when you enque the AVSampleBufferDisplayLayer, you will need to enque it periodically, and the drawing cost will be quite large. Be careful when performing animation. In this repository, drawing is performed every 0.3 seconds.

Reference

  • Delivery Comment Bar - New PiP experience in iOS15
    • This is the article that motivated me to create this. Thanks for the great discovery.
  • bricklife/ImagePipDemo
    • This is the repository where this idea was implemented when PiP was first released.
    • It was possible to implement this idea before iOS15 API was released.
  • jazzychad/PiPBugDemo
    • A repository that reports on PiP behavior on tvOS macOS.
    • This repository is playing multiple images in sequence with PiP.
    • I've used the implementation quite a bit as a reference.

Author.

Twitter: @uakihir0

If you have any questions, please contact the above account or raise an issue.

License

MIT

You might also like...
Demo project that searches repositories on GitHub and displays details

LookGitUp A test project that queries GitHub and lists the repositories with their name, stars, creation date, user details and user's avatar. Technic

A Demo for Shimmer Effect with two methods
A Demo for Shimmer Effect with two methods

ShimmerDemo A Demo for Shimmer Effect with two methods Use Blend Mode + CAGradie

VidyoPlatform Basic CustomLayouts Reference App for iOS (Swift)VidyoPlatform Basic CustomLayouts Reference App for iOS (Swift)

VidyoPlatform Basic CustomLayouts Reference App for iOS (Swift) VidyoPlatform reference application highlighting how to integrate video chat into a na

IOS-PokemonQuizApp - Assignment to make a responsive iOS app. App has to connect with an external API

iOS-PokemonQuizApp Assignment to make a responsive iOS app. App has to connect with an external API. The Project The idea of the project is to make a

Ios-quizzer - The app implements basic features of a quiz app using MVC pattern
Ios-quizzer - The app implements basic features of a quiz app using MVC pattern

Quizzer App The app implements basic features of a quiz app using MVC pattern.

WHAT WILL YOU LEARN? Onboarding Screen with Page Tab View, state of the app with the new App Storage

WHAT WILL YOU LEARN? Onboarding Screen with Page Tab View, state of the app with the new App Storage Onboarding or a Home screen Understand how the new App Life Cycle works Link View 
 Group Box View Disclosure View Dynamically List View with a loop

Flixtor-iOS - iOS streaming app inspired by Netflix that allows you to watch any film and series
Flixtor-iOS - iOS streaming app inspired by Netflix that allows you to watch any film and series

Flixtor-iOS iOS streaming app inspired by Netflix that allows you to watch any f

Repository for the dgca verifier iOS app.

EU Digital COVID Certificate Verifier App - iOS About • Development • Documentation • Support • Contribute • Contributors • Licensing About This repos

iOS App that helps you breath properly.
iOS App that helps you breath properly.

Breathing App iOS App that helps you breath properly. I created this iOS app in my Intro to iOS Develepmont class at Hunter College. I am not a profes

Owner
Akihiro Urushihara
Swift/Kotlin/Java Programmer
Akihiro Urushihara
App in Swift that shows a picture of an astronomical phenomenon and a brief explanation of it everyday, allowing you to save that data or share it on a social network.

DailyUniverse ??‍♂️ ?? App under construction iOS App that shows a picture of an astronomical phenomenon and a brief explanation of it everyday. Daily

Pedro Muniz 5 Nov 3, 2022
(Swift) iOS UIView layout reimagined

<UIViewprint/> iOS view layout completely reimagined Blueprint /ˈbluːˌprɪnt/ : a detailed outline or plan of action: a blueprint for success. class Vi

Alex Winston 8 Aug 26, 2022
Powerful autolayout framework, that can manage UIView(NSView), CALayer and not rendered views. Not Apple Autolayout wrapper. Provides placeholders. Linux support.

CGLayout Powerful autolayout framework, that can manage UIView(NSView), CALayer and not rendered views. Has cross-hierarchy coordinate space. Implemen

Koryttsev Denis 45 Jun 28, 2022
UIView extension that adds dragging capabilities

YiViewDrag Installation YiViewDrag is available through CocoaPods. To install it, simply add the following line to your Podfile: pod 'YiViewDrag' Usag

coderyi 1 Jan 20, 2022
UIView category which makes it easy to create layout constraints in code

FLKAutoLayout FLKAutoLayout is a collection of categories on UIView which makes it easy to setup layout constraints in code. FLKAutoLayout creates sim

Florian Kugler 1.5k Nov 24, 2022
FlightLayout is a light weight, and easy to learn layout framework as an extension of the UIView.

FlightLayout Introduction FlightLayout is a light weight, and easy to learn layout framework as an extension of the UIView. Functionally, it lives som

Anton 23 Apr 21, 2022
This library allows you to make any UIView tap-able like a UIButton.

UIView-TapListnerCallback Example To run the example project, clone the repo, and run pod install from the Example directory first. Installation UIVie

wajeehulhassan 8 May 13, 2022
UIView based progress bar that shows a progress based on duration in seconds

DurationProgressBar Create a progress bar based on a duration in seconds. The view is fully customisable. Install Add this repository to your swift pa

Cem Olcay 2 May 21, 2022
A tiny category on UIView that allows you to set one property: "parallaxIntensity" to achieve a parallax effect with UIMotionEffect

NGAParallaxMotion A tiny category on UIView that allows you to set one property: parallaxIntensity to achieve a parallax effect with UIMotionEffect. S

Michael Bishop 650 Sep 26, 2022
Using Kiva's free API, the demo app retrieves its most recent fundraising loans

KivaLoan Kiva is a non-profit organization with a mission to connect people through lending to alleviate poverty. Using Kiva's free API, the demo app

DaryliOSdev 0 Nov 28, 2021