Coder Social home page Coder Social logo

cats-oss / sica Goto Github PK

View Code? Open in Web Editor NEW
1.1K 37.0 57.0 12.79 MB

:deer: Simple Interface Core Animation. Run type-safe animation sequencially or parallelly

License: MIT License

Swift 96.34% Ruby 2.29% Objective-C 1.37%
swift animation ios cocoapods carthage macos tvos swift-package-manager

sica's Introduction

Simple Interface Core Animation

Sica

Platform Language Carthage
Swift Package Manager Version License

Sica can execute various animations sequentially or parallelly.

Features

  • Animation with duration and delay
  • parallel / sequence animation
  • Easings
  • Springs
  • Transition

Requirements

  • Xcode 9.3 or greater
  • iOS 9 or greater
  • tvOS 10.0 or greater
  • macOS 10.11 or greater
  • Swift 4.2 (since 0.3.4)

Installation

Carthage

If youโ€™re using Carthage, simply add Sica to your Cartfile:

github "cats-oss/Sica"

CocoaPods

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

pod 'Sica'

Swift Package Manager

Sica is available through SwiftPM, create Package.swift and add dependencies value

dependencies: [
    .package(url: "https://github.com/cats-oss/Sica.git", from: "0.4.1")
]

See also: GitHub - j-channings/swift-package-manager-ios: Example of how to use SPM v4 to manage iOS dependencies

Usage

Sample Animation

Sequence Animation

If you set .sequence, sequence animation is shown.

let animator = Animator(view: sampleView)
animator
    .addBasicAnimation(keyPath: .positionX, from: 50, to: 150, duration: 2, timingFunction: .easeOutExpo)
    .addSpringAnimation(keyPath: .boundsSize, from: sampleView.frame.size, to: CGSize(width: 240, height: 240), damping: 12, mass: 1, stiffness: 240, initialVelocity: 0, duration: 1)
    .run(type: .sequence)

SequenceAnimation

Parallel Animation

If you set .parallel, parallel animation is shown.

let animator = Animator(view: sampleView)
animator
    .addBasicAnimation(keyPath: .positionX, from: 50, to: 150, duration: 5, timingFunction: .easeOutExpo)
    .addBasicAnimation(keyPath: .transformRotationZ, from: 0, to: CGFloat.pi, duration: 3, timingFunction: .easeOutExpo)
    .run(type: .parallel)

ParallelAnimation

Forever Animation

If you set forever before calling run, forever animation is shown.

let animator = Animator(view: sampleView)
animator
    .addBasicAnimation(keyPath: .positionX, from: 50, to: 150, duration: 2, timingFunction: .easeOutExpo)
    .addBasicAnimation(keyPath: .positionX, from: 150, to: 50, duration: 2, timingFunction: .easeOutExpo)
    .forever(autoreverses: false)
    .run(type: .sequence)

Forever

Cancel

If you want to cancel animation, you should call cancel.

let animator = Animator(view: sampleView)
/*
Add animation and run
*/
animator.cancel() // Animation cancel

Remove Added Animations

If you call run and then you call add animation method, no animation will be added. If you use animator again, you call removeAll before addBasicAnimation or addSpringAnimation or addTransitionAnimation.

let animator = Animator(view: sampleView)
/*
Add animation and run
*/

// Bad
animator.addBasicAnimation() // ๐Ÿ™… you can't add animation

// Good
animator.removeAll()
        .addBasicAnimation() // ๐Ÿ™† You can add animation.

Functions

Add Animation

    public func addBasicAnimation<T>(keyPath: Sica.AnimationKeyPath<T>, from: T, to: T, duration: Double, delay: Double = default, timingFunction: Sica.TimingFunction = default) -> Self where T : AnimationValueType
    public func addSpringAnimation<T>(keyPath: Sica.AnimationKeyPath<T>, from: T, to: T, damping: CGFloat, mass: CGFloat, stiffness: CGFloat, initialVelocity: CGFloat, duration: Double, delay: Double = default, timingFunction: Sica.TimingFunction = default) -> Self where T : AnimationValueType
    public func addTransitionAnimation(startProgress: Float, endProgress: Float, type: Sica.Transition, subtype: Sica.TransitionSub, duration: Double, delay: Double = default, timingFunction: Sica.TimingFunction = default) -> Self

Add Animation Option

    public func delay(_ delay: Double) -> Self
    public func forever(autoreverses: Bool = default) -> Self

Animation Operation

    public func run(type: Sica.Animator.AnimationPlayType, isRemovedOnCompletion: Bool = default, completion: (() -> Swift.Void)? = default)
    public func cancel()
    public func removeAll() -> Self

Extensions

You can access sica property in UIView and CALayer.

let view = UIView(frame: ...)
view.sica
    .addBasicAnimation(keyPath: .positionX, from: 50, to: 150, duration: 2, timingFunction: .easeOutExpo)
    .run(type: .sequence)
let layer = CALayer()
layer.sica
    .addBasicAnimation(keyPath: .positionX, from: 50, to: 150, duration: 2, timingFunction: .easeOutExpo)
    .run(type: .sequence)

Support

Animation

  • CABasicAnimation
  • CATransition
  • CASpringAnimation

AnimationPlayType

you can choose animation play type

  • run animation sequentially
  • run animation parallelly

EasingFunctions

you can choose various timing functions

EasingFunctions

KeyPaths Table

Sica KeyPath
.anchorPoint anchorPoint
.backgroundColor backgroundColor
.borderColor borderColor
.borderWidth borderWidth
.bounds bounds
.contents contents
.contentsRect contentsRect
.cornerRadius cornerRadius
.filters filters
.frame frame
.hidden hidden
.mask mask
.masksToBounds masksToBounds
.opacity opacity
.path path
.position position
.shadowColor shadowColor
.shadowOffset shadowOffset
.shadowOpacity shadowOpacity
.shadowPath shadowPath
.shadowRadius shadowRadius
.sublayers sublayers
.sublayerTransform sublayerTransform
.transform transform
.zPosition zPosition

Anchor Point

Sica KeyPath
.anchorPointX anchorPoint.x
.anchorPointy anchorPoint.y

Bounds

Sica KeyPath
.boundsOrigin bounds.origin
.boundsOriginX bounds.origin.x
.boundsOriginY bounds.origin.y
.boundsSize bounds.size
.boundsSizeWidth bounds.size.width
.boundsSizeHeight bounds.size.height

Contents

Sica KeyPath
.contentsRectOrigin contentsRect.origin
.contentsRectOriginX contentsRect.origin.x
.contentsRectOriginY contentsRect.origin.y
.contentsRectSize contentsRect.size
.contentsRectSizeWidth contentsRect.size.width
.contentsRectSizeHeight contentsRect.size.height

Frame

Sica KeyPath
.frameOrigin frame.origin
.frameOriginX frame.origin.x
.frameOriginY frame.origin.y
.frameSize frame.size
.frameSizeWidth frame.size.width
.frameSizeHeight frame.size.height

Position

Sica KeyPath
.positionX position.x
.positionY position.y

Shadow Offset

Sica KeyPath
.shadowOffsetWidth shadowOffset.width
.shadowOffsetHeight shadowOffset.height

Sublayer Transform

Sica KeyPath
.sublayerTransformRotationX sublayerTransform.rotation.x
.sublayerTransformRotationY sublayerTransform.rotation.y
.sublayerTransformRotationZ sublayerTransform.rotation.z
.sublayerTransformScaleX sublayerTransform.scale.x
.sublayerTransformScaleY sublayerTransform.scale.y
.sublayerTransformScaleZ sublayerTransform.scale.z
.sublayerTransformTranslationX sublayerTransform.translation.x
.sublayerTransformTranslationY sublayerTransform.translation.y
.sublayerTransformTranslationZ sublayerTransform.translation.z

Transform

Sica KeyPath
.transformRotationX transform.rotation.x
.transformRotationY transform.rotation.y
.transformRotationZ transform.rotation.z
.transformScaleX transform.scale.x
.transformScaleY transform.scale.y
.transformScaleZ transform.scale.z
.transformTranslationX transform.translation.x
.transformTranslationY transform.translation.y
.transformTranslationZ transform.translation.z

License

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

sica's People

Contributors

dekatotoro avatar funzin avatar marty-suzuki avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sica's Issues

fillMode uses fixed value

Hi. Thank you for good library.

Is there any reason why fillMode is fixed value?

group.fillMode = FillMode.forwards.rawValue

and why isRemovedOnCompletion's default value is false? even though CAAnimation's default value is true.

public func run(type: AnimationPlayType, isRemovedOnCompletion: Bool = false, completion: (() -> Void)? = nil) {

ๆ—ฅๆœฌ่ชžใฎ่ชฌๆ˜Žใฏไปฅไธ‹ใ‚’ๅ‚่€ƒใ—ใฆใใ ใ•ใ„ใ€‚
https://qiita.com/hachinobu/items/57d4c305c907805b4a53#comment-0709844b92e4f16057aa

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.