NavigationTransitions

CI

NavigationTransitions 是一个与 SwiftUI 的 NavigationViewNavigationStack 无缝集成的库,允许对推送和弹出转场进行完全自定义!

概述

无需为了控制转场而重新发明整个导航堆栈,NavigationTransitions 提供了一个简单的修饰符,可以直接应用于 SwiftUI 自己的原生导航组件。

基础知识

iOS 13+

NavigationView {
  // ...
}
.navigationViewStyle(.stack)
.navigationTransition(.slide)

iOS 16+

NavigationStack {
  // ...
}
.navigationTransition(.slide)

API 的设计模仿了内置 SwiftUI 转场,以实现最大的熟悉度易用性

你可以像使用标准 SwiftUI 转场一样应用自定义动画

.navigationTransition(
    .fade(.in).animation(.easeInOut(duration: 0.3))
)

你可以组合它们

.navigationTransition(
    .slide.combined(with: .fade(.in))
)

并且你可以根据逻辑动态地选择转场

.navigationTransition(
    reduceMotion ? .fade(.in).animation(.linear) : .slide(.vertical)
)

转场

该库提供了一些开箱即用的标准转场

除了这些,你还可以使用类似 SwiftUI 的代码,用几行代码创建完全自定义转场

struct Swing: NavigationTransitionProtocol {
    var body: some NavigationTransitionProtocol {
        Slide(axis: .horizontal)
        MirrorPush {
            let angle = 70.0
            let offset = 150.0
            OnInsertion {
                ZPosition(1)
                Rotate(.degrees(-angle))
                Offset(x: offset)
                Opacity()
                Scale(0.5)
            }
            OnRemoval {
                Rotate(.degrees(angle))
                Offset(x: -offset)
            }
        }
    }
}

Demo 应用展示了一些这些转场的使用示例。

交互性

一个令人愉悦的附加功能是能够覆盖导航视图上的弹出手势的行为

.navigationTransition(.slide, interactivity: .pan) // full-pan screen gestures!

即使在 iOS 中保持默认系统转场的情况下,它也可以覆盖其行为

.navigationTransition(.default, interactivity: .pan) // ✨

文档

此处提供了版本发布和 main 分支的文档

其他版本