SwiftUI - centre content on a List

Question

How can I make this arrow on the centre of the list?

struct ProductsList : View {
var body: some View {

    VStack {
        List {
            Image(systemName: "shift")


        }

    }
}

}

Answer 1

You may just wanna use some Spacers.

struct ProductsList : View {
    var body: some View {
        VStack {
            List {
                HStack {
                   Spacer()
                   Image(systemName: "shift")
                   Spacer()
                } 
            }
        }
    }
}

Answer 2

I would suggest to use ViewModifier:

struct CenterModifier: ViewModifier {
    func body(content: Content) -> some View {
        HStack {
            Spacer()
            content
            Spacer()
        }
    }
} 

so that in your list, if you have more different type of UI elements its more convenient way to do so:

struct ExampleList: View {
    var body: some View {
        List {
            Image(systemName: "shift").modifier(CenterModifier())
            SomeOtherView().modifier(CenterModifier())
        }
    }
}

Answer 3

Try this:

var body: some View {
    List {
        GeometryReader { geometry in
            VStack(alignment: .center) {
                Image(systemName: "shift")
            }.frame(width: geometry.size.width)
        }
    }
}