如何使SwiftUI列表自动滚动？

Question

将内容添加到ListView时，我希望它自动向下滚动。

我正在使用SwiftUI List和a BindableObject作为控制器。新数据将追加到列表中。

List(chatController.messages, id: \.self) { message in
    MessageView(message.text, message.isMe)
}

当我将新数据追加到消息列表时，我希望列表向下滚动。但是，我必须手动向下滚动。

Answer 1

更新：在iOS 14中，现在有一种本机方式可以执行此操作。我正在这样做

        ScrollView(.vertical) {
            ScrollViewReader { scrollView in
                LazyVStack {
                    ForEach(notes, id: \.self) { note in
                        MessageView(note: note)
                    }
                }
                .onAppear {
                    scrollView.scrollTo(notes[notes.endIndex - 1])
                }
            }
        }

对于iOS 13及以下版本，您可以尝试：

我发现翻转视图对我来说似乎很好。这将在底部启动ScrollView，并在向其添加新数据时自动向下滚动视图。

1. 旋转最外面的视图180 .rotationEffect(.radians(.pi))
2. 在垂直平面上翻转 .scaleEffect(x: -1, y: 1, anchor: .center)

您还必须对内部视图执行此操作，因为现在它们都将旋转和翻转。要翻转它们，请执行上述相同操作。

如果需要这么多地方，可能值得为此定制视图。

您可以尝试以下操作：

List(chatController.messages, id: \.self) { message in
    MessageView(message.text, message.isMe)
        .rotationEffect(.radians(.pi))
        .scaleEffect(x: -1, y: 1, anchor: .center)
}
.rotationEffect(.radians(.pi))
.scaleEffect(x: -1, y: 1, anchor: .center)

这是一个将其翻转的View扩展

extension View {
    public func flip() -> some View {
        return self
            .rotationEffect(.radians(.pi))
            .scaleEffect(x: -1, y: 1, anchor: .center)
    }
}