swift - 这个SwiftUI动画只能淡出。为什么它会向右移动？

我很难理解为什么会这样。我将问题简化为最小表达。

我有一个Text View ，该 View 在删除后应该淡出。 .transition(.opacity)被添加只是为了清楚。不需要它，因为它是默认值。但是，结果是除了淡出之外，文本 View 还向右滑动。

通过播放文本长度，我意识到在过渡期间，其左边界要与 CHANGE 按钮的左边界对齐。但为什么？!

相反，添加回去时，它可以正常工作，并且没有运动。只是一个不错的淡入效果。

该问题不仅发生在iOS，而且发生在macOS。使用Xcode 11 beta 2。

import SwiftUI

struct ContentView : View {
    @State private var showText = true

    var body: some View {
        VStack {

            Spacer()

            if showText {
                Text("I should always be centered!").font(.largeTitle).transition(.opacity)
            }

            Spacer()

            Button(action: {
                withAnimation(.basic(duration: 1.5)) { self.showText.toggle() }
            }, label: {
                Text("CHANGE").font(.title)
            })

            Spacer()

            }
    }
}

最佳答案

我将回答我自己的问题……事实证明，父 View 在过渡期间会缩小，从而使文本 View 随其移动。为了说明，我在 View 中添加了一些边框:



为了解决该问题，我必须确保父 View 不会缩小。只需添加以下内容即可:

HStack { Spacer() }

修改后的代码如下所示:

import SwiftUI

struct ContentView : View {
    @State private var showText = true

    var body: some View {
        VStack {
            Spacer()

            if showText {
                Text("I should always be centered!").font(.largeTitle).transition(.opacity).border(Color.blue)
            }

            Spacer()

            Button(action: {
                withAnimation(.basic(duration: 1.5)) { self.showText.toggle() }
            }, label: {
                Text("CHANGE").font(.title).border(Color.blue)
            })

            Spacer()

            // This ensures the parent is kept wide to avoid the shift
            HStack { Spacer() }

        }.border(Color.green)
    }
}

我仍然认为这是一个错误，否则，淡入应该具有相同的行为，而事实并非如此。如果这不是一个bug，那不是人们所期望的。我将提交错误报告。

关于swift - 这个SwiftUI动画只能淡出。为什么它会向右移动？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56680017/