3

以下がアニメーションではなく、完全に機能していない理由と、それを修正する方法を誰かが知っていますか? 問題は、この場合、アニメーションの一部が表示されないことです。たぶん、回避策などがありますか?記事などを何時間も読んでいます...何も見つかりませんでした

私が最終的に達成しようとしているのは次のとおりです。

  1. SignUpLogin画面には、表示と非表示の両方.move(edge: .top) アニメーション .opacityがあります

  2. ログアウト画面は、出現・消滅時のアニメーション.blur と両方あります。 .opacity

ビューが再表示されると、ぼかしと不透明度は機能しなくなります (ただし、ビューが消えると機能します。gif を参照してください)。

Xcode 12、iOS 14 ここに画像の説明を入力

import SwiftUI
import Foundation
import Combine

class ViewRouter: ObservableObject {
    @Published var signUpLoginView_active: Bool = true
    @Published var newUserView_active: Bool = false
}
struct ContentView: View {
    @EnvironmentObject var viewRouter: ViewRouter
    @Environment(\.colorScheme) var colorScheme
    var body: some View {
        ZStack {
            if colorScheme == .dark {
                Color.white.ignoresSafeArea()
            } else {
                Color.black.ignoresSafeArea()
            }
            if viewRouter.newUserView_active {
                NewUserView()
                    .transition(.opacity)
                    .zIndex(4)
            }
            if viewRouter.signUpLoginView_active {
                SignUpLoginView()
                    .transition(.move(edge: .top))
                    .zIndex(5)
            }
        }
        .edgesIgnoringSafeArea(.all)
    }
}
struct SignUpLoginView: View {
    @EnvironmentObject var viewRouter: ViewRouter
    @Environment(\.colorScheme) var colorScheme
    var body: some View {
        ZStack() {
            colorScheme == .dark ? Color.black.ignoresSafeArea().zIndex(3) : Color.white.ignoresSafeArea().zIndex(3)
            if colorScheme == .dark {
                Color.white.ignoresSafeArea()
                    .opacity(viewRouter.signUpLoginView_active ? 0 : 1)
                    .zIndex(4)
            } else {
                Color.black.ignoresSafeArea()
                    .opacity(viewRouter.signUpLoginView_active ? 0 : 1)
                    .zIndex(4)
            }
//
            Button("Login") {
                withAnimation(.easeInOut(duration: 3)) {
                    viewRouter.signUpLoginView_active.toggle()
                    viewRouter.newUserView_active.toggle()
                }
            }.zIndex(3)
        }
    }
}
struct NewUserView: View {
    @EnvironmentObject var viewRouter: ViewRouter
    @Environment(\.colorScheme) var colorScheme
    var body: some View {
        ZStack {
            TabView {
                Button("Logout") {
                    withAnimation(.easeInOut(duration: 3)) {
                        viewRouter.signUpLoginView_active.toggle()
                        viewRouter.newUserView_active.toggle()
                    }
                }
                  .tabItem {
                     Image(systemName: "person.crop.circle.fill")
                     Text("My Profile")
                  }
            }
        }
        .blur(radius: (viewRouter.signUpLoginView_active ? 3 : 0), opaque: true)
        .padding(viewRouter.signUpLoginView_active ? -20 : 0)
    }
}
4

1 に答える 1