見出し画像

Bubble Transitionというライブラリを使ってみた

画面遷移をオシャレに行えるものです。

Github:


◉サンプル

こんな感じ

実装1:
画像のようにそれぞれボタンをテキトーに配置

実装2: 
"GO"ボタンがある方のコード全般

import UIKit
import BubbleTransition
class ViewController: UIViewController {
    
    @IBOutlet weak var someButton: UIButton!
    let transition = BubbleTransition()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        someButton.layer.cornerRadius = 20.0
    }
    
    public override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        let controller = segue.destination
        controller.transitioningDelegate = self
        controller.modalPresentationCapturesStatusBarAppearance = true
        controller.modalPresentationStyle = .custom
    }
    
    @IBAction func buttonAction(_ sender: Any) {
        performSegue(withIdentifier: "next", sender: nil)
    }
    
}
extension ViewController: UIViewControllerTransitioningDelegate {
    
    public func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        transition.transitionMode = .present
        transition.startingPoint = someButton.center
        transition.bubbleColor = someButton.backgroundColor!
        return transition
    }
    
    public func animationController(forDismissed dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        transition.transitionMode = .dismiss
        transition.startingPoint = someButton.center
        transition.bubbleColor = someButton.backgroundColor!
        return transition
    }
}


実装3: 
"BACK"ボタンがある方のコード全般

import UIKit
class NextViewController: UIViewController {
    
    @IBOutlet weak var back: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        back.layer.cornerRadius = 20.0
    }
    
    @IBAction func backAction(_ sender: Any) {
        dismiss(animated: true)
    }
    
}



以上です、是非参考にしてみてくださいー。

この記事が気に入ったらサポートをしてみませんか?