NavigationTransitions

<p align="center"> <img width="320" src="https://yellow-cdn.veclightyear.com/2b54e442/eb3825eb-e990-43b7-95c0-97adbdaa6fee.gif"> <img width="320" src="https://yellow-cdn.veclightyear.com/2b54e442/d7de9142-f704-4c6f-a927-d90441861c70.gif"> <img width="320" src="https://yellow-cdn.veclightyear.com/2b54e442/44906763-b281-4b84-bc2b-1c178b355f1d.gif"> <img width="320" src="https://yellow-cdn.veclightyear.com/2b54e442/34fc8f7a-5651-4c8e-8aa0-c174ac5aa415.gif"> </p>

NavigationTransitions 是一个与 SwiftUI 的 NavigationView 和 NavigationStack 无缝集成的库，允许完全自定义推入和弹出过渡效果！

概述

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)
)

过渡效果

该库自带一些标准过渡效果：

• default
• fade(_:)
• slide(axis:)

除此之外，你还可以用几行类似 SwiftUI 的代码创建完全自定义的过渡效果！

struct Swing: NavigationTransition {
    var body: some NavigationTransition {
        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) // 全屏平移手势！

这甚至可以在保持 iOS 中默认系统过渡效果的同时覆盖其行为：

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

文档

发布版本和 main 分支的文档可在此处获取：

• main
• 0.13.3

<details> <summary> 其他版本 </summary>

• 0.13.2
• 0.13.1
• 0.13.0
• 0.12.0
• 0.11.0
• 0.10.1
• 0.10.0
• 0.9.3
• 0.9.2
• 0.9.1
• 0.9.0
• 0.8.1
• 0.8.0
• 0.7.4
• 0.7.3
• 0.7.2
• 0.7.1
• 0.7.0
• 0.6.0
• 0.5.1

</details>