[Style] 바텀시트 제스처 따라 수정

[hooni0918]

🔗 연결된 이슈

• close: [Style] 상단 네비게이션 부착 #54

📄 작업 내용

• 바텀시트 스크롤 영역따라 같이 올라가고 내려가기
• 하단영역 여백 추가하여 맞추기

구현 내용	IPhone 15 pro	IPhone SE
GIF

💻 주요 코드 설명

코드 설명할 파일 이름 (ex: HomeView)

• 어쩌구저쩌구

.background(
                                    GeometryReader { itemGeometry in
                                        Color.clear.onAppear {
                                            if index == 0 {
                                                firstItemFrame = itemGeometry.frame(in: .named("scrollView"))
                                            }
                                        }
                                        .onChange(of: itemGeometry.frame(in: .named("scrollView"))) { _, newFrame in
                                            if index == 0 {
                                                firstItemFrame = newFrame
                                                
                                                // 첫 번째 셀의 위치에 따라 바텀시트 상태 변경
                                                let threshold: CGFloat = -30
                                                if newFrame.minY < threshold && currentStyle == .half {
                                                    withAnimation(.spring(response: 0.3, dampingFraction: 0.7)) {
                                                        currentStyle = .full
                                                    }
                                                } else if newFrame.minY > threshold && currentStyle == .full {
                                                    withAnimation(.spring(response: 0.3, dampingFraction: 0.7)) {
                                                        currentStyle = .half
                                                    }
                                                }
                                            }
                                        }
                                    }
                                )
                                Divider()
                            }
                        }
                        Color.clear.frame(height: 90)

첫 번째 셀의 위치를 지속적으로 모니터링
스크롤에 따른 셀의 위치 변화를 감지
위치에 따라 바텀시트의 상태(full/half)를 자동으로 전환

👀 기타 더 이야기해볼 점

현재 gif에는 16프로에서 약간 이상하게 나오는데 실제 실행시 추가 여백을 두어서 정상동작합니다.

[juri123123]

궁금해요

[juri123123]

VStack 안에 LazyVStack을 넣은 이유가 있을까요?

[hooni0918]

다시 찾아보니 LazyStack으로 한번에 다 할수 있는거군요? 저는 원래 이렇게 사용해야한는줄 알앗어요ㅠ

[juri123123]

이 친구가 하는 역할이 뭔가요?

[hooni0918]

원래 스크롤 오프셋 따라 0번째 셀의 위치를 조정햇었는데 현재는 geometry로 조정중이여서 필요없는 코드가 맞습니다

[thingineeer]

style이 minimal 일 때는 List를 올리면 같이 올라가는데, half 일 때 List를 올리면 안 올라갑니다.
일부러 의도하신 부분 이신가요~?

[hooni0918]

제가 의도한건 이게 맞긴합니다. 그런데 기획과 상의가 있어야 할것같아요 상의후 다시 말씀드리겟습니다

[thingineeer]

adjust 해주세요!