Skip to content

Anima is chainable Layer-Based Animation library for Swift5.

License

Notifications You must be signed in to change notification settings

satoshin21/Anima

Repository files navigation

Version License Platform language Version Build Status MIT License Platform Carthage compatible

Anima

Anima is chainable Layer-Based Animation library for Swift5.
It support to make sequensial and grouped animation more easily.

is written as follows.

let startAnimations: [AnimaType] = [.moveByY(-50), .rotateByZDegree(90)]
let moveAnimations: [AnimaType] = [.moveByX(50), .rotateByZDegree(90)]
let endAnimations: [AnimaType] = [.moveByY(-50), .rotateByZDegree(90)]

animaView.layer.anima
    .then(.opacity(1.0))
    .then(group: startAnimations)
    .then(group: moveAnimations, options: labelAnimaOption(index: 0))
    .then(group: moveAnimations, options: labelAnimaOption(index: 1))
    .then(group: moveAnimations, options: labelAnimaOption(index: 2))
    .then(group: moveAnimations, options: labelAnimaOption(index: 3))
    .then(group: endAnimations, options: labelAnimaOption(index: 4))
    .then(group: [.scaleBy(0.0), .opacity(0.0)])

func labelAnimaOption(index: Int) -> [AnimaOption] {
    let labelAnima = labels[index]?.layer.anima

    return [.completion({
        labelAnima?.then(.opacity(1)).fire()
    })]
}

Requirements

Anima require for Swift4 and greater than iOS9.0📱

Features

  • Almost all timing modes from easings.set are implemented.
  • Spring Animation ( featured by CASpringAnimation )
  • Type-Safed Animation KeyPath ()

Usage

Move Position

If you want to translate CALayer.position relatively, use .moveByX(CGFloat), .moveByY(CGFloat), .moveByXY(x: CGFloat, y: CGFloat) AnimaTypes.

layer.anima.then(.moveByX(50)).fire()

or destination is determined, use .moveTo(x: CGFloat, y: CGFloat).

※ Anima doesn't update CALayer.position value for animations. Because when update Layer-backed view's layer position value, It will be resetted to default value frequently.

Sequential Animation

Anima supports.

Group Animation

To run animation concurrently, you use CAAnimationGroup with CoreAnimation. In Anima, you can use Anima.then(group: ) to run some AnimaType concurrently.

Below is an example of how to run moving, scaling and rotating animations concurrently.

layer.anima
    .then(group: [.moveByX(200),
                .scaleBy(1.5),
                .rotateByZDegree(180)])
    .fire()

Animation Options

There are some options for Anima.

  • duration(TimeInterval)
  • timingFunction(TimingFunction) _ Change timing function defining the pacing of the animation. _ Default timing function is at Anima.defaultTimingFunction. If you do not set the timing function option, defaultTimingFunction is used. * Please read Anima.TimingFunction.swift
  • repeat(count: Float) * To run animation infinitely, set .infinity.
  • autoreverse
  • completion(() -> Void)

you can use these values as belows.

layer
    .anima
    .then(.moveByX(100), options: [.autoreverse,
                                   .timingFunciton(.easeInQuad),
                                   .repeat(count: 3),
                                   .completion({
                                    print("completion")
                                   })])
    .fire()

Rotate Animation & AnchorPoint

AnimaType has 3 rotation animation type, .rotateByX, .rotateByY, .rotateByZ. and each animation type has 2 value types, degrees and radians. you use whichever you like.

and CALayer has AnchorPoint. Rotating, moving, or other Animations are affected by it. Default value is (0.5, 0.5). AnimaType.moveAnchor(AnimaAnchorPoint) can move layer's AnchorPoint.

layer.anima
    .then(.rotateByZDegree(360))
    .then(.moveAnchor(.topLeft))
    .then(.rotateByZDegree(360))
    .fire()

or If you want to change only AnchorPoint, use Anima.then(setAnchor: AnimaAnchorPoint).

layer.anima
    .then(.rotateByZDegree(360))
    .then(setAnchor: .topLeft)
    .then(.rotateByZDegree(360))
    .fire()

Move Path

If you want to make moving animation more complex, use .movePath(path: CGPath, keyTymes: [Double]). Anima example app has sample of creating animation by drag gesture. you see it!

but It has any problems when you use with AnimaOption.autoreverse. so If you use it, please be careful of options.

Original KeyPath

If you want to animate other animatable values, You can use AnimaType.original(keyPath: String, from: Any?, to: Any) for it. CAEmitterLayer's animation is like this.

let layer = CAEmitterLayer()
layer.emitterPosition = CGPoint(x: 100.0, y:100.0)

layer.anima
    .then(.original(keyPath: #keyPath(CAEmitterLayer.emitterPosition), from: layer.emitterPosition, to: CGPoint(x: 200.0, y:200.0)))
    .fire()

Example

To run the example project, clone the repo, open Anima.xcodeproj, and run target Anima iOS Example.

Installation

Cocoapods

Anima is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "Anima"

# If you want to use Swift 3 version, Please specify Anima version.

pod "Anima", "0.5.1"

Carthage

Add github satoshin21/Anima to your Cartfile. Execute carthage update to install it.

Author

Satoshi Nagasaka, [email protected]

License

Anima is available under the MIT license. See the LICENSE file for more info.