Я пытаюсь создать «всплывающее окно», которое появляется, когда связанное значение не равно нулю.
![enter image description here](https://i.stack.imgur.com/733jpm.png)
У меня есть 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()
}
}
Как мне сделать так, чтобы это было анимировано на входе / выходе?