skip to Main Content

I have problem with lottie animations, I have some kind of onboarding on my app and what I would like to achive is to everytime view in collectionview is changed, to start my animation, I have 4 pages and 4 different lottie animations. Currently if I call animation.play() function, once app is started, all of my animations are played at the same time, so once I get to my last page, animation is over. And I want my lottie to be played only once, when view is shown.

This is my cell

class IntroductionCollectionViewCell: UICollectionViewCell {

@IBOutlet var title: UILabel!
@IBOutlet var subtitleDescription: UILabel!
@IBOutlet var animationView: AnimationView!

override func awakeFromNib() {
    super.awakeFromNib()
}
    
public func configure(with data: IntroInformations) {
    let animation = Animation.named(data.animationName)
    
    title.text = data.title
    subtitleDescription.text = data.description
    animationView.animation = animation
}

static func nib() -> UINib {
    return UINib(nibName: "IntroductionCollectionViewCell", bundle: nil)
  }
}

This is how my collection view is set up

extension IntroductionViewController {

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 0
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    pages.count
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "IntroductionCollectionViewCell", for: indexPath) as! IntroductionCollectionViewCell
    
    cell.configure(with: pages[indexPath.row])
    cell.animationView.loopMode = .loop
    cell.animationView.play()
    
    return cell
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: view.frame.width, height: view.frame.height)
}

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    let scrollPos = scrollView.contentOffset.x / view.frame.width
    self.pageControl.currentPage = Int(floorf(Float(scrollPos)))
    
    let n = pageControl.numberOfPages
    
    if self.pageControl.currentPage == n - 1 {
        continueButton.isHidden = false
    } else {
        continueButton.isHidden = true
    }
}
}

Thanks in advance!!

3

Answers


  1. Chosen as BEST ANSWER
      if let cell = cell as? IntroductionCollectionViewCell {
         cell.animationView.loopMode = .playOnce
         cell.animationView.play()
      }
    

    this is the answer, I need to check is cell once is loaded my cell where lottie animation is


  2. You can use the collectionViewDelegate willDisplay and didEndDisplaying methods to start/stop the animations. And not when configuring the cell. – https://developer.apple.com/documentation/uikit/uicollectionviewdelegate
    If you want the animation to run only once dont use the loop option.

    Login or Signup to reply.
  3. scrollViewDidEndScrollingAnimation use this method on UICollectionViewDelegateFlowLayout and implement the functionality for pause or play the lottie.

    hope it would help.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search