Generic Instance Method

background(_:alignment:)

Layers the given view behind this view.

Declaration

func background<Background>(_ background: Background, alignment: Alignment = .center) -> some View where Background : View

Parameters

background

The view to draw behind this view.

alignment

The alignment with a default value of center that you use to position the background view.

Discussion

Use background(_:alignment:) when you need to place one vew behind another, with the background view optionally aligned with a specified edge of the frontmost view.

The example below creates two views: the Frontmost view, and the DiamondBackground view. The Frontmost view uses the DiamondBackground view for the background of the image element inside the Frontmost view’s VStack.

struct DiamondBackground: View {
    var body: some View {
        VStack {
            Rectangle()
                .fill(Color.gray)
                .frame(width: 250, height: 250, alignment: .center)
                .rotationEffect(.degrees(45.0))
        }
    }
}

struct Frontmost: View {
    var body: some View {
        VStack {
            Image(systemName: "folder")
                .font(.system(size: 128, weight: .ultraLight))
                .background(DiamondBackground())
        }
    }
}
A view showing a large folder image with a grey diamond placed behind it as its background view.

See Also

Layering Views

func overlay<Overlay>(Overlay, alignment: Alignment) -> View

Layers a secondary view in front of this view.

func zIndex(Double) -> View

Controls the display order of overlapping views.