--- title: "TabView Components | Explore SwiftUI" description: "A view that switches between multiple child views using interactive user interface elements. Explore 24 SwiftUI tabview components with visual code examples." canonical_url: "https://exploreswiftui.com/library/tabview" meta: author: "Explore SwiftUI" "og:description": "A view that switches between multiple child views using interactive user interface elements. Explore 24 SwiftUI tabview components with visual code examples." "og:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_TabView%2BComponents%2Cdescription_Explore%2B24%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L3RhYnZpZXci%2Cs_NSV4v9LmVuDgxgda.png" "og:image:height": "630" "og:image:type": image/png "og:image:width": "1200" "og:title": "TabView Components | Explore SwiftUI" "twitter:description": "A view that switches between multiple child views using interactive user interface elements. Explore 24 SwiftUI tabview components with visual code examples." "twitter:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_TabView%2BComponents%2Cdescription_Explore%2B24%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L3RhYnZpZXci%2Cs_NSV4v9LmVuDgxgda.png" "twitter:title": "TabView Components | Explore SwiftUI" --- > Index of every page on this site: [llms.txt](https://exploreswiftui.com/llms.txt) # **TabView Components** A view that switches between multiple child views using interactive user interface elements 24 components ![TabSection - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/157/variants/618?v=1790073478842&r=2&w=412&q=75&f=webp) ### **TabSection** A container that you can use to add hierarchy within a tab view. ![TabBarOnlyTabViewStyle - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/159/variants/699?v=1790073478842&r=2&w=412&q=75&f=webp) ### **TabBarOnlyTabViewStyle** A tab view style that displays a tab bar when possible. ![TabView - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/155/variants/690?v=1790418883969&r=2&w=412&q=75&f=webp) ### **TabView** Creates Tabs with title, image, systemImage and custom Label. ![Search Tab Role - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/163/variants/663?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Search Tab Role** On Liquid Glass, this tab is placed in its own group. In left-to-right (LTR) layouts, it will always appear on the right side of the TabView. ![GroupedTabViewStyle - macOS - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/160/variants/514?v=1790073478842&r=2&w=412&q=75&f=webp) ### **GroupedTabViewStyle** A tab view style that displays a tab bar that groups its tabs together. ![PageTabViewStyle - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/161/variants/685?v=1790073478842&r=2&w=412&q=75&f=webp) ### **PageTabViewStyle** A TabViewStyle that displays a paged scrolling TabView. ![VerticalPageTabViewStyle - watchOS - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/162/variants/463?v=1790073478842&r=2&w=412&q=75&f=webp) ### **VerticalPageTabViewStyle** A TabViewStyle that displays a vertical TabView interaction and appearance. ![SidebarAdaptableTabViewStyle - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/158/variants/655?v=1790073478842&r=2&w=412&q=75&f=webp) ### **SidebarAdaptableTabViewStyle** A tab bar style that adapts to each platform. ![TabView Bottom Accessory Placement - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/90/variants/385?v=1793438761547&r=2&w=412&q=75&f=webp) ### **TabView Bottom Accessory Placement** A placement of the bottom accessory in a tab view. You can use this to adjust the content of the accessory view based on the placement ![Collapse Sidebar Sections by Default - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/259/variants/2039?v=1792566366133&r=2&w=412&q=75&f=webp) ### **Collapse Sidebar Sections by Default** Collapses the section in the sidebar by default. ![Default Tab Bar Placement - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/239/variants/2069?v=1792681374978&r=2&w=412&q=75&f=webp) ### **Default Tab Bar Placement** Specifies the preferred placement for the tabs of a TabView in the sidebarAdaptable style on platforms where the tab bar cannot adapt between different representations, and only one representation can be shown. For example, on iOS, it can enforce the sidebar on large-screen devices like the Pro Max, and iPhone Duo. This modifier has no effect on iPadOS. ![Default Collapsed Tab Section - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/234/variants/341?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Default Collapsed Tab Section** Sets the default expansion state for the section containing this tab to collapsed when displayed in the sidebar. ![Tab View Customization Behavior - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/166/variants/669?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab View Customization Behavior** Configures the customization behavior of customizable tab view content. ![Tab View Customization - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/164/variants/671?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab View Customization** Specifies the customizations to apply to the sidebar representation of the tab view. ![Tab View Side Bar Footer - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/168/variants/735?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab View Side Bar Footer** Adds a custom footer to the sidebar of a tab view. ![Tab View Side Bar Bottom Bar - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/169/variants/707?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab View Side Bar Bottom Bar** Adds a custom bottom bar to the sidebar of a tab view. ![Default Adaptable Tab Bar Placement - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/170/variants/673?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Default Adaptable Tab Bar Placement** Specifies the default placement for the tabs in a tab view using the adaptable sidebar style. ![Tab Bar Section Actions - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/171/variants/631?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab Bar Section Actions** Adds custom actions to a tab section. ![Tab View Side Bar Header - iPadOS - Landscape - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/167/variants/729?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab View Side Bar Header** Adds a custom header to the sidebar of a tab view. ![Tab Badge - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/156/variants/677?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Tab Badge** Generates a badge for a tab from an integer value. ![Hidden Index PageTabViewStyle - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/189/variants/711?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Hidden Index PageTabViewStyle** A TabViewStyle that displays a paged scrolling TabView with a hidden index. ![Value Tab View - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/165/variants/616?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Value Tab View** Creates a tab view that uses a builder to create and specify selection values for its tabs. ![Hide Tab Bar On Scroll Down - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/88/variants/383?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Hide Tab Bar On Scroll Down** Minimize the tab bar when downwards scrolling starts. Minimizing is supported for tab bars on only iPhone ![Bottom Accessory - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/89/variants/39?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Bottom Accessory** A modifier to place content above the tabs ```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/tabview#webpage","@type":"WebPage","description":"A view that switches between multiple child views using interactive user interface elements. Explore 24 SwiftUI tabview components with visual code examples.","name":"TabView Components","url":"https://exploreswiftui.com/library/tabview","breadcrumb":{"@id":"https://exploreswiftui.com/library/tabview#breadcrumb"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://exploreswiftui.com/library/tabview"]}],"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/tabview#collectionpage","@type":"CollectionPage","description":"A view that switches between multiple child views using interactive user interface elements. Explore 24 SwiftUI tabview components with visual code examples.","inLanguage":"en-US","name":"TabView Components","url":"https://exploreswiftui.com/library/tabview","about":{"@type":"Thing","name":"SwiftUI"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"}},{"@id":"https://exploreswiftui.com/library/tabview#/schema/item-list/1","@type":"ItemList","name":"TabView Components","itemListElement":[{"@type":"ListItem","position":1,"name":"TabSection","url":"https://exploreswiftui.com/library/tabview/tabsection"},{"@type":"ListItem","position":2,"name":"TabBarOnlyTabViewStyle","url":"https://exploreswiftui.com/library/tabview/tabbaronlytabviewstyle"},{"@type":"ListItem","position":3,"name":"TabView","url":"https://exploreswiftui.com/library/tabview/tabview"},{"@type":"ListItem","position":4,"name":"Search Tab Role","url":"https://exploreswiftui.com/library/tabview/search-tab-role"},{"@type":"ListItem","position":5,"name":"GroupedTabViewStyle","url":"https://exploreswiftui.com/library/tabview/groupedtabviewstyle"},{"@type":"ListItem","position":6,"name":"PageTabViewStyle","url":"https://exploreswiftui.com/library/tabview/pagetabviewstyle"},{"@type":"ListItem","position":7,"name":"VerticalPageTabViewStyle","url":"https://exploreswiftui.com/library/tabview/verticalpagetabviewstyle"},{"@type":"ListItem","position":8,"name":"SidebarAdaptableTabViewStyle","url":"https://exploreswiftui.com/library/tabview/sidebaradaptabletabviewstyle"},{"@type":"ListItem","position":9,"name":"TabView Bottom Accessory Placement","url":"https://exploreswiftui.com/library/tabview/tabview-bottom-accessory-placement"},{"@type":"ListItem","position":10,"name":"Collapse Sidebar Sections by Default","url":"https://exploreswiftui.com/library/tabview/collapse-sidebar-sections-by-default"},{"@type":"ListItem","position":11,"name":"Default Tab Bar Placement","url":"https://exploreswiftui.com/library/tabview/default-tab-bar-placement"},{"@type":"ListItem","position":12,"name":"Default Collapsed Tab Section","url":"https://exploreswiftui.com/library/tabview/default-collapsed-tab-section"},{"@type":"ListItem","position":13,"name":"Tab View Customization Behavior","url":"https://exploreswiftui.com/library/tabview/tab-view-customization-behavior"},{"@type":"ListItem","position":14,"name":"Tab View Customization","url":"https://exploreswiftui.com/library/tabview/tab-view-customization"},{"@type":"ListItem","position":15,"name":"Tab View Side Bar Footer","url":"https://exploreswiftui.com/library/tabview/tab-view-side-bar-footer"},{"@type":"ListItem","position":16,"name":"Tab View Side Bar Bottom Bar","url":"https://exploreswiftui.com/library/tabview/tab-view-side-bar-bottom-bar"},{"@type":"ListItem","position":17,"name":"Default Adaptable Tab Bar Placement","url":"https://exploreswiftui.com/library/tabview/default-adaptable-tab-bar-placement"},{"@type":"ListItem","position":18,"name":"Tab Bar Section Actions","url":"https://exploreswiftui.com/library/tabview/tab-bar-section-actions"},{"@type":"ListItem","position":19,"name":"Tab View Side Bar Header","url":"https://exploreswiftui.com/library/tabview/tab-view-side-bar-header"},{"@type":"ListItem","position":20,"name":"Tab Badge","url":"https://exploreswiftui.com/library/tabview/tab-badge"},{"@type":"ListItem","position":21,"name":"Hidden Index PageTabViewStyle","url":"https://exploreswiftui.com/library/tabview/hidden-index-pagetabviewstyle"},{"@type":"ListItem","position":22,"name":"Value Tab View","url":"https://exploreswiftui.com/library/tabview/value-tab-view"},{"@type":"ListItem","position":23,"name":"Hide Tab Bar On Scroll Down","url":"https://exploreswiftui.com/library/tabview/hide-tab-bar-on-scroll-down"},{"@type":"ListItem","position":24,"name":"Bottom Accessory","url":"https://exploreswiftui.com/library/tabview/bottom-accessory"}]},{"@id":"https://exploreswiftui.com/library/tabview#breadcrumb","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Home","item":"https://exploreswiftui.com","position":1},{"@type":"ListItem","name":"TabView","item":"https://exploreswiftui.com/library/tabview","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"}]} ```