Awesome

@lottiefiles/dotLottie-ios

iOS player for .lottie and .json files.

Supported Devices

Currently this package supports a mimimum iOS version of 13.0+ for iPhone and iPad. MacOS is supported for versions 11.0 and upwards.

Usage

Full documentation available on the developer portal.

1. Install the dependancy

Via the Swift Package Manager

To install via Swift Package Manager, in the package finder in Xcode, search for LottieFiles/dotlottie-ios or use the full Github path: https://github.com/LottieFiles/dotlottie-ios

2. Import DotLottie

import DotLottie

3. How to use

The DotLottieAnimation class will store the playback settings of your animation. It will also allow you to control playback via the play / pause functions.

3a. SwiftUI

Set up DotLottieAnimation inside a View. Optionally pass playback settings.

Load from an animation (.lottie / .json) from the main asset bundle.

struct AnimationView: View {
    var body: some View {
        DotLottieAnimation(fileName: "cool_animation", config: AnimationConfig(autoplay: true, loop: true)).view()
    }
}

Load an animation (.lottie / .json) from the web.

struct AnimationView: View {
    var body: some View {
        DotLottieAnimation(
            webURL: "https://lottie.host/link.lottie"
        ).view()
    }
}

Load directly from a String (.json).

struct AnimationView: View {
    var body: some View {
        DotLottieAnimation(
            animationData: "{"v":"4.8.0","meta":{"g":"LottieFiles AE..."
        ).view()
    }
}

3b. UIKit - Storyboard

Coming soon!

3c. UIKit - Programmatic approach

class AnimationViewController: UIViewController {
    var simpleVM = DotLottieAnimation(webURL: "https://lottie.host/link.lottie", config: AnimationConfig(autoplay: true, loop: false))
    
    override func viewWillAppear(_ animated: Bool) {
        let dotLottieView = simpleVM.view()
        view.addSubview(dotLottieView)
    }
}

API

Properties

DotLottieAnimation instances expose the following properties:

Methods

DotLottieAnimation instances expose the following methods that can be used to control the animation:

Event callbacks

The DotLottieAnimation instance emits the following events that can be listened to via a class implementing the Observer protocol:

class YourDotLottieObserver: Observer {
    func onComplete() {
    }
    
    func onFrame(frameNo: Float) {
    }
    
    func onLoad() {
    }
    
    func onLoadError() {
    }
    
    func onLoop(loopCount: UInt32) {
    }
    
    func onPause() {
    }
    
    func onPlay() {
    }
    
    func onRender(frameNo: Float) {
    }
    
    func onStop() {
    }
}

// In your view code

var animation = DotLottieAnimation(...)
var animationView = DotLottieView(dotLottie: animation)
var myObserver = YourDotLottieObserver()

animationView.subscribe(observer: myObserver)