相关疑难解决方法(0)

我正在尝试在多行上添加展开/折叠动画Text，但我的行为很奇怪。

下面是这个问题的 gif。我设置了缓慢的动画以使其清晰。

https://www.dropbox.com/s/sx41g9tfx4hd378/expand-collapse-stack_overflow.gif

我正在对视图的高度属性进行动画处理，并且无论Text动画周期如何，它似乎都会立即转换为一行。这是一些代码：

struct ContentView: View {

    @State var expanded = false

    var body: some View {
        VStack(spacing: 20) {
            HStack {
                Button(expanded ? "Colapse" : "Expand") {
                    withAnimation {
                        self.expanded.toggle()
                    }
                }
            }
            VStack(spacing: 10) {
                Text(bigText)
                Text(bigText)
            }
            .frame(height: expanded ? .none : 0)
            .clipped()
            .background(Color.red)
            Text("Thist is another text underneath the huge one. ")
                .font(.system(.headline))
                .foregroundColor(.red)
            Spacer()
        }
    }
}

我已经尝试了很多其他的东西，这是目前最接近所需的输出，这与UIStackView在 UIKit 中为 a 内的标签设置动画相同。

有没有办法正确地做到这一点？这是一个错误吗？通常问题来自开发人员，但我注意到，如果我使用动画，则DisclosureGroup在展开时动画会起作用，但在折叠时则没有动画。那么这实际上可能是多行的限制Text …

我正在向 SwiftUI 表单添加控件以帮助用户输入数据（并限制条目！）。尽管 Forms 有很多值得喜欢的地方，但我发现在该容器之外运行良好的东西在容器内却会发生非常意想不到的事情，并且如何弥补这一点并不总是显而易见的。

计划是将数据字段显示为单行。当点击该行时，控件从数据字段后面滑出 - 该行需要扩展（高度）以容纳控件。

我正在使用 Swift Playgrounds 来开发概念验证（或者在我的例子中失败）。这个想法是使用 ZStack，它可以通过覆盖视图并给它们一个不同的 zIndex 并在点击数据字段视图时应用偏移量来实现漂亮的滑动动画。听起来很简单，但是当 ZStack 展开时，Form 行当然不会展开。

在扩展时调整 ZStack 的框架会导致填充发生各种奇怪的变化（或者至少看起来像这样），这可以通过抵消“顶部”视图来补偿，但这会导致其他不可预测的行为。指针和想法感激地接受。

导入 SwiftUI

struct MyView: View {
    @State var isDisclosed = false

    var body: some View {
        Form { 
            Spacer()

            VStack { 
                ZStack(alignment: .topLeading) {
                    Rectangle()
                        .fill(Color.red)
                        .frame(width: 100, height: 100)
                        .zIndex(1)
                        .onTapGesture { self.isDisclosed.toggle() }

                    Rectangle()
                        .fill(Color.blue)
                        .frame(width: 100, height: 100)
                        .offset(y: isDisclosed ? 50 : 0)
                        .animation(.easeOut)
                }
            }

            Spacer()
        }
    }
}

折叠堆栈

扩展堆栈 - 视图与相邻行重叠

展开时调整 …