[英]SwiftUI LazyVGrid transition animation not as expected
I have a LazyVGrid that is defined like this:我有一个定义如下的 LazyVGrid:
let column = Array(repeating: GridItem(.flexible(minimum: 120, maximum: .infinity)), count: 3)
LazyVGrid(columns: column, alignment: .leading, spacing: 5) {
ForEach(data, id: \.self.uniqueStableId) { _ in
Color.red
.transition(.move(edge: .trailing))
.frame(height: 150)
}
}
I have a button, that starts an animation effect:我有一个按钮,启动 animation 效果:
func handleButtonTap() {
for index in 0..<9 {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(1 * index)) {
withAnimation(.easeInOut(duration: 1)) {
let newItem = Item()
self.data.append(newItem)
}
}
}
}
The animation should add the new Red squares into the grid one by one with 1 second intervals using a slide effect, but there are 2 issues: animation 应该使用滑动效果以 1 秒的间隔将新的红色方块一个一个地添加到网格中,但是有两个问题:
It appears I'm setting the transition and animation in the wrong place, because even if remove the.transition from the Red view, it still animates it the same way.看来我在错误的地方设置了过渡和 animation,因为即使从红色视图中删除了 .transition,它仍然以相同的方式对其进行动画处理。 Can't understand what controls it
无法理解是什么控制它
Anyone has a hint how to adjust it to work properly?任何人都有如何调整它以正常工作的提示? Thanks!
谢谢!
I can reproduce your issue, and I don't know why it happens.我可以重现你的问题,但我不知道为什么会这样。
But I found a possible solution.但我找到了一个可能的解决方案。 If you wrap the
LazyVGrid
in s ScrollView
it works:如果将
LazyVGrid
包装在 s ScrollView
中,它会起作用:
struct Item: Identifiable {
let id = UUID()
}
struct ContentView: View {
@State private var data: [Item] = []
let column = Array(repeating: GridItem(.flexible()), count: 3)
var body: some View {
VStack {
Button("Add") { handleButtonTap() }
ScrollView {
LazyVGrid(columns: column, alignment: .leading, spacing: 5) {
ForEach(data) { _ in
Color.red
.frame(height: 150)
.transition(.move(edge: .trailing))
}
}
Spacer()
}
}
}
func handleButtonTap() {
for index in 0..<9 {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(1 * index)) {
withAnimation(.easeInOut(duration: 1)) {
let newItem = Item()
self.data.append(newItem)
}
}
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.