List Items on Top & Bottom with Space Between

Could you show the complete code where the list is defined ?

May be you have to embed in a VStack, and have 2 lists for top and bottom part, with spacer inbetween.

Claude31 i tried that it does not work as expected. It puts this weird line in the middle and the bottom list still hugs the top of the list i want it to hug the bottom like on the app store app. Also for some reason this method will not work in the preview.

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                List {
                    NavigationLink("Item #1", destination: Text("Item1").frame(maxWidth: .infinity, maxHeight: .infinity))
                    NavigationLink("Item #2", destination: Text("Item2").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
                Spacer()
                List {
                    NavigationLink("Item #3", destination: Text("Item3").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
            }.frame(width: 100)
        }
    }
}

Why use `List`?

If you remove the List wrappers, does that help?

davea,

if i change the lists to vstacks, it fixes it but then it changes the links to buttons instead of text. I cant even style the buttons with plainbuttonstyle because its a text that i used.

Problem is that list sets a scrollView, which interferes badly.

I sketched this, which produces something that seem to match your spec (as much as you told at least):

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                VStack {
                    NavigationLink("Item #1", destination: Text("Item1").frame(maxWidth: .infinity, maxHeight: .infinity))
                    NavigationLink("Item #2", destination: Text("Item2").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
                Spacer()
                VStack {
                    NavigationLink("Item #3", destination: Text("Item3").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
            }.frame(width: 100)
        }
    }
}

that still turns the navigation links into buttons and not text.

Of course !

Would this be closer to what you look for ? (not very nice IMHO)

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                VStack {
                    NavigationLink("Item #1", destination: Text("Item1").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
                VStack {
                    NavigationLink("Item #2", destination: Text("Item2").frame(maxWidth: .infinity, maxHeight: .infinity))
                }
                VStack {
                    NavigationLink("Item #3", destination: Text("Item3").frame(maxWidth: .infinity, maxHeight: .infinity))
                }.frame(height: 400)
            }.frame(width: 200)
        }
    }
}