iOS 14 SwiftUI 中不需要的位置动画

Question

对于 iOS 14 和 iOS 13，Swift UI 动画似乎在其父框架中的 View 位置动画方面表现不同。我在下面的代码片段中的目标是仅对按钮文本的大小调整进行动画处理，这应该在点击它时发生. 相反，在 iOS 14 中，由 VStack 中附加视图的切换可见性引起的按钮位移也被动画化。

相同的代码在 iOS 13 (Xcode 11) 和 iOS 14（Xcode 12 beta 6，在 macOS 11 beta 上）产生不同的输出。在 iOS 14 中，如何重现旧行为？

import SwiftUI
import PlaygroundSupport

struct ContentView: View {
    @State var toggle = false
    var body: some View {
        VStack{
            if self.toggle {
                Rectangle().frame(width: 200, height: 200)
            }
            Button(action: {
                self.toggle.toggle()
            }){
                Text("Tap me!")
                    .scaleEffect(self.toggle ? 2 : 1)
                    .animation(
                        Animation.easeInOut(duration: 1.5)
                    )
            }
        }
        .frame(width: 400, height: 400)
    }
}

PlaygroundPage.current.setLiveView(ContentView())

这是所需的行为，就像在 iOS 13 中一样

这是不需要的行为，就像在 iOS 14 中一样

请注意，至少对我而言，相同的不良行为不仅发生在 Playground 中，而且还发生在 Xcode Previews 中的 iOS 14，以及模拟器和设备上（请参阅项目文件https://github.com/himbeles /位置动画示例）：

Answer 1

如果您\xe2\x80\x99在 macOS Catalina 或 macOS Big Sur 上使用 Xcode 12，则这是 iOS 14、macOS Big Sur 和 Swift Playground 中可见的行为变化。

\n

您只需要缩放动画。

\n

解决方法是更改​​为显式动画并使用不同的动画toggle来控制缩放。然后将 的切换包裹scale.toggle起来withAnimation { }：

\n

struct ContentView: View {\n    @State var toggle = false\n    @State var scale = false\n    var body: some View {\n        VStack{\n            if self.toggle {\n                Rectangle().frame(width: 200, height: 200)\n            }\n            Button(action: {\n                self.toggle.toggle()\n                withAnimation(.easeInOut(duration: 1.5)) {\n                    self.scale.toggle()\n                }\n            }){\n                Text("Tap me!")\n                    .scaleEffect(self.scale ? 2 : 1)\n            }\n        }\n        .frame(width: 400, height: 400)\n    }\n}\n

\n