NEW: My new book Pro SwiftUI is out now – level up your SwiftUI skills today! >>

Is there a way to pin headers without Lazy(ness)?

Forums > SwiftUI

I've got the following basic setup for a View, which is aestetically pleasing for the information I want to present, but I can't figure out how to (a) prevent each "List" segment of the screen from being draggable/scrollable or (b) pin the headers so that scrolling the List doesn't scroll the Section header with it.

    var body: some View {
        VStack {
            List {
                Section {
                    Text("Header")
                } header: {
                    Text("Region 1")
                }

                Section {
                    Text("Body")
                } header: {
                    Text("Region 2")
                }
            }

            HStack {
                List {
                    Section {
                        Text("Image 1")
                    } header: {
                        Text("Region 3")
                    }
                }

                List {
                    Section {
                        Text("Image 2")
                    } header: {
                        Text("Region 4")
                    }
                }
            }

            List {
                Section {
                    ForEach(0..<7) { number in
                        HStack {
                            Spacer()
                            Text("Word \(number)")
                        }
                    }
                } header: {
                    Text("Region 5")
                }
            }
        }
    }

The Apple documentation seems to indicate that headers can only be pinned using LazyVStack and LazyHStack, which don't work for me here (when I prepend Lazy onto any of the Stacks in my code, that area of the screen goes blank).

Is there an alternate way to pin headers? And does anyone have advice on what I can use besides Lists and Sections to create the same, organized setup I have without the scrollability (as I assume that all List Views are going to do that).

   

Add .listStyle(.plain) or .listStyle(.inset) to your List. I'm not sure there is a way to have sticky headers when using .insetGrouped.

   

Thanks for the assist! The .inset works to keep the headers in place, though it removes the visual that I was looking for. So I'll just create my own View that looks like a Section-in-a-List using some rectangles/overlays/clipshapes.

Does anyone else roll their eyes at the explanations given for options on things like ListStyle? Per the developer documentation:

static var inset: InsetListStyle The list style that describes the behavior and appearance of an inset list."

That's πŸ™„ soooo helpful when I'm trying to figure out how things like .sidebar/.elliptical/.bordered look...

   

Hacking with Swift is sponsored by Play

SPONSORED Play is the first native iOS design tool created for designers and engineers. You can install Play for iOS and iPad today and sign up to check out the Beta of our macOS app with SwiftUI code export. We're also hiring engineers!

Click to learn more about Play!

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.