Jatin
Jatin

Reputation: 1

Append item in list with slide animation

I have one view named CongratulationOverlay, and in bottom there is one horizontal list. Now I want that overlay view to slide in to the horizontal list as I am appending that into list. and CongratulationOverlay when this will display it will close automatic after 1 second and when it's hidden, it should slide in that list.

Group {
    if let turntableAward = luckyWheelVM.turntableAward, !turntableAward.isEmpty {
        ScrollView(.horizontal, showsIndicators: false) {
            HStack(spacing: 0) {
                ForEach(0..<turntableAward.count, id: \.self) { i in
                    CongratulationCard(amount: 
                        luckyWheelVM.amountTypeFormat(type: turntableAward[i].awardType ?? 0,
                                                      amount: turntableAward[i].awardAmount ?? 0)) {
                            congratsCardIndex = i
                            totalAmount = luckyWheelVM.amountTypeFormat(type: turntableAward[i].awardType ?? 0, amount: turntableAward[i].awardAmount ?? 0)
                            popupType = .claim
                            isShowCongratCard = true
                    }
                }
            }
        }.frame(width: UIScreen.screenWidth - 30, height: 120)
    } else {
        CustomText("No Prize Won", textColor: .white, font: .robotoBold(size: 24))
    }
}
 .overlay {
    let value = luckyWheelVM.amountTypeFormat(
        type: luckyWheelVM.successSpin?.awardType ?? 0,
        amount: luckyWheelVM.successSpin?.awardAmount ?? 0
    )
    GeometryReader { geometry in
        CongratulationOverlay(isShowCongratCard: $isShowCongratCard, popupType: $popupType, amount: popupType == .winCard ? value : totalAmount, onClaim: {
            if popupType == .claim {
                isShowCongratCard = false
                if let turntableAward = luckyWheelVM.turntableAward, !turntableAward.isEmpty {
                    luckyWheelVM.onReceiveTurnTable(activityId: activityId,
                                                    recordId: turntableAward[congratsCardIndex].recordID ?? 0) { success in
                        if success {
                            luckyWheelVM.turntableAward?.remove(at: congratsCardIndex)
                            withAnimation {
                                viewModel.getUserMoneyData { _ in
                                    userMoney = UserDataManager.shared.getUserMoney()
                                }
                            }
                        }
                    }
                }
            } else if popupType == .claimAll {
                claimAll()
            }
        }, onClose: {
            isShowCongratCard = false
        }).position(x: geometry.size.width / 2, y: geometry.size.height / 2)
            .transition(.move(edge: .bottom).combined(with: .opacity))
    }
}

For expecting result please watch below video

https://drive.google.com/file/d/1J3iCeveLNzjGlbuGN76-G6DTkc_Rkowa/view?usp=sharing

Upvotes: 0

Views: 27

Answers (0)

Related Questions