UIViewController 전환 애니메이션: 화면 전환 효과 추가

작성일 :

UIViewController 전환 애니메이션: 화면 전환 효과 추가

iOS 앱 개발에서 UIViewController 간 전환은 매우 흔한 작업입니다. 기본적으로 iOS는 몇 가지 표준 전환 애니메이션을 제공합니다. 그러나 사용자 경험을 극대화하기 위해 사용자 정의 전환 애니메이션을 추가하는 것은 매우 유용합니다. 이 글에서는 Swift를 사용하여 기본 전환 애니메이션을 설정하는 방법부터 사용자 정의 전환 애니메이션을 적용하는 방법까지 단계별로 설명하겠습니다.

기본 전환 애니메이션 설정하기

기본적으로 iOS는 UINavigationControllerUITabBarController에서 전환 애니메이션을 지원합니다. 이 기본 애니메이션은 UINavigationControllerpushViewControllerpopViewController, UITabBarControllerselectedIndex 변경으로도 적용됩니다.

예를 들어 UINavigationController를 사용하여 다음 뷰 컨트롤러로 이동하는 코드는 다음과 같습니다:

swift
let nextViewController = NextViewController()
navigationController?.pushViewController(nextViewController, animated: true)

이 코드에서 animated 파라미터를 true로 설정하면 기본 push 애니메이션을 사용하게 됩니다. 반대로 animatedfalse로 설정하면 전환 애니메이션이 없습니다.

사용자 정의 전환 애니메이션 설정하기

기본 제공 애니메이션으로 충분하지 않을 때도 있습니다. 이 경우, 사용자 정의 전환 애니메이션을 사용하여 더 멋진 효과를 추가할 수 있습니다. UIViewControllerAnimatedTransitioning 프로토콜과 UIViewControllerTransitioningDelegate 프로토콜을 사용하여 커스텀 전환 애니메이션을 구현할 수 있습니다.

UIViewControllerAnimatedTransitioning 프로토콜

이 프로토콜은 애니메이션의 실제 논리를 정의하는 데 사용됩니다. 이 프로토콜은 다음 두 가지 필수 메서드를 포함합니다:

  1. transitionDuration(using:): 애니메이션의 지속 시간을 반환합니다.
  2. animateTransition(using:): 실제 애니메이션을 수행합니다.

다음은 사용자 정의 전환 애니메이션을 구현한 예입니다:

swift
class CustomTransitionAnimator: NSObject, UIViewControllerAnimatedTransitioning {
    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 0.5
    }

    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        guard let fromView = transitionContext.view(forKey: .from),
              let toView = transitionContext.view(forKey: .to) else {
            return
        }

        let containerView = transitionContext.containerView
        containerView.addSubview(toView)

        toView.alpha = 0.0
        UIView.animate(withDuration: transitionDuration(using: transitionContext),
                       animations: {
                           toView.alpha = 1.0
                           fromView.alpha = 0.0
                       },
                       completion: { _ in
                           fromView.alpha = 1.0
                           transitionContext.completeTransition(true)
                       })
    }
}

UIViewControllerTransitioningDelegate 프로토콜

UIViewControllerTransitioningDelegate 프로토콜은 뷰 컨트롤러가 전환 애니메이션을 어떻게 사용할지 정의할 수 있게 해줍니다. 다음과 같은 메서드를 포함합니다:

  1. animationController(forPresented:presenting:source:): 프레젠테이션 전환 애니메이션을 반환합니다.
  2. animationController(forDismissed:): 디스미스 전환 애니메이션을 반환합니다.

다음은 UIViewControllerTransitioningDelegate 프로토콜을 구현한 예입니다:

swift
class CustomTransitioningDelegate: NSObject, UIViewControllerTransitioningDelegate {
    func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        return CustomTransitionAnimator()
    }

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

사용자 정의 전환 애니메이션 적용하기

이제 사용자 정의 애니메이션과 델리게이트를 준비했으므로 실제로 뷰 컨트롤러 전환에 이를 적용해봅시다. 다음은 이를 사용하는 방법입니다:

swift
let customTransitioningDelegate = CustomTransitioningDelegate()

let viewControllerToPresent = NextViewController()
viewControllerToPresent.modalPresentationStyle = .custom
viewControllerToPresent.transitioningDelegate = customTransitioningDelegate

present(viewControllerToPresent, animated: true, completion: nil)

이제 NextViewController를 프레젠트할 때 사용자 정의 애니메이션이 적용됩니다.

결론

iOS 앱 개발에서 UIViewController 전환에 사용자 정의 애니메이션을 추가하면 사용자 경험을 더욱 향상시킬 수 있습니다. 기본 전환 애니메이션을 사용해도 좋지만, 때로는 앱의 독특한 디자인 요구를 충족시키기 위해 사용자 정의 애니메이션이 필요할 때가 있습니다. UIViewControllerAnimatedTransitioningUIViewControllerTransitioningDelegate를 활용하면 복잡한 전환 애니메이션도 어렵지 않게 구현할 수 있습니다. 이 글에서 제공된 예제를 바탕으로 더 창의적인 전환 애니메이션을 만들어보세요!