SwiftUI: How to add a gray line bar on Sheet?

Question

I know how to add this element with HStack and Rectangle. But...

1. How is it called?

2. Does SwiftUI have this element out of the box?

Answer 1

iOS16:

It is added automatically if you have more than one detent, so for just one detent you will have to be explicit about the visibility:

yourContentView
    .presentationDetents([.medium])
    .presentationDragIndicator(.visible)

Answer 2

1. The thing is called a Drag Indicator.
2. With iOS 16+ you can use .presentationDragIndicator(_:) modifier to control its visibility.

Proposals have been made on how to emulate this drag indicator in earlier iOS versions.

As a small addition to the great answers of John M. and happymacaron, this comes even closer:

ZStack(alignment: .top) {
    // NavigationView
    Capsule()
        .fill(Color.secondary)
        .opacity(0.5)
        .frame(width: 35, height: 5)
        .padding(6)
}