打开视图时，ScrollView中的HStack动画异常

Question

因此，我试图为每个嵌入在列表视图中的行实现展开/收缩行，结果列表视图单元格的动画效果不佳。检出this tutorial后，建议使用带有foreach的滚动视图，因为它的动画效果更平滑。展开/收缩效果很好，但是只有在我第一次打开页面时才会出现意外的副作用。 HStack似乎在视图的左侧开始变平，并设置了动画，使其展开到其正常的起始位置。我放慢了视频中的动画的速度，以便于观看，并且我删除了ForEach，因为它似乎不是问题的根源。我不知道是什么原因造成的，而Google搜索没有任何答案。这里有人有答案还是至少有一些建议？非常感谢

@State var showTemp: Bool = false

var body: some View {
    ScrollView(.vertical, showsIndicators: false) {

        HStack(alignment: .top) {
            Text("Hello")
                .font(.system(size: 32))

            if showTemp {
                VStack {
                    Text("Middle 1")
                    Text("Middle 2")
                    Text("Middle 3")
                    Text("Middle 4")
                    Text("Middle 5")
                }
            }

            Spacer()

            Text("Goodbye")
        }
        .border(Color.black, width: 2)
        .onTapGesture {
            self.showTemp.toggle()
        }
        .background(Color.blue)
        .animation(.default)

    }
    .background(Color.green)
    .onAppear(perform: loadMethod)
}

Answer 1

从另一个角度看问题后，似乎已经回答了自己的问题。使用GeogetryReader并将HStack的框架宽度设置为geometry.size.width可以对其进行修复。

我认为这是可行的，因为没有指定宽度，HStack会尽可能多地填充区域。由于某种原因，它在加载视图时开始模糊不清，然后扩展以填充其区域，除非您对其应用动画，否则我认为它是不可见的。

试图在这里有所帮助，我不想成为回答自己的问题却不愿回答的人之一。