How to ignore safe area for a background with a linear gradient and image in swiftUI?
Your current setup has the right idea, but if you want to completely ignore the safe area for the VStack's background, you should apply the .ignoresSafeArea() modifier on each of the backgrounds.
The white space you are seeing might be a result of the VStack not filling up the whole screen.
Try moving .ignoresSafeArea() modifier outside of the ZStack, and apply it to the whole VStack. Here is the updated code:
var body: some View {
    VStack{
        //some view
    }
    .background(
        ZStack {
            LinearGradient(gradient: Gradient(
                colors: [
                    .yellow_500,
                    .yellow_500,
                    .yellow_500,
                    .yellow_50
                ]), startPoint: .top, endPoint: .bottom)
                .resizable()
                .aspectRatio(contentMode: .fill)

            Image(R.image.home_bg_try.name)
                .resizable()
                .scaledToFill()
                .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
    )
    .ignoresSafeArea()
}

By using .ignoresSafeArea(), you instruct SwiftUI to layout the VStack and its background across the whole screen, including under the status bar and home indicator on iPhone models with edge-to-edge screens.
Additionally, you might want to apply .edgesIgnoringSafeArea(.all) instead of .ignoresSafeArea() in certain situations. For example, if your view doesn't play well with safe area insets when it's embedded in another view hierarchy, you might find .edgesIgnoringSafeArea(.all) works better. However, in SwiftUI 2.0 and later, .ignoresSafeArea() is generally recommended.

I have a VStack like this:
    var body: some View{
        VStack{
            //some view
        }
        .background(
            ZStack{
                LinearGradient(gradient: Gradient(
                    colors: [
                        .yellow_500,
                        .yellow_500,
                        .yellow_500,
                        .yellow_50
                    ]), startPoint: .top, endPoint: .bottom)
                .ignoresSafeArea(.container, edges: [.top])
                
                
                Image(R.image.home_bg_try.name)
                    .resizable()
                    .scaledToFill()
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    .ignoresSafeArea(.container, edges: [.top])

            }
//                .offset(y: -20)
        )
    }


I want the image to be displayed without considering the safe area, which currently results in a white space appearing at the top, as shown in this image: (https://i.stack.imgur.com/knRdm.png).
I attempted to fix this issue by adding an offset, but I noticed that the height of the white space varies across different models.
How can I resolve this problem?
