swift - 这个 SwiftUI 动画应该只会淡出。为什么会向右移动?

标签 swift swiftui swiftui-animation

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

我有一个 Text View ,当它被移除时,它应该会淡出。添加 .transition(.opacity) 只是为了清楚起见。不需要它,因为它是默认值。然而,结果是除了淡出之外, TextView 向右滑动。

通过调整文本长度,我意识到在转换过程中,它的左边距需要与 CHANGE 按钮的左边距对齐。但是为什么?!

反之,加回去时,工作正常,没有动静。只是一个很好的淡入效果。

问题不仅出现在 iOS 上,也出现在 macOS 上。使用 Xcode 11 beta 2。

enter image description here

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 {
                withAnimation(.basic(duration: 1.5)) {
                    self.showText.toggle() 
                }
            } label: {
                Text("CHANGE")
                    .font(.title)
            }
            
            Spacer()
        }
    }
}

最佳答案

我会回答我自己的问题...事实证明,父 View 在转换期间缩小,使 TextView 随之移动。为了说明,我在 View 中添加了一些边框:

enter image description here

为了解决这个问题,我必须保证父 View 不收缩。就像添加这个一样简单:

HStack { Spacer() }

enter image description here

修改后的代码如下所示:

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 {
                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)
    }
}

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

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

相关文章:

ios - 日期格式 日/月/年 HH :mm z is crashing while converting string to Date Swift 3. 0

ios - Swift 2.0 和 Google Analytics : Use of unresolved identifier "GAI"

SwiftUI 如何从所有 View 中查看类

ios - 嵌入在 UIViewController 中的 UIHostingController - 如何从外部更新 @State?

swift - 如何在 SwiftUI 中保持过渡动画相同的标识

ios - "finger"事件何时作为手势发送到 UIGestureRecognizer vs touchesBegan/touchesMoved/touchesEnded 到 UIView

swift - 如何在 Xcode 中使用新的 Scene Delegate

swiftui - NavigationStack 可搜索 .focused

animation - 来自 @Published 属性的 SwiftUI 动画从 View 外部更改

swiftui - SwiftUI 中新的 NavigationStack 过渡,如何从默认幻灯片更改为自定义或显示?