As you can see the picture I want to place the search bar exactly to the top of the safeArea
but the proxy.safeAreaInsets
has not the proper value because in the PreviewProvider
the parent uses edgesIgnoringSafeArea
.
what can I do ? is there any way to access safeAreaInsets?
struct FindView: View {
// MARK: - Properties
@ObservedObject var viewModel: FindViewModel
init(viewModel: FindViewModel){
self.viewModel = viewModel
}
var body: some View {
GeometryReader { proxy in
ScrollView(.vertical, showsIndicators: true, content: {
VStack(alignment: .leading, spacing: 8){
SearchBar()
.frame(height: 48, alignment: .center)
.padding(.all, 16)
Text("Categories")
.multilineTextAlignment(.leading)
.font(.system(size: 21))
.padding(.all, 16)
}.frame(width: proxy.size.width)
})
}
}
}
struct FindView_Previews: PreviewProvider {
static var previews: some View {
ZStack(alignment: .center, content: {
Rectangle().foregroundColor(.red)
FindView(viewModel: FindViewModel())
}).edgesIgnoringSafeArea(.all)
}
}
You should apply the
.edgesIgnoringSafeArea(.all)
only to the rectangle, not to the ZStack. This way, only it should fill the screen, while everything else remains in place.Then, to make it so that the
FindView
fills the screen (respecting safe area), you need make its frame extend with.frame(maxWidth: .infinity, maxHeight: .infinity)
Code sample: