刪除視圖時 SwiftUI 動畫不起作用

Question

SwiftUI 動畫視圖刪除不起作用

我正在為 SwiftUI 視圖上的動畫修飾符苦苦掙扎。

我在 SwiftUI 中有一個帶有 MKMapView ViewRepresentable 的映射函數。 我有一個帶有兩個控件的注釋。 此處列出的動畫代碼和下面的 ComboDetailMapView 確實為子視圖的呈現正確地設置了動畫 - 但我沒有嘗試過在視圖被刪除時為視圖設置動畫。

func mapView(_ mapView: MKMapView, annotationView view: MKAnnotationView, calloutAccessoryControlTapped control: UIControl) {

    if control == view.leftCalloutAccessoryView {
        //this animates in - but does NOT animate out - required here for ANY animation
        withAnimation(.easeInOut(duration: 1.0)) {
            parent.userDefaultsManager.showAddRemoveWaypointsView.toggle()
        }

    } else if control == view.rightCalloutAccessoryView {
        //this animates in - but does NOT animate out - required in this place
        withAnimation(.easeInOut(duration: 1.0)) {
            parent.userDefaultsManager.displayAddressView.toggle()
    }
    //...bunch more stuff
}

我正在制作動畫的視圖是一個簡單的白色背景圖像，具有不透明度變化和警報樣式子視圖。

struct DisplayAddressView: View {
    @ObservedObject var userDefaultsManager: UserDefaultsManager
    @Environment(\.presentationMode) var presentationMode

    var body: some View {

        ZStack {
            GeometryReader { geo in
                VStack {
                Image("PlainMask")
                    .resizable()
                    .frame(width: geo.size.width, height: geo.size.height + 20, alignment: .center)
                    .opacity(0.9)
                }//vstack
            }//geo reader

            RoundedRectangle(cornerRadius: 20)
                .fill(Color.blue).opacity(0.3)
                .frame(width: 300, height: 200)
            VStack {
                Button(action: {
                    //animation command does not work here
                    //withAnimation(.easeInOut(duration: 1.0)) {
                    self.userDefaultsManager.displayAddressView.toggle()
                }) {
                    VStack {
                        Text("Approximate Address")
                            //.font(.headline)
                            .foregroundColor(.primary)
                            .font(.system(size: 20) )
                            .multilineTextAlignment(.center)
                        Divider()
                        Text(self.userDefaultsManager.approximateAddress)
                            //.font(.headline)
                            .foregroundColor(.red)
                            .font(.system(size: 20) )
                            .multilineTextAlignment(.center)
                    }
                }
                .padding(.bottom)
                Divider()
                Button(action: {
                    //animation command does not work here
                    //withAnimation(.easeInOut(duration: 1.0)) {}
                    self.userDefaultsManager.displayAddressView.toggle()
                }) {

                    Text("Dismiss")
                        //.font(.headline)
                        .foregroundColor(.primary)
                        .font(.system(size: 20) )
                }
            }
        }//Zstack
    }//body
}

這是啟動 DisplayAddressView 視圖的視圖：

struct ComboDetailMapView: View {

    @ObservedObject var userDefaultsManager: UserDefaultsManager
    var aTrip: Trip?

    var body: some View {
        ZStack {
            VStack {
                Text(aTrip?.name ?? "Unknown Map Name")
                    .padding(.top, -50)
                    .padding(.bottom, -20)
                DetailMapView(userDefaultsManager: userDefaultsManager, aTrip: aTrip)
                    .padding(.top, -20)
                Text(self.userDefaultsManager.tripTimeAndDistance)
                    .multilineTextAlignment(.center)
            }//vstack

            if userDefaultsManager.displayAddressView {
                DisplayAddressView(userDefaultsManager: userDefaultsManager)
                //this works to add slide to the other animation
                .transition(AnyTransition.opacity.combined(with: .slide))
                //this does not work for dismissal
                //.transition(.asymmetric(insertion: AnyTransition.opacity.combined(with: .slide), removal: .scale))
            }
        }//zstack
    }//body
} 

我也嘗試過這個 SO 59064231 的想法。不高興。

我承認動畫視圖的過程，因為您不能再將修飾符直接附加到視圖仍然讓我感到困惑。 任何指導將不勝感激。 Xcode 11.3.1 (11C504)

Answer 1

事實證明，如果你退后一步思考我在這里需要的功能，我可以簡單地使用一個三元來控制視圖的位置。 不需要 if 語句來比較綁定，不需要復雜的 .transition 協調。 作為獎勵，如果需要，也可以對不透明度進行動畫處理。

DisplayAddressView(userDefaultsManager: userDefaultsManager)
    .offset(x: userDefaultsManager.showAddressView ? 0 : 500)
    .animation(.easeInOut(duration: 1.0))

光滑。