我有一个带有导航视图的SwiftUI应用程序。导航视图中有一个列表。该列表包含导航链接。一切都很好,但我希望每个列表项都能延伸到视图的整个宽度,而不是一直有灰色的边距。
如何使列表具有全宽并消除上边距?
import SwiftUI
struct ConsumerDashboardView: View {
@StateObject var authVM = AuthorizationClass()
var body: some View {
NavigationView {
VStack{
Spacer()
.frame(height: 50)
Button(action: {
print("Button Clicked")
}){
Text("\(Image(systemName: "plus")) Start a New Project")
.font(.headline)
.fontWeight(/*@START_MENU_TOKEN@*/.bold/*@END_MENU_TOKEN@*/)
.foregroundColor(.white)
.padding()
.frame(width: 300, height: 60)
.background(Color("BrandOrange"))
.cornerRadius(5.0)
}
Spacer()
.frame(height: 100)
VStack(spacing: -2){
HStack{
Text(" Active\nProjects")
.font(.headline)
.fontWeight(/*@START_MENU_TOKEN@*/.bold/*@END_MENU_TOKEN@*/)
.frame(
width: 120,
height: 60,
alignment: .center
)
.background(Color("BrandLightBlue"))
.foregroundColor(.white)
.padding(.trailing, 50)
Text(" Closed\nProjects")
.font(.headline)
.fontWeight(/*@START_MENU_TOKEN@*/.bold/*@END_MENU_TOKEN@*/)
.frame(
width: 120,
height: 60,
alignment: .center
)
.border(Color("BrandLightBlue"), width: 2)
.background(Color(.white))
.foregroundColor(Color("BrandLightBlue"))
}
Divider()
.frame(
width: 1000,
height: 3
)
.background(Color("BrandLightBlue"))
Spacer()
if !authVM.projectObjects.isEmpty {
ProjectsList(authVM: authVM)
} else {
ProjectsLoader(authVM: authVM)
}
}
}
.navigationBarTitleDisplayMode(.inline)
.toolbar {
ToolbarItem(placement: .principal) {
HStack {
Image("Icon")
.resizable()
.frame(
width: 30,
height: 30
)
Text("Icon").font(.headline)
Image(systemName: "line.3.horizontal.decrease.circle")
.imageScale(.large)
}
}
}
}.onAppear {
authVM.fetchProjects()
}
}
}
struct ProjectsList: View {
@StateObject var authVM = AuthorizationClass()
var body: some View {
List(authVM.projectObjects){ projectObject in
NavigationLink(destination: ProjectDetailView(project: projectObject.project)){
ProjectRowView(project: projectObject.project)
.frame(
height: 150
)
}
}
}
}