--- title: "Navigation Components | Explore SwiftUI" description: "Enable people to move between different parts of your app’s view hierarchy within a scene. Explore 6 SwiftUI navigation components with visual code examples." canonical_url: "https://exploreswiftui.com/library/navigation" meta: author: "Explore SwiftUI" "og:description": "Enable people to move between different parts of your app’s view hierarchy within a scene. Explore 6 SwiftUI navigation components with visual code examples." "og:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_Navigation%2BComponents%2Cdescription_Explore%2B6%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L25hdmlnYXRpb24i%2Cs_NZHf1BdpdNdmMfbs.png" "og:image:height": "630" "og:image:type": image/png "og:image:width": "1200" "og:title": "Navigation Components | Explore SwiftUI" "twitter:description": "Enable people to move between different parts of your app’s view hierarchy within a scene. Explore 6 SwiftUI navigation components with visual code examples." "twitter:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_Navigation%2BComponents%2Cdescription_Explore%2B6%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L25hdmlnYXRpb24i%2Cs_NZHf1BdpdNdmMfbs.png" "twitter:title": "Navigation Components | Explore SwiftUI" --- > Index of every page on this site: [llms.txt](https://exploreswiftui.com/llms.txt) # **Navigation Components** Enable people to move between different parts of your app’s view hierarchy within a scene 6 components ![Preferred Top Column - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/256/variants/1967?v=1791379474964&r=2&w=412&q=75&f=webp) ### **Preferred Top Column** Controls which column appears on top of the stack when NavigationSplitView collapses into a single stack in certain contexts, such as on iPhone, when iPhone Duo is closed, or on Apple Watch. By default, the sidebar appears on top. In this case, the detail column does instead. ![Content NavigationSplitView - iOS on iPhone Duo - Landscape - Fully Open - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/242/variants/1528?v=1790273533713&r=2&w=412&q=75&f=webp) ### **Content NavigationSplitView** Creates a three-column navigation split view. ![NavigationSplitView - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/241/variants/1983?v=1791379705544&r=2&w=412&q=75&f=webp) ### **NavigationSplitView** Creates a two-column navigation split view. ![Toolbar Title Alignment - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/258/variants/2111?v=1793542963212&r=2&w=412&q=75&f=webp) ### **Toolbar Title Alignment** Sets the preferred alignment of the navigation bar’s title. The navigation bar resolves the alignment of its title automatically based on context, and toolbar roles. Use this modifier to override that resolution. ![Hide Sidebar Toggle - iOS on iPhone Duo - Landscape - Fully Open - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/255/variants/1925?v=1791377398818&r=2&w=412&q=75&f=webp) ### **Hide Sidebar Toggle** Removes the sidebar toggle toolbar item a NavigationSplitView adds by default. ![Navigation Subtitle - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/94/variants/289?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Navigation Subtitle** Configures the view’s subtitle for purposes of navigation, using a localized string ```json {"@context":"https://schema.org","@graph":[{"@id":"https://exploreswiftui.com/#website","@type":"WebSite","description":"A visual library for SwiftUI APIs, components, and modifiers","inLanguage":"en-US","name":"Explore SwiftUI","url":"https://exploreswiftui.com/","publisher":{"@id":"https://exploreswiftui.com/#identity"}},{"@id":"https://exploreswiftui.com/library/navigation#webpage","@type":"WebPage","description":"Enable people to move between different parts of your app’s view hierarchy within a scene. Explore 6 SwiftUI navigation components with visual code examples.","name":"Navigation Components","url":"https://exploreswiftui.com/library/navigation","breadcrumb":{"@id":"https://exploreswiftui.com/library/navigation#breadcrumb"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://exploreswiftui.com/library/navigation"]}],"primaryImageOfPage":{"@id":"https://exploreswiftui.com/#logo"}},{"@id":"https://exploreswiftui.com/#identity","@type":"Organization","description":"A visual library for SwiftUI APIs, components, and modifiers","name":"Explore SwiftUI","url":"https://exploreswiftui.com","logo":{"@id":"https://exploreswiftui.com/#logo"},"sameAs":["https://x.com/Typ0genius","https://mastodon.social/@Typ0genius"]},{"@id":"https://exploreswiftui.com/library/navigation#collectionpage","@type":"CollectionPage","description":"Enable people to move between different parts of your app’s view hierarchy within a scene. Explore 6 SwiftUI navigation components with visual code examples.","inLanguage":"en-US","name":"Navigation Components","url":"https://exploreswiftui.com/library/navigation","about":{"@type":"Thing","name":"SwiftUI"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"}},{"@id":"https://exploreswiftui.com/library/navigation#/schema/item-list/1","@type":"ItemList","name":"Navigation Components","itemListElement":[{"@type":"ListItem","position":1,"name":"Preferred Top Column","url":"https://exploreswiftui.com/library/navigation/preferred-top-column"},{"@type":"ListItem","position":2,"name":"Content NavigationSplitView","url":"https://exploreswiftui.com/library/navigation/content-navigationsplitview"},{"@type":"ListItem","position":3,"name":"NavigationSplitView","url":"https://exploreswiftui.com/library/navigation/navigationsplitview"},{"@type":"ListItem","position":4,"name":"Toolbar Title Alignment","url":"https://exploreswiftui.com/library/navigation/toolbar-title-alignment"},{"@type":"ListItem","position":5,"name":"Hide Sidebar Toggle","url":"https://exploreswiftui.com/library/navigation/hide-sidebar-toggle"},{"@type":"ListItem","position":6,"name":"Navigation Subtitle","url":"https://exploreswiftui.com/library/navigation/navigation-subtitle"}]},{"@id":"https://exploreswiftui.com/library/navigation#breadcrumb","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Home","item":"https://exploreswiftui.com","position":1},{"@type":"ListItem","name":"Navigation","item":"https://exploreswiftui.com/library/navigation","position":2}]},{"@id":"https://exploreswiftui.com/#logo","@type":"ImageObject","caption":"Explore SwiftUI","contentUrl":"https://exploreswiftui.com/apple-touch-icon.png","inLanguage":"en","url":"https://exploreswiftui.com/apple-touch-icon.png"}]} ```