Spazio misterioso di SwiftUI in cima al VStack
Aug 20 2020
Ho questo codice
NavigationView{
VStack{
GeometryReader{ geometry in
VStack{
Text("a")
}
.frame(width:geometry.size.width)
.background(Color.orange)
Spacer()
}
}
.modifier(NavBarModifier(font: self.fontUI,text: "Profile"))
}
.navigationViewStyle(StackNavigationViewStyle())
Voglio che GeometryReader appaia in cima al VStack, tuttavia quello che ottengo è:

Dove la linea blu è la parte superiore del VStack e l'arancione è il GeometryReader. Ho provato ad aggiungere Spacer() dopo GeometryReader, ma non ha funzionato. Come posso rimuovere quella spaziatura?
struct NavBarModifier: ViewModifier{
var font: UIFont
var text: String
func body(content: Content) -> some View {
return content
.zIndex(0)
.animation(.spring())
.padding(.top,80)
.navigationBarTitle(Text(self.text),displayMode: .inline)
.navigationBarHidden(false)
.foregroundColor(.orange)
.background(NavigationConfigurator { nc in
nc.navigationBar.barTintColor = UIColor(red: 243/255, green: 107/255, blue: 21/255, alpha: 1)
nc.navigationBar.titleTextAttributes = [
.foregroundColor : UIColor.white,
.font : self.font,
.kern: 1.2
]
}
.padding([.top, .leading, .trailing]))
}
}
Risposte
1 Asperi Aug 20 2020 at 16:32
Basta rimuovere il padding ridondanteNavBarModifier
func body(content: Content) -> some View {
return content
.zIndex(0)
.animation(.spring())
// .padding(.top,80) // << this one !!
ignalonzo Aug 20 2020 at 15:54
È necessario aggiungere lo Spacer dopo il GeometryReader per il layout nella parte superiore del file VStack
e aggiungere anche .edgesIgnoringSafeArea(.top)
per ignorare lo spazio bianco (l'area sicura) e allinearlo nella parte superiore del file VStack
.
VStack {
GeometryReader{ geometry in
VStack {
Text("s")
}
.frame(width:geometry.size.width)
.background(Color.orange)
Spacer()
}
.edgesIgnoringSafeArea(.top)
Spacer()
}