Elephant

This is SVG animation presentation kit for iOS.

Example

You can run example app. Please open Example-iOS/Elephant-iOS.xcworkspace!

Elephant

Usage

You can display the svg image with animation.

We are supportted two animation formats?

The format is below.

  • Animation in SVG
  • Animation in CSS

Usage is difference by the format.

SVGView initialization

This is initialization SVGView for format 1 (Animation in SVG) usage.

SVGView(named: "svg-filename", animationOwner: .svg)

This is initialization SVGView for format 2 (Animation in CSS) usage.

SVGView(named: "svg-filename", animationOwner: .css, style: .cssFile(name: "css-filename"))

Show in your ViewController

And, you initialized view, you have to do is only add view to parent view, and start animation like below.

class ViewController: UIViewController {
    let svgView = SVGView(named: "image", animationOwner: .svg)

    override func viewDidLoad() {
        super.viewDidLoad()

        view.addSubview(svgView)
        svgView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            svgView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            svgView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            svgView.widthAnchor.constraint(equalToConstant: 400),
            svgView.heightAnchor.constraint(equalToConstant: 400),
        ])

        svgView.startAnimation() 

        // svgView.stopAnimation()    // Stop animation.

        // svgView.isAnimate { [weak self] (value, error) in
        //     if let error = error {
        //         print(error)
        //     } 
        //     guard let value = value else { return } // value means whether animation is moving.
        // }
    }
}

Requirements

  • Xcode 10.2
  • Swift 5.0

Installation

CocoaPods

Add this to Podfile

pod 'Elephant'

$ pod install

Carthage

Add this to Cartfile

github "kzumu/Elephant"

$ carthage update --platform ios

GitHub