Bars - tab

Tab bars with Orange branding


Page Summary


Specifications references

Accessibility

Please follow accessibility criteria for development

Standard tab bar

Tab bar light Tab bar dark

Tab bar is a standard iOS component. It uses bar items to navigate between views. Bar Item contains an icon and a title. An additonal badge can be also added with a count value or a text.

Example with 4 bar items :

TabView {
    GuidelinesList()
        .tabItem {
            Label("Guidelines", image: "Guideline-DNA_32")
        }
        .badge("Text")
    ComponentsList()
        .tabItem {
            Label("Components", image: "component-atom_32")
        }
    ModulesList()
        .tabItem {
            Label("Modules", image: "Module-molecule_32")
        }
        .badge(10)
    ODSDemoAboutView()
        .tabItem {
            Label("About", image: "info_32")
        }
}