iPhone SwiftUI layouts

Explore SwiftUI APIs, components, and modifiers with interactive iPhone previews, Swift code, and Apple documentation. Compare every available orientation, appearance, and design.

TabView

Tab Badge

Generates a badge for a tab from an integer value.

Explore Tab Badge on iPhone in portrait, with SwiftUI code and Apple API documentation.

SwiftUI code

Full details Docs 
TabView {
    Group {
        Tab {
            Text("0")
        }

        Tab("1", systemImage: "1.circle") {
            Text("1")
        }

        Tab("2", image: "cats24x24") {
            Text("2")
        }

        Tab {
            Text("3")
        } label: {
            Label("3", systemImage: "3.circle")
        }
    }
}.badge(42)

Compatibility

iOS 18.0+ iPadOS 18.0+ macOS 15.0+ visionOS 2.0+

Tags

Found an issue or have a suggestion?

All variants

Every available iPhone screenshot for Tab Badge.

2 views