SwiftUI 文本动画不透明度不起作用

Question

问题很简单:我到底如何才能让 Text 正确地设置动画？

struct ContentView: View {
    @State var foozle: String = ""

    var body: some View {
        VStack() {
            Spacer()

            Text(self.foozle)
                .frame(maxWidth: .infinity)
                .transition(.opacity)

            Button(action: {
                withAnimation(.easeInOut(duration: 2)) {
                    self.foozle = "uuuuuuuuu"
                }
            }) { Text("ugh") }

            Spacer()
        }.frame(width: 320, height: 240)
    }
}

问题: View 坚持做一些愚蠢的动画，其中文本被新文本替换，但被省略号截断，并且它慢慢地横向扩展，直到显示整个新文本。

当然，这不是不透明的动画。这不是框架宽度问题，我已经通过绘制边框进行了验证。

这是否只是 SwiftUI 中另一个我必须处理的愚蠢错误，并祈祷有人修复它？

编辑:好的，感谢@Mac3n，我得到了这个灵感，它工作正常，即使它有点难看:

Text(self.foozle)
    .frame(maxWidth: .infinity)
    .opacity(op)

Button(action: {
    withAnimation(.easeOut(duration: 0.3)) {
        self.op = 0

        DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
            self.foozle += "omo"

            withAnimation(.easeIn(duration: 0.3)) {
                self.op = 1
            }
        }
    }

}) {
    Text("ugh")
}

Answer 1

问题是 SwiftUI 将 Text View 视为相同的 View 。您可以在 View 上使用 .id() 方法来设置它。在本例中，我只是将值设置为文本本身的哈希值，因此如果更改文本，整个 View 将被替换。

struct ContentView: View {
    @State var foozle: String = ""

    var body: some View {
        VStack() {
            Spacer()

            Text(self.foozle)
                .id(self.foozle.hashValue)
                .frame(maxWidth: .infinity)
                .transition(.opacity)

            Button(action: {
                withAnimation(.easeInOut(duration: 2)) {
                    self.foozle = "uuuuuuuuu"
                }
            }) { Text("ugh") }

            Spacer()
        }.frame(width: 320, height: 240)
    }
}