3

下記の画像のようにNavigationBarが共用されずに、遷移する方法を知りたいので、教えていただけると嬉しく思います。

普通に画面遷移するときは、以下のようなコードを書くと思います。

navigationController?.pushViewController(secondViewController, animated: true)

しかし、これではNavigationBarが共有されてしまうと思います。

よろしくお願いします。

アプリ画像

1 件の回答 1

0

私の知る限り一つのNavigation Controllerでは必ずNavigation Barを共有するので、以下のように新しいNavigation Controllerを作成して独自の遷移アニメーションでpresentして実現することになると思います。

まずUIViewControllerAnimatedTransitioningプロトコルに適合したAnimatorを実装します。このAnimatorでは遷移のアニメーションを記述します。(以下のコードではついでに遷移中に影もつけてます)

class Animator: NSObject, UIViewControllerAnimatedTransitioning {
    var presented = false

    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 1.0
    }

    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        let fromVC
                 = transitionContext.viewController(forKey: UITransitionContextViewControllerKey.from)
        let toVC = transitionContext.viewController(forKey: UITransitionContextViewControllerKey.to)

        if presented {
            dismissTransition(transitionContext: transitionContext, toView: toVC!.view, fromView: fromVC!.view)
        } else {
            presentTransition(transitionContext: transitionContext, toView: toVC!.view, fromView: fromVC!.view)
        }
    }

    func presentTransition(transitionContext: UIViewControllerContextTransitioning, toView: UIView, fromView: UIView) {
        let containerView = transitionContext.containerView
        containerView.insertSubview(toView, aboveSubview: fromView)
        toView.frame = toView.frame.offsetBy(dx: containerView.frame.width, dy: 0.0)
        addShadow(to: toView)

        UIView.animate(withDuration: transitionDuration(using: transitionContext), delay: 0.0, options: .curveEaseInOut, animations: {
            toView.frame = containerView.frame
        }) { finished in
            self.removeShadow(from: toView)
            self.presented = true
            transitionContext.completeTransition(true)
        }
    }

    func dismissTransition(transitionContext: UIViewControllerContextTransitioning, toView: UIView, fromView: UIView) {
        let containerView = transitionContext.containerView
        containerView.insertSubview(toView, belowSubview: fromView)
        toView.frame = containerView.bounds
        addShadow(to: fromView)

        UIView.animate(withDuration: transitionDuration(using: transitionContext), delay: 0.0, options: .curveEaseInOut, animations: {
            fromView.frame = fromView.frame.offsetBy(dx: containerView.frame.width, dy: 0.0)
        }) { finished in
            self.removeShadow(from: fromView)
            self.presented = false
            transitionContext.completeTransition(true)
        }
    }

    func addShadow(to view: UIView) {
        view.layer.shadowColor = UIColor.black.cgColor
        view.layer.shadowOpacity = 0.2
        view.layer.shadowOffset = CGSize(width: -5.0, height: 0.0)
        view.layer.shadowPath = UIBezierPath(rect: view.bounds).cgPath
        view.layer.shouldRasterize = true
        view.layer.rasterizationScale = UIScreen.main.scale
    }

    func removeShadow(from view: UIView) {
        view.layer.shadowPath = .none
        view.layer.shadowColor = .none
        view.layer.shadowOpacity = 0.0
    }
}

次にコントローラをUIViewControllerTransitioningDelegateに適合させAnimatorを返すようにします。さらに、遷移コードを実装します。遷移は、次に表示するコントローラを新しいNavigation Controllerに載せ、そのNavigation Controllerをpresentしています。(このコードではボタンをタップしたら遷移するようにIBActionとして記述しています。)

class FirstViewController: UIViewController, UIViewControllerTransitioningDelegate {
    let animator = Animator()

    @IBAction func buttonTapped(_ sender: Any) {
        let controller    = SecondViewController(nibName: .none, bundle: .none)
        let navController = UINavigationController(rootViewController: controller)
        navController.transitioningDelegate = self
        present(navController, animated: true)
    }

    func animationController(forPresented presented: UIViewController,
                             presenting: UIViewController,
                             source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        return animator
    }

    func animationController(forDismissed dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        return animator
    }
}

上に載せたコントローラからもとのコントローラに戻る時は、dismissメソッドを実行します。

dismiss(animated: true)

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。