ios - 如何将 WithAnimation 与 @ObservedObject 一起使用

Question

比方说，我有一个像这样的简单个人资料屏幕:

class Model: ObservableObject {
    @Published var isSignedIn = false
    
    init() {}
    
    func login() {
        //Some networking here
        isSignedIn = true
    }
    func logout() {
        //Some networking here
        isSignedIn = false
    }
}

struct ContentView: View {
    @ObservedObject var model = Model()

    var body: some View {
        ZStack {
            //ProfileView
            VStack {
                //Some Views with WithAnimation inside
                // ...
 
                Text("Hello, Dear User!")
                Button(action: {
                    self.model.logout()
                }) {
                    Text("Sign Out")
                }
            }
            .opacity(model.isSignedIn ? 1 : 0)

            //LoginView
            VStack {
                Text("Hello, Stranger")
                Button(action: {
                    self.model.login()
                }) {
                    Text("Sign In")
                }
            }
            .opacity(model.isSignedIn ? 0 : 1)
        }
    }
}

我想将动画应用于不透明度变化。
第一种方法是使用 .animation修饰符。但它有一定的缺点:如果内部 View 有 WithAnimation，它就不能正常工作。 - 它会覆盖使用 WithAnimation 设置的动画.
我的第二种使用方法 .onReceive :

class Model: ObservableObject {
    @Published var isSignedIn = false
    
    init() {}
    
    func login() {
        isSignedIn = true
    }
    func logout() {
        isSignedIn = false
    }
}

struct ContentView: View {
    @ObservedObject var model = Model()
    
    @State var isSignedIn = false

    var body: some View {
        ZStack {
            //ProfileView
            VStack {
                Text("Hello, Dear User!")
                Button(action: {
                    self.model.logout()
                }) {
                    Text("Sign Out")
                }
            }
            .opacity(model.isSignedIn ? 1 : 0)

            //LoginView
            VStack {
                Text("Hello, Stranger")
                Button(action: {
                    self.model.login()
                }) {
                    Text("Sign In")
                }
            }
            .opacity(model.isSignedIn ? 0 : 1)
        }
        .onReceive(self.model.$isSignedIn) { value in
            withAnimation(Animation.easeIn) {
                self.isSignedIn = value
            }
        }
    }
}

有一些问题(在我看来):

另一个@State需要 var 来处理模型中的更改

每个WithAnimation block 需要单独的 .onReceive

所以问题是:申请 WithAnimation的方法是否正确？至 @ObservedObject ，还是有更好的解决方案？

Answer 1

您的第一种方法可以更改，因此您不需要使用额外的 @State 属性

class Model: ObservableObject {
    @Published var isSignedIn = false
    
    init() {}
    
    func login() {
        withAnimation(Animation.easeIn) {
        isSignedIn = true
        }
    }
    func logout() {
        withAnimation(Animation.easeIn) {
        isSignedIn = false
        }
    }
}

struct SView: View {
    @ObservedObject var model = Model()

    var body: some View {
        ZStack {
            //ProfileView
            VStack {
                Rectangle()
                Text("Hello, Dear User!")
                Button(action: {
                    self.model.logout()
                }) {
                    Text("Sign Out")
                }
            }
            .opacity(model.isSignedIn ? 1 : 0)

            //LoginView
            VStack {
                Rectangle()
                Text("Hello, Stranger")
                Button(action: {
                    self.model.login()
                }) {
                    Text("Sign In")
                }
            }
            .opacity(model.isSignedIn ? 0 : 1)
        }

    }
}
struct SwiftUIView_Previews: PreviewProvider {
    static var previews: some View {
        SView()
    }
}

在你的第二种方法中，你需要改变

.opacity(model.isSignedIn ? 1 : 0)

到

.opacity(self.isSignedIn ? 1 : 0)