Hi !

I am trying to get the background image of the ZStack to arrive to the top of the screen. I am using .frame(maxWidth: .infinity, maxHeight: .infinity) to get it. But it doesn't appear like that. The top of the screen is still white...

What am I doing wrong ? how could I get it?

ScrollView {

                ZStack {

                    AsyncImage(url: URL(string: thumbnail)) { image in
                        image

                            .resizable()
                            .scaledToFill()
                            .frame(maxWidth: .infinity, maxHeight: .infinity)
                            .blur(radius: 60, opaque: true)
                            .overlay(Color(UIColor.systemBackground).opacity(0.01))
                    } placeholder: {
                        ProgressView()
                    }

                    VStack(alignment: .center, spacing: 10) {

                        AsyncImage(url: URL(string: thumbnail)) { image in
                            image
                                .resizable()
                                .scaledToFill()

                                .clipShape(.rect(cornerRadius: 15))
                        } placeholder: {
                            ProgressView()
                        }
                        .frame(width: 250, height: 400)
                        .padding (.bottom, 20)

                        Text (title)

                        }

                   }
           }

I think it's called the safe area.....

https://www.hackingwithswift.com/quick-start/swiftui/how-to-inset-the-safe-area-with-custom-content

Use .ignoresSafeArea() on Image

var body: some View {
    ZStack {
        Color.blue
            .ignoresSafeArea()

        Text("Hello World!")
    }
}

@GeorgeMCSwifter I think .safeAreaInset() is to get the image just in the safe area, isn't it? but that is not what I am looking for...

@NigelGee I have tried with .ignoresSafeArea() after .scaledToFill() but it doesn´t fill the top of the screen with the image...

If you are using .scaledToFill() it will stop veritical when the horizontal width is reached and if the image is not the same ratio as the phone will not fill the top. If you use .scaledToFit() then it will fill the whole screen but you will lose the some of the horizontal edges.

PS this is not in a NavigationStack that may not help as the title bar is on top of the ZStack

You mena changing .scaledToFill for ScaledToFit() ?

If I use .scaledToFit() the problem is still there...

I don't understand what you mean with "this is not in a NavigationStack that may not help as the title bar is on top of the ZStack". I have 't put a title yet...

Without the URL and rest of the View it hard to see what the problem is!

@Kitty2018 the link I posted specifically states ignoresafearea() in the first paragraph. The rest is what youll probably need if you want to customize top and bottom.

One way to troubleshoot is to create a basic program and make sure everything works as it should. Then start cross referencing your code.

i have a program named playground that i go back to every now and then to load some code /troubleshoot. Maybe look up troubleshooting swift programs might also help you.

i think this runs along the lines of teach a man to fish he will be fed for a lifetime etc etc

Best of luck!