With SwiftUI, I know how to set a background with a simple color all over screen. So only background ignore the safe area. But when I want to do this with a linear gradient, I don't know do this.
My view with a simple background :
import SwiftUI
struct Settings : View {
var body: some View {
ScrollView {
VStack {
Text("Boussole")
.color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
.multilineTextAlignment(.leading)
.font(.system(size: 28))
.padding(.top, 15)
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
Toggle(isOn: .constant(false)) {
Text("Afficher le vrai nord")
.font(.system(size: 20))
.color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
}
.padding(.top, 10)
Toggle(isOn: .constant(true)) {
Text("Activer la vibration")
.font(.system(size: 20))
.color(Color(red: 52/255, green: 73/255, blue: 94/255, opacity: 1.0))
}
.padding(.top, 10)
.padding(.bottom, 20)
Divider()
}
.padding(.leading, 25)
.padding(.trailing, 25)
}
.background(Color.gray.edgesIgnoringSafeArea(.all))
}
}
So in this case, the safe area is ignored only for the background.
But how can I do this with this type of background ?
.background(LinearGradient(gradient: Gradient(colors: [Color(red: 189/255, green: 195/255, blue: 199/255, opacity: 1.0), .white]), startPoint: .topTrailing, endPoint: .bottomLeading), cornerRadius: 0)
I don't know how to place .edgesIgnoringSafeArea(.all)
Although this doesn't apply to the OP, in cases where the linear gradient's color changes are strictly vertical (i.e. startPoint is .top and endPoint is .bottom), then as an alternative to Mojtaba's solution, you can add a second (and third) .background using the Colors at the top and bottom of your gradient.
So,
.background(LinearGradient(gradient: Gradient(colors: [.red, .blue]), startPoint: .top, endPoint: .bottom), cornerRadius: 0)
Could become,
.background(LinearGradient(gradient: Gradient(colors: [.red, .blue]), startPoint: .top, endPoint: .bottom), cornerRadius: 0)
.background(Color(.red).edgesIgnoringSafeArea(.top))
.background(Color(.white).edgesIgnoringSafeArea(.bottom))
This will work in portrait mode, not sure about landscape though!