Question

我正在尝试使用.transition()对视图进行动画/过渡。我使用了here中的类似代码，并将.transition()放在两个条件视图中。

struct Base: View {
    @State private var isSignedIn = false

    var body: some View {
        Group {
            if(isSignedIn){
                Home().transition(.slide)
            }else{
                AuthSignin(isSignedIn: self.$isSignedIn).transition(.slide)
            }
        }
    }
}

struct AuthSignin: View {
    @Binding var isSignedIn: Bool

    var body: some View {
        VStack {
            Button(action: {
                self.isSignedIn = true
            }) {
                Text("Sign In")
                    .bold()
                    .frame(minWidth: CGFloat(0), maxWidth: .infinity)
                    .padding()
                    .background(Color.blue)
                    .foregroundColor(Color.white)
                    .cornerRadius(CGFloat(10))
            }.padding()
        }
    }
}

但是，每当我单击“登录”按钮（带有或不带有.transition()）时，应用都会冻结一秒钟，然后Home()视图将突然出现而没有任何动画/过渡。我也曾尝试将self.isSignedIn = true包装在withAnimation中，但仍然无法正常工作。有什么想法或有更好的方法吗？

Answer 1

将<a href="{% url 'blogs:edit_post' p.id %}">Edit post</a>放置在要切换的视图的容器中，而不是每个条件视图。这是我完成的某些代码中的一个简单示例（有效）。

在需要有条件转换的主视图中：

.transition

然后，在视图中触发条件变化的某处：

import SwiftUI

struct AppWrapperView: View {

  @State var showFirstRun:Bool = true

  var body: some View {
    ZStack {
      if (showFirstRun) {
        FirstRunView(showFirstRun: $showFirstRun)
      } else {
        Text("Some other view")
      }
    }
    .transition(.slide)
  }
}

Answer 2

我必须将if..else语句放入ZStack容器中，而不是Group中。在我看来，Group是动画损坏的主要原因。另外，我将.transition与.animation组合应用到了容器而不是视图中。

ZStack {
  if(isSignedIn){
    Home()
  } else {
    AuthSignin(isSignedIn: self.$isSignedIn)
  }
}
.transition(.slide)
.animation(.easeInOut)

Answer 3

放入 self.isSignedIn = true之前的WithAnimation

SwiftUI条件视图将不进行动画/过渡

3 个答案: