Home IOS Development ios – How protected space works and which is the optimized approach to deal with it?

ios – How protected space works and which is the optimized approach to deal with it?

0
ios – How protected space works and which is the optimized approach to deal with it?

[ad_1]

Secure space could be very complicated in SwiftUI. Can somebody assist me to know the way it works?
Under 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 shade to the perimeters. Appears to be like prefer it has ignored the perimeters however textual content is just not moved up. So, edges nonetheless exist.

ZStack() {
    // background
    Shade.crimson
    // 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 shade to the perimeters however would not ignore the perimeters

Case: 2 It nonetheless has the protected space as a result of content material is just not transferring to the highest edges however this time on scrolling its not clear and edges aren’t 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(.crimson) // 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("Good day, World")
                        .body(maxWidth: .infinity, minHeight: 150)
                        .background(.crimson)
                }
            }
            .background(.yellow)
        }
        // .background(.inexperienced) // provides shade to the perimeters
        // .background(.inexperienced, ignoresSafeAreaEdges: []) // retains all edges default white & provides shade to the perimeters
        .background(.inexperienced, ignoresSafeAreaEdges: [.top]) // ignores particular edges & provides shade to the perimeters

Case: 1 with background

Case: 2 with background Case: 2 ignores the safe area

Case: 3 Handle edges color and scroll view background color with background modifier

Can anybody conclude the optimized means and edge circumstances that we should ignore whereas utilizing the protected areas in SwiftUI?

[ad_2]

LEAVE A REPLY

Please enter your comment!
Please enter your name here