SwiftUI - Sticky Header

안녕하세요 :D 망고입니다🥭

SwiftUI로 Sticky Header 만드는 방법에 대해 알아보겠습니다.

 

 

Sticky Header란?

사용자가 화면을 아래로 스크롤 할 때 화면 상단에 고정되는 뷰를 말합니다.

처음엔 Sticky Header라는 용어를 몰라서 한참 찾아봄 ㅠㅠ

 

 

LazyVStack의 pinnedViews라는 옵션을 통해 설정할 수 있다.

[.sectionHeaders]를 통해 상단에 고정시키도록 설정했고, 

 

post, liked 부분을 filterBar로 구현 한 다음 Section(header: filterBar)에 넣어주었다.

    private var StickyHeader: some View {
        LazyVStack(pinnedViews: [.sectionHeaders]) {
            Section(header: filterBar) {
                코드
            }
        }
    }

    private var filterBar: some View {
        HStack {
		코드
        }
    }