我有一个水平滚动视图,当用户输入更多内容时,它会向前沿滚动。但是,一旦达到最大长度,就不会发生这种情况。在事件中放置断点.onChange
表明scrollTo
应该运行滚动代理。
当我滑动水平滚动条时,它会按预期滚动,并且当我输入新内容时,它的行为完全符合我的预期。该问题似乎与滚动视图的初始状态有关,但我无法准确追踪在何处以及如何解决此问题。
struct ContentView: View {
@State var text: String = "100"
var body: some View {
VStack {
HorizontalScrollView(text: $text)
.padding(.top, 100)
Button("Add 100",
action: updateText)
.padding(.bottom, 100)
}
}
func updateText() {
text += "100"
}
}
struct HorizontalScrollView: View {
@Binding var text: String
var body: some View {
ScrollViewReader { scrollView in
GeometryReader { proxy in
ScrollView(.horizontal) {
HStack {
Spacer()
Text(text)
.id("textView")
.font(.title2)
.lineLimit(1)
.background(.red)
.padding(.bottom)
}
.frame(minWidth: proxy.size.width,
idealHeight: 44)
.background(.yellow)
}
.onChange(of: text) { _ in
withAnimation {
scrollView.scrollTo("textView", anchor: .trailing)
}
}
.background(.green)
}
}
}
}
可下载的示例项目:https ://github.com/imattice/HorizontalScrollExample
理想的解决方案是,一旦视图被加载并且用户输入的文本溢出滚动视图,文本将转移到前沿以将最新的文本显示到视图中,而无需手动滚动视图。