Related to this post.
In my chat view, each time I load new page (items are added from top), the ScrollView
jumps to top instead of maintaining scrollPosition
.
Here is my scroll view:
GeometryReader { geometryProxy in
ScrollView(showsIndicators: false) {
VStack(spacing: 0) {
if viewModel.isLoading {
LoadingFooter()
}
messagesView
.frame(minHeight: geometryProxy.size.height - loadingFooterHeight - bottomContentMargins, alignment: .bottom)
}
}
.scrollDismissesKeyboard(.interactively)
.defaultScrollAnchor(.bottom)
.scrollPosition(id: $scrolledId, anchor: .top)
.contentMargins(.bottom, bottomContentMargins, for: .scrollContent)
.onChange(of: scrolledId, scrollViewDidScroll)
}
And this is the messages view
@ViewBuilder var messagesView: some View {
LazyVStack(spacing: 0) {
ForEach(sectionedMessages) { section in
Section(header: sectionHeaderView(title: section.id)) {
ForEach(section, id: \.id) { message in
MessageView(message: message)
.padding(.horizontal, .padding16)
.padding(.bottom, .padding8)
.id(message.id)
}
}
}
.scrollTargetLayout()
}
}
Printing the scrolledId
after a page load, I can see it hasn't changed, but the ScrollView position does.