Анимация SwiftUI не происходит при обновлении привязки - PullRequest
Новая
       53

Анимация SwiftUI не происходит при обновлении привязки

1 голос
/ 25 мая 2020

Я пытаюсь создать «всплывающее окно», которое появляется, когда связанное значение не равно нулю.

enter image description here

У меня есть PopupCard класс, который является общим c над Content и некоторыми Value… 

struct PopupCard<Content: View, Value>: View {
    @Binding private var data: Value?
    private let content: (Value) -> Content

    init(data: Binding<Value?>, @ViewBuilder content: @escaping (Value) -> Content) {
        self._data = data
        self.content = content
    }

    var body: some View {
        Group {
            if data != nil {
                HStack {
                    self.content(self.data!)
                        .padding()
                    Spacer()
                }
                .frame(width: UIScreen.main.bounds.width - 40)
                    .background(
                            Rectangle()
                                .fill(Color.yellow)
                                .shadow(color: Color.black.opacity(0.2), radius: 5, y: 0)
                    )
                    .offset(y: self.data == nil ? -100 : 0)
                    .animation(.default)
            }
        }
    }
}

Я также создал следующее расширение для View… 

extension View {
    func popup<Content: View, Value>(data: Binding<Value?>, @ViewBuilder content: @escaping (Value) -> Content) -> some View {
        return ZStack {
            self
            VStack {
                Spacer()
                PopupCard(data: data, content: content)
            }
        }
    }
}

Все это отлично работает, кроме анимации. Карта появляется и исчезает, как и ожидалось, но без анимации. Это продемонстрировано в следующем предварительном просмотре ... 

struct PopupCard_Previews: PreviewProvider {
    struct PreviewView: View {
        @State var name: String? = "Hello"
        var body: some View {
            TabView {
                Button("Toggle", action: {
                    self.name = self.name == nil ? "Hello" : nil

                    })
                    .popup(data: $name) { string in
                        Text(string)
                }
            }
        }
    }

    static var previews: some View {
        PreviewView()
    }
}

Как мне сделать так, чтобы это было анимировано на входе / выходе?

1 Ответ

1 голос
/ 25 мая 2020

Вот фиксированный вариант (если я правильно понял намерение). Протестировано с Xcode 11.4 / iOS 13.4

demo

struct PopupCard<Content: View, Value>: View {
    @Binding private var data: Value?
    private let content: (Value) -> Content

    init(data: Binding<Value?>, @ViewBuilder content: @escaping (Value) -> Content) {
        self._data = data
        self.content = content
    }

    var body: some View {
        Group {
            HStack {
                if data != nil {
                    self.content(self.data!).padding()
                } else {
                    Text("")
                }
                Spacer()
            }
            .frame(width: UIScreen.main.bounds.width - 40)
                .background(
                        Rectangle()
                            .fill(Color.yellow)
                            .shadow(color: Color.black.opacity(0.2), radius: 5, y: 0)
                )
                .compositingGroup()
                .offset(y: self.data == nil ? 100 : 0)
                .animation(.default)
        }
    }
}
...