Итак, я пытаюсь загрузить свои подпредставления в родительский вид GameView. По сути, я хотел бы, чтобы каждое подвид игрока внутри GameView загружалось последовательно. Так что я сделал так, что мои анимационные переходы увеличивались с задержкой на 1,5. Но все же загружаются все представления внутри игрового представления, а затем отображается экран. Как я могу сделать это более последовательным? Спасибо

struct GameView: View {
    @ObservedObject var game:GameViewModel

    var body: some View {
        ZStack{
            Rectangle().foregroundColor(Color.init(red: 0.21, green: 0.40, blue: 0.30, opacity: 1.00)).edgesIgnoringSafeArea(.all)
            VStack {
                Spacer()

                HandView.init(hand: game.dealer).offset(x: 0, y: 0).animation(Animation.easeInOut(duration: 0.5).delay(6))

                HStack {PlayerView.init(player: self.game.players[0]).padding(.all).rotationEffect(Angle.init(degrees: 90)).scaledToFit().scaleEffect(0.7).animation(Animation.easeInOut(duration: 0.5).delay(0))
                    Spacer().frame(minWidth: 10)
                    PlayerView.init(player: self.game.players[2]).padding(.all).rotationEffect(Angle.init(degrees: -90)).scaledToFit().scaleEffect(0.7).animation(Animation.easeInOut(duration: 0.5).delay(2))
                }
                PlayerView.init(player: self.game.players[1]).padding(.all).animation(Animation.easeInOut(duration: 0.5).delay(4))
                HStack(spacing: 0)
                { Button(action: {
                    self.game.resetGame()
                }, label: {
                    Text("Reset")
                }).offset(x: -8, y: 0)}.padding(.leading, -100)

            }
        }

    }
}
struct PlayerView: View {
    @State var player:Player
    var body: some View {
        HStack {
            ZStack {
                VStack(alignment: .trailing, spacing: 0){
                    ForEach(0..<self.player.hands.count, id: \.self) {
                        index in ZStack {
                            Spacer()
                            HandView.init(hand: self.player.hands[index])
                        }
                    }
                    Spacer().frame(height: 45)
                    Text(self.player.id).bold().font(Font.system(size: 20))
                    Spacer()
                }
                .padding(.all)
                if self.player.isBust{
                    self.bust
                }
            }
            if !player.isRobot{
                VStack{Button(action: {
                    self.player.requestCard()
                }, label: {
                    Text("Hit Me!")
                })
                    Button(action: {
                        DispatchQueue.main.asyncAfter(deadline: .now() + 1) { // 1 sec delay
                            self.player.requestCard()
                        }
                    }, label: {
                        Text("Stay")
                    })}
                    .offset(x: 10, y: 0)}
        }
    }
}
0
Rohan Garg 15 Июн 2020 в 01:20

1 ответ

Лучший ответ

Для удобства вы можете использовать это расширение View, чтобы запускать анимацию, когда появляется :

extension View {
    func animate(using animation: Animation, _ action: @escaping () -> Void) -> some View {
        return onAppear {
            withAnimation(animation) {
                action()
            }
        }
    }
}

Вот простая демонстрация последовательного показа двух кругов (с начальной задержкой):

struct ContentView: View {
    @State var opacityCircle1 = 0.0
    @State var opacityCircle2 = 0.0

    @State var animationsLoaded = false

    var body: some View {
        VStack {
            Circle()
                .opacity(opacityCircle1)
                .animate(using: Animation.easeInOut(duration: 2).delay(1)) { self.opacityCircle1 = 1.0 }
            Button(action: {
                print("tapped")
            }) {
                Circle()
                    .opacity(opacityCircle2)
                    .animate(using: Animation.easeInOut(duration: 2).delay(3)) { self.opacityCircle2 = 1.0 }
            }
            .disabled(!animationsLoaded)
        }.onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 5) {
              self.animationsLoaded = true
            }
        }
    }
}

Переменная self.animationsLoaded введена для управления действиями для кнопок (если вы хотите, чтобы ваши кнопки реагировали только после завершения анимации).

1
pawello2222 15 Июн 2020 в 07:10