ios – How to make sure views respect Secure Space in SwiftUI whereas father or mother view ignores it effectively in TabView?

I am creating an app with a person interface just like TikTok, that includes a number of tabs, together with a full display vertical scroller tab. On this scroller view, I would like the background to increase past the secure space, masking the complete display. Nevertheless, I additionally want some overlaid views to remain inside the secure space.

At the moment, I am utilizing GeometryReader for this format. The problem arises after I change to the second tab for the primary time. The background appears to rebuild, which isn’t ideally suited for efficiency, particularly if the background is a video.

For instance, I’ve created a simplified model of this challenge. It contains a background with a randomly generated shade and a blue field representing the secure space content material. The issue is noticeable when the background shade modifications upon swiping to the following tab, indicating that the view has been rebuilt(I assume). How can I stop this view from rebuilding when switching tabs, or is there a extra environment friendly workaround for this state of affairs?

import SwiftUI

struct ContentView: View {
    @State personal var selectedIndex: Int = 0
    
    var physique: some View {
        ZStack(alignment: .backside) {
            TabView(choice: $selectedIndex) {
                PageView()
                Textual content("2nd tab")
            }
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .by no means))
            .edgesIgnoringSafeArea(.all)
        }
    }
}

struct PageView: View {
    @State personal var paddingValue: EdgeInsets = EdgeInsets()
    
    var physique: some View {
        GeometryReader { geometry in
            ScrollView {
                LazyVStack(spacing: 0){
                    ForEach(0..<10){put up in
                        Rectangle()
                            .fill(randomColor())
                            .containerRelativeFrame ([.horizontal, .vertical])
                            .overlay {
                                SafeSectionView()
                                    .padding(paddingValue)
                            }
                    }
                }
                .scrollTargetLayout()
            }
            .scrollIndicators(.hidden)
            .scrollTargetBehavior(.paging)
            .ignoresSafeArea()
            .onAppear {
                if paddingValue == EdgeInsets() {
                    paddingValue = geometry.safeAreaInsets
                }
            }
        }
    }
    
    func randomColor() -> Coloration {
        return Coloration(
            crimson: Double.random(in: 0...1),
            inexperienced: Double.random(in: 0...1),
            blue: Double.random(in: 0...1)
        )
    }
}

struct SafeSectionView: View {
    var physique: some View {
        Rectangle()
            .fill(.blue)
    }
}

#Preview {
    ContentView()
}