Custom interactive transition like Apple Music iOS App (iOS 9). written in Swift.

Overview

MusicPlayerTransition

Swift 5.0 Platforms iOS Xcode 10.2+

capture

Custom interactive transition like Apple Music iOS App. written in Swift.

Demo

See demo on Appetize.io

Using Transition Animator

This sample have created as a showcase of ARNTransitionAnimator.

ARNTransitionAnimator

Requirements

  • iOS 10.0+
  • Swift 5.0+
  • Xcode 10.2+
  • CocoaPods 1.6.1+

License

MIT license. See the LICENSE file for more info.

New Version

Please check new transition!

MusicAppTransition

new_capture

Comments
  • Trouble when ModalView has a clear background

    Trouble when ModalView has a clear background

    When the presenting modalview has a clear background, i get a black screen because self!.view.removeFromSuperview() gets called

    I cant seem to figure a way around this...

    opened by hsavit1 6
  • UITransitionView not removed

    UITransitionView not removed

    While playing around with the demo app, there is a very strange bug where UITransitionView was not removed and it freezes all user action: Steps to reproduce

    1. swipe up and down or swipe up MiniPlayerView and release finger without letting to present ModalViewController
    2. Continue step 1 for n times until the screen is freeze

    Here is the print log before freezing the app

    ViewController viewWillAppear ModalViewController viewWillDisappear ModalViewController viewWillAppear MusicPlayerTransitionAnimation willAnimation(_ transitionType: TransitionType, containerView: UIView) ViewController viewWillAppear screen shot 2018-08-01 at 6 07 50 pm

    opened by AppinessVashum 3
  • missing appearance function call at ViewController

    missing appearance function call at ViewController

    ViewController should call

                self!.beginAppearanceTransition(false, animated:true)
                self!.endAppearanceTransition()
    

    at appropriate location. otherwise, the ViewController's viewWillDisappear, viewDidDisappear, viewWillAppear, viewDidAppear, will not be called when ModalViewController being presented or dismissed.

            self.animator.presentationBeforeHandler = { [weak self] (containerView: UIView, transitionContext:
                UIViewControllerContextTransitioning) in
                self!.beginAppearanceTransition(false, animated:true) //added
                ...
               self!.animator.presentationCompletionHandler = {(containerView: UIView, completeTransition: Bool) in
                    if completeTransition {
                        self!.view.removeFromSuperview()
                        self!.modalVC.view.removeFromSuperview()
                        containerView.addSubview(self!.modalVC.view)
                        self!.animator.interactiveType = .Dismiss
                        self!.animator.gestureTargetView = self!.playerVC.backgroundView
                        self!.animator.direction = .Bottom
                        self!.endAppearanceTransition() //added
                    } else {
                        UIApplication.sharedApplication().keyWindow!.addSubview(self!.view)
                        self!.beginAppearanceTransition(true, animated: false) //added
                        self!.endAppearanceTransition() //added
                    }
                }
                }
    
     self!.beginAppearanceTransition(true, animated:true) //added
    
                self!.animator.dismissalCancelAnimationHandler = { (containerView: UIView) in
               ...
    
                self!.animator.dismissalCompletionHandler = { (containerView: UIView, completeTransition: Bool) in
                    if completeTransition {
                        self!.modalVC.view.removeFromSuperview()
                        self!.animator.gestureTargetView = self!.tabBarPalettle
                        self!.animator.interactiveType = .Present
                        UIApplication.sharedApplication().keyWindow!.addSubview(self!.view)
                        self!.endAppearanceTransition() // added
                    } else {
                        self!.beginAppearanceTransition(false, animated: false) //added
                        self!.endAppearanceTransition() //added
                    }
                }
    
    opened by frogcjn 3
  • How to use it ?

    How to use it ?

    Hi , I need to use this library but it make me confuse , I can't find enough information about how to use it , like how others libraries does in README.md file . README.md doesn't contents enough information. Could you please update it ?

    opened by X901 2
  • Demo showing the usage of blur effect with this custom transition

    Demo showing the usage of blur effect with this custom transition

    In response of the issue "Trouble when ModalView has a clear background #4", I made a demo using the same music player transition, but adding blur effect to the modal view.

    opened by mehdi-shiba 2
  • Swift 3 example

    Swift 3 example

    Hi i have used my code as follows in swift 2.3 but after update it to 3.0 i can not find any methods and its giving me lots of errors can you give me a sample code ?

    func setupAnimator() {
            
            self.animator = ARNTransitionAnimator(operationType: .Present, fromVC: self, toVC: self.musicPlayerVC)
        
            self.animator.usingSpringWithDamping = 0.8
            self.animator.gestureTargetView = self.musicPlayerViewSmall
            self.animator.interactiveType = .Present
            
            // Present
            self.animator.presentationBeforeHandler = { [unowned self] containerView, transitionContext in
                print("start presentation")
                self.beginAppearanceTransition(false, animated: false)
                
                self.animator.direction = .Top
                
                self.musicPlayerVC.view.frame.origin.y = self.musicPlayerViewSmall.frame.origin.y + self.musicPlayerViewSmall.frame.size.height
                self.view.insertSubview(self.musicPlayerVC.view ,atIndex: 1)
                
                self.view.layoutIfNeeded()
                self.musicPlayerVC.view.layoutIfNeeded()
                
                // miniPlayerView
                let startOriginY = self.musicPlayerViewSmall.frame.origin.y
                let endOriginY = -self.musicPlayerViewSmall.frame.size.height
                let diff = -endOriginY + startOriginY
                // tabBar
                
                
                self.animator.presentationCancelAnimationHandler = { containerView in
                    self.musicPlayerViewSmall.frame.origin.y = startOriginY
                    self.musicPlayerVC.view.frame.origin.y = self.musicPlayerViewSmall.frame.origin.y + self.musicPlayerViewSmall.frame.size.height
                    
                    self.contrainerView.alpha = 1.0
                    
                    self.musicPlayerViewSmall.alpha = 1.0
                    for subview in self.musicPlayerViewSmall.subviews {
                        subview.alpha = 1.0
                    }
                }
                
                self.animator.presentationAnimationHandler = { [unowned self] containerView, percentComplete in
                    let _percentComplete = percentComplete >= 0 ? percentComplete : 0
                    self.musicPlayerViewSmall.frame.origin.y = startOriginY - (diff * _percentComplete)
                    if self.musicPlayerViewSmall.frame.origin.y < endOriginY {
                        self.musicPlayerViewSmall.frame.origin.y = endOriginY
                    }
                    self.musicPlayerVC.view.frame.origin.y = self.musicPlayerViewSmall.frame.origin.y + self.musicPlayerViewSmall.frame.size.height
                    
                    
                    let alpha = 1.0 - (1.0 * _percentComplete)
                    self.contrainerView.alpha = alpha + 0.5
                    
                    for subview in self.musicPlayerViewSmall.subviews {
                        subview.alpha = alpha
                    }
                }
                
                self.animator.presentationCompletionHandler = { containerView, completeTransition in
                    self.endAppearanceTransition()
                    
                    if completeTransition {
                        self.musicPlayerViewSmall.alpha = 0.0
                        self.musicPlayerVC.view.removeFromSuperview()
                        containerView.addSubview(self.musicPlayerVC.view)
                        self.animator.interactiveType = .Dismiss
                        self.animator.gestureTargetView = self.musicPlayerVC.view
                        self.animator.direction = .Bottom
                    } else {
                        self.beginAppearanceTransition(true, animated: false)
                        self.endAppearanceTransition()
                    }
                }
            }
            
            // Dismiss
            
            self.animator.dismissalBeforeHandler = { [unowned self] containerView, transitionContext in
                print("start dismissal")
                self.beginAppearanceTransition(true, animated: false)
                
                self.view.insertSubview(self.musicPlayerVC.view, atIndex: 1)
                
                self.view.layoutIfNeeded()
                self.musicPlayerVC.view.layoutIfNeeded()
                
                // miniPlayerView
                let startOriginY = 0 - self.musicPlayerViewSmall.bounds.size.height
                let endOriginY = self.contrainerView.bounds.size.height - self.musicPlayerViewSmall.frame.size.height
                let diff = -startOriginY + endOriginY
                
                self.contrainerView.alpha = 0.5
                
                self.animator.dismissalCancelAnimationHandler = { containerView in
                    self.musicPlayerViewSmall.frame.origin.y = startOriginY
                    self.musicPlayerVC.view.frame.origin.y = self.musicPlayerViewSmall.frame.origin.y + self.musicPlayerViewSmall.frame.size.height
                    
                    self.contrainerView.alpha = 0.5
                    
                    self.musicPlayerViewSmall.alpha = 0.0
                    for subview in self.musicPlayerViewSmall.subviews {
                        subview.alpha = 0.0
                    }
                }
                
                self.animator.dismissalAnimationHandler = { containerView, percentComplete in
                    let _percentComplete = percentComplete >= -0.05 ? percentComplete : -0.05
                    self.musicPlayerViewSmall.frame.origin.y = startOriginY + (diff * _percentComplete)
                    self.musicPlayerVC.view.frame.origin.y = self.musicPlayerViewSmall.frame.origin.y + self.musicPlayerViewSmall.frame.size.height
                    
                    
                    let alpha = 1.0 * _percentComplete
                    self.contrainerView.alpha = alpha + 0.5
                    
                    self.musicPlayerViewSmall.alpha = 1.0
                    for subview in self.musicPlayerViewSmall.subviews {
                        subview.alpha = alpha
                    }
                }
                
                self.animator.dismissalCompletionHandler = { containerView, completeTransition in
                    self.endAppearanceTransition()
                    
                    if completeTransition {
                        self.musicPlayerVC.view.removeFromSuperview()
                        self.animator.gestureTargetView = self.musicPlayerViewSmall
                        self.animator.interactiveType = .Present
                    } else {
                        self.musicPlayerVC.view.removeFromSuperview()
                        containerView.addSubview(self.musicPlayerVC.view)
                        self.beginAppearanceTransition(false, animated: false)
                        self.endAppearanceTransition()
                    }
                }
            }
            
            self.musicPlayerVC.transitioningDelegate = self.animator
        }
    
    opened by kamalupasena 1
  • UI Problems

    UI Problems

    When I place on the music player screen controls like play.. next, previous and so on.. they disappearing when I taped on the mini player. The problem exist only when navigationbarcontroller is present. What is going on?

    opened by yarodevuci 1
  • Installation section

    Installation section

    Hey, your library is really interesting.

    The only problem I found was the README.md, which lacks an Installation Section I created this iOS Open source Readme Template so you can take a look on how to easily create an Installation Section If you want, I can help you to organize the lib.

    What are your thoughts? 😄

    opened by lfarah 1
  • What if I don't have a tab bar? [need help]

    What if I don't have a tab bar? [need help]

    Hi, this is freakin awesome, compared to the LNTransitionController or something. This is easy to use, however, I wanna know how to implement the animator if I do not have a tab bar? Thanks!

    opened by glennposadas 1
  • modalPresentationStyle should be .FullScreen

    modalPresentationStyle should be .FullScreen

    Since there is no custom UIPresentationController, then the ModalViewController's modalPresentationStyle should be .FullScreen.

    There are two different level of custom presentation.

    1. custom animator only https://developer.apple.com/library/ios/featuredarticles/ViewControllerPGforiPhoneOS/CustomizingtheTransitionAnimations.html#//apple_ref/doc/uid/TP40007457-CH16-SW1
    2. custom UIPresentationController, which manage all staff about presentation (including the dimming View) https://developer.apple.com/library/ios/featuredarticles/ViewControllerPGforiPhoneOS/DefiningCustomPresentations.html#//apple_ref/doc/uid/TP40007457-CH25-SW1

    since the musicPlayerTransition do not need custom UIPresentationController, the the ModalViewController's should be .FullScreen, and system will call viewWillAppear, viewDidAppear, viewDidDisappear, viewWillDisappear automatically.

    opened by frogcjn 1
  • Propose Logo/Icon

    Propose Logo/Icon

    Hi @xxxAIRINxxx .. I'm a graphic designer. I wanted to contribute to your project and I've designed a logo for your project. If you like it, you can use it. it's free. I'll send you files and pr. is there anything you want to change please let me know. waiting for your feedback. Best Regard Mirza Zulfan mpt

    opened by mirzazulfan 0
  • swipe to dismiss not working

    swipe to dismiss not working

    First it was not presenting properly. then i replaced pod file with yours then presenting started working. Now, problem is swipe to dismiss is not working. I tried to copy your exact code and controller too. I don't seem to find the problem. Please help to solve I am working with xcode-9 and swift 4 Error while dismiss- Unbalanced calls to begin/end appearance transitions for

    opened by gopal1807 0
  • Bottom View overlaps tab bar in iPhone X simulator.

    Bottom View overlaps tab bar in iPhone X simulator.

    Hi ,

    I'm working on a issue when i run this test in iPhone X simulator where the bottom view overlaps the tabbar view. Is there any fix available ?

    Thanks in Advance.!!

    opened by shubhankarbhavsar 0
  • Exc_Bad_Access(code=2) Error and app crash

    Exc_Bad_Access(code=2) Error and app crash

    Add a view controller before tab bar view and navigate to tab bar view controller on button click then application crash showing Exc_Bad_Access error in MusicPlayerTransitionAnimation line no 119 where self.modalVC.view.removeFromSuperview() method call (when we slide up the view).

    Only add a view controller and navigate on button click app get crash whileslide up the view. Below is the screen shot of the storyboard and where its crash

    (When we tap the song title bar then crash the application in TransitionAnimator line no 42)

    screen shot 2017-07-07 at 12 00 07 am

    screen shot 2017-07-06 at 11 55 05 pm

    opened by diwakargarg88 1
  • Unbalanced calls to begin/end appearance transitions for

    Unbalanced calls to begin/end appearance transitions for

    Hi, when I do the music player transition and I close it, the collection view or the table view segue said this: unbalanced calls to begin/end appearance transitions for. I search it in google and this is cause when you try and display a new viewcontroller before the current view controller is finished displaying. I revised all my code and only happens when I show the player from the miniplayer and I close it. So when I show again the mini player and close it and I try to do a segue on the table to another viewcontroller who has a table it happens again. Can you solve it?

    opened by ConnorMusic 0
  • Bad frame on orientation change

    Bad frame on orientation change

    Hi!

    I just found out that when modifying the test app for handling multiple orientations the framework doesn't work quite well. The size of the transition container view is different from the main view.

    The steps to reproduce the issue are:

    • Swiping up the LineView
    • Swiping down
    • Changing the orientation
    • Swiping up again

    Is there any quick way to fix it? Thanks!

    opened by ivanornes 0
Owner
Airin
iOS 📱 Android 🍭 Flutter 🍢 React.js 💎
Airin
🌊 - Jelly is a library for animated, non-interactive & interactive viewcontroller transitions and presentations with the focus on a simple and yet flexible API.

Jelly is a library for animated, non-interactive & interactive viewcontroller transitions and presentations with the focus on a simple and yet flexibl

Sebastian Boldt 2.4k Dec 25, 2022
Now playing controller from Apple Music, Mail & Podcasts Apple's apps.

SPStorkController About Controller as in Apple Music, Podcasts and Mail apps. Help if you need customize height or suppport modal style in iOS 12. Sim

Ivan Vorobei 2.6k Jan 4, 2023
SPLarkController - Custom transition between controllers. Settings controller for your iOS app.

SPLarkController About Transition between controllers to top. You can change animatable height after presentation controller. For presentation and dis

Ivan Vorobei 965 Dec 17, 2022
A custom modal transition that presents and dismiss a controller with an expanding bubble effect.

A custom modal transition that presents and dismiss a controller inside an expanding and shrinking bubble. Screenshot Usage Install through CocoaPods:

Andrea Mazzini 3.3k Dec 28, 2022
A simple way to create custom interactive UIViewController transitions

EasyTransitions is a library that helps developers create custom interactive transitions using simple functions defined in a protocol and avoid handli

Marcos Griselli 1.6k Jan 1, 2023
Easy interactive interruptible custom ViewController transitions

Introduction Transition is a library that helps you build iOS view controller transitions. Implementing a nice interactive custom view controller tran

Touchwonders 2.6k Dec 20, 2022
This is a Swift based demo project to show how to make the transition Pinterest liked.

PinterestSwift Compatible with Xcode 11 / Swift 5.0 This is a Swift based demo project to show how to make the transition Pinterest 2.0+ liked. Refer

Nicholas Tau 1.9k Dec 20, 2022
Elegant transition library for iOS & tvOS

Hero is a library for building iOS view controller transitions. It provides a declarative layer on top of the UIKit's cumbersome transition APIs—makin

Hero Transitions 21.2k Jan 3, 2023
This component implements transition animation to crumble view-controller into tiny pieces.

StarWars Animation This component implements transition animation to crumble view-controller into tiny pieces. Check this project on dribbble. Also, r

Yalantis 3.7k Dec 29, 2022
Simple and elegant Dropdown Transition

Simple and elegant dropdown transition for iOS Why? I needed to perform the dropdown transition in the app I was building and I've found many great li

Aidar Nugmanoff 63 Sep 22, 2022
Painless custom transitioning. Easy extend, easy setup, just focus on animations.

TransitionManager Painless custom transitioning. Easy extend, easy setup, just focus on animations. Installation CocoaPods You can use CocoaPods to in

Cem Olcay 205 Aug 23, 2022
Awesome iOS 11 appstore cards in swift 5.

Cards brings to Xcode the card views seen in the new iOS XI Appstore. Getting Started Storyboard Go to main.storyboard and add a blank UIView Open the

Paolo Cuscela 4.1k Dec 14, 2022
SamuraiTransition is an open source Swift based library providing a collection of ViewController transitions featuring a number of neat “cutting” animations.

SamuraiTransiton is a ViewController transition framework in Swift. It is an animation as if Samurai cut out the screen with a sword. transition types

hachinobu 273 Dec 29, 2022
Custom-Transition - A repo about custom transition between two view controllers

Custom-Transition in SWIFT This is a repo about custom transition between two vi

Prakash Chandra Awal 0 Jan 6, 2022
Swift-music - swift-music is a swift package that provides an easy-to-use API for music related developments.

?? swift-music Introduction swift-music is a swift package that provides an easy-to-use API for music related developments. Currently available module

Jin Zhang 4 Feb 8, 2022
A pure Swift Spotify Music App in Apple Music style

HBMusic A pure Swift Spotify Music App in Apple Music style. How to run pod inst

haoboxuxu 6 Dec 29, 2021
Classical music front-end for Apple Music: iOS app

concertino_ios Concertino is a classical music front-end for Apple Music. It's splitted in several projects. This one provides only the iOS app. (Ther

Open Opus 107 Dec 22, 2022
A library to recreate the iOS Apple Music now playing transition

DeckTransition DeckTransition is an attempt to recreate the card-like transition found in the iOS 10 Apple Music and iMessage apps. Hereʼs a GIF showi

Harshil Shah 2.2k Dec 15, 2022
Interactive view transition to display menus with flowing and bouncing effects in Swift

FlowingMenu FlowingMenu provides an interactive transition manager to display menu with a flowing and bouncing effects. The Objective-C countepart is

Yannick Loriot 975 Dec 21, 2022
🌊 - Jelly is a library for animated, non-interactive & interactive viewcontroller transitions and presentations with the focus on a simple and yet flexible API.

Jelly is a library for animated, non-interactive & interactive viewcontroller transitions and presentations with the focus on a simple and yet flexibl

Sebastian Boldt 2.4k Dec 25, 2022