Secure space may be very complicated in SwiftUI. Can somebody assist me to know the way it works?
Beneath are some factors which creates confusion please appropriate whether or not its true or not.
Case: 1 This retains the clear high and backside edges and uncommenting the .background additionally applies coloration to the sides. Appears prefer it has ignored the sides however textual content will not be moved up. So, edges nonetheless exist.
ZStack() {
// background
Colour.pink
// foreground
ScrollView {
Textual content("Part - 1")
.font(.title)
.foregroundColor(.white)
.body(maxWidth: .infinity, alignment: .main)
.padding()
.background(.blue)
ForEach(0..<10) { _ in
RoundedRectangle(cornerRadius: 16)
.fill(.white)
.body(peak: 150)
.shadow(radius: 20)
.padding(.horizontal)
.padding(.vertical, 8)
}
}
//.background(.yellow) //It additionally applies coloration to the sides however would not ignore the sides
Case: 2 It nonetheless has the protected space as a result of content material will not be transferring to the highest edges however this time on scrolling its not clear and edges will not be seen.
ScrollView {
Textual content("Part - 1")
.font(.title)
.foregroundColor(.white)
.body(maxWidth: .infinity, alignment: .main)
.padding()
.background(.blue)
ForEach(0..<10) { _ in
RoundedRectangle(cornerRadius: 16)
.fill(.white)
.body(peak: 150)
.shadow(radius: 20)
.padding(.horizontal)
.padding(.vertical, 8)
}
}
.background(.pink) // IT APPLIES TO WHOLE SCREEN INCLUDING EDGES
// WAYS- OF IGNORING SAFE AREA
// .ignoresSafeArea()
// .edgesIgnoringSafeArea([.top, .bottom])
Case: 3 Use background to deal with edges.
ScrollView {
VStack(spacing: 16) {
Textual content("Part - 1")
.font(.title)
.foregroundColor(.white)
.body(maxWidth: .infinity, alignment: .main)
.padding()
.background(.blue)
ForEach(0..<10) { _ in
Textual content("Howdy, World")
.body(maxWidth: .infinity, minHeight: 150)
.background(.pink)
}
}
.background(.yellow)
}
// .background(.inexperienced) // provides coloration to the sides
// .background(.inexperienced, ignoresSafeAreaEdges: []) // retains all edges default white & provides coloration to the sides
.background(.inexperienced, ignoresSafeAreaEdges: [.top]) // ignores particular edges & provides coloration to the sides
Can anybody conclude the optimized means and edge instances that we should ignore whereas utilizing the protected areas in SwiftUI?
