sebj / swiftui-matched-inline-title

Transition from any SwiftUI Text view into an inline navigation bar title when the view is scrolled off-screen, as seen in Apple's TV & TestFlight iOS apps.
MIT License
26 stars 0 forks source link
swift swiftui title transition

SwiftUI Matched Inline Title

Transition from any SwiftUI Text view into an inline navigation bar title when the view is scrolled off-screen, as seen in Apple's TV & TestFlight iOS apps.

Example

struct ContentView: View {

    @Namespace var namespace

    var body: some View {
        NavigationView {
            ScrollView {
                VStack(alignment: .leading) {
                    MatchedTitle("For All Mankind", namespace: namespace) {
                        $0
                            .font(.largeTitle)
                            .fontWeight(.bold)
                            .padding()
                    }

                    // Other content…
                }
            }
            .matchedInlineTitle(in: namespace)
            // Other view modifiers, including `Toolbar` can be used…
        }
    }
}

Screenshots

Naming and namespacing conventions follow Swift's existing .matchedGeometryEffect view modifier.

A MatchedTitle view is initialized with any String, SubString or LocalizedStringKey, using similar parameters to SwiftUI's Text, and it provides optional customisation of the created Text view.

The .matchedInlineTitle modifier must be used on a ScrollView, and enforces a navigation bar title display mode of inline.

Minimum Requirements

License

This library is released under the MIT license. See the LICENSE file for more information.