Structure¶

Divider¶

A divider that visually separates views in a stack.¶

Declaration¶

struct Divider : View

Overview¶

The Divider in iOS is either a horizontal or a vertical 1pt thick line. The height of a Divider is determined by the system, and cannot be overriden. The system is responsible for adapting the appearance of Divider as best appropriate for the host platform.

When contained in a stack, the divider stretches across the axis perpendicular to the axis of the stack. When not in a stack, the divider stretches across the horizontal axis.

For example, use a Divider in a VStack to create a horizontal line between vertically laid out elements:

struct ExampleView: View {
    var body: some View {
        VStack {
            Text("My Awesome Book")

            Divider()

            Text("My Name")
        }
    }
}

A view containing a VStack with two text lines, "My Awesome Book" and "My Name," separated by a horizontal divider in the form of a thin gray line.

Or use a Divider in an HStack to create a vertical line between horizontally laid out elements:

struct ExampleView: View {
    var body: some View {
        HStack {
            Text("This is a line of text")

            Divider()

            Text("This is an unrelated line of text")
        }
    }
}

A view containing an HStack with two text lines "This is a line of text" and "This is an unrelated line of text," separated by a vertical divider in the form of a thin gray line.

The color of a divider can be modified using background(_:alignment:):

struct ExampleView: View {
    var body: some View {
        VStack {
            Text("My Awesome Book")

            Divider()
                .background(Color.orange)

            Text("My Name")
        }
    }
}

A screenshot containing two lines of text in a VStack separated by a divider. Using the background view modifier renders the divider in orange. The text reads "My Awesome Book" on top of the divider, and "My Name" underneath.

Availability¶

iOS 13.0+

macOS 10.15+

tvOS 13.0+

watchOS 6.0+

Topics¶

Type Alias¶

Body The type of view representing the body of this view.

Initializer¶

init() Creates a new Divider.