Add Divide Line In SwiftUI

SwiftUI has some utility views which make some simple actions, one of them is the Divider view.

It draws a line which adds nice seperation inside view.

The line direction based on Stack where the line is.

For HStack there is a vertical line.

HStack {
    Text(“First text”)
    Divider()
    Text(“Second text”)
}

For VStack there is a horizontal line.

VStack {
    Text(“First text”)
    Divider()
    Text(“Second text”)
}

And for ZStack there is a horizontal line by default

ZStack {
    Text(“First text”)
    Divider()
    Text(“Second text”)
}

However, if you want to create a vertical line just put Divider inside HStack.

ZStack {
    Text(“First text”)
    HStack {
        Divider()
    }
    Text(“Second text”)
}