• Stars
    star
    1,056
  • Rank 43,667 (Top 0.9 %)
  • Language
    Swift
  • License
    MIT License
  • Created over 6 years ago
  • Updated almost 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

๐ŸฆŒ Simple Interface Core Animation. Run type-safe animation sequencially or parallelly

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.

More Repositories

1

android-gpuimage

Android filters based on OpenGL (idea from GPUImage for iOS)
Java
8,952
star
2

VideoCast-Swift

A framework for broadcasting live video
Swift
190
star
3

Chausie

Chausie provides a customizable view containers that manages navigation between pages of content. ๐Ÿฑ
Swift
178
star
4

Unio

๐Ÿ”„ KeyPath based Unidirectional Input / Output framework with RxSwift.
Swift
159
star
5

use-intersection

React Hooks for IntersectionObserver.
TypeScript
108
star
6

android-tab-animation

Easily create TabLayout.Tab animations that sync with the scrolling progress of ViewPager
Kotlin
104
star
7

android-license-sample

Kotlin
86
star
8

AcknowledgementsPlist

AcknowledgementsPlist manages the licenses of libraries that depend on your iOS app.
Swift
76
star
9

Matcha

๐Ÿต Matcha is Framework that can get parameters from URL Path.
Swift
58
star
10

grpc-swift-client

๐Ÿ” Client-side library that depends on SwiftGRPC which is a library of gRPC written in Swift.
Swift
49
star
11

cujira

๐Ÿณ cujira is a command line tool that makes easy to show issue list from Jira.
Swift
48
star
12

fastlane-plugin-firebase_test_lab_android

Test your app with Firebase Test Lab with ease using fastlane for Android
Ruby
48
star
13

RxDucks

๐Ÿฆ† RxDucks is a Redux-like framework working on RxSwift.
Swift
40
star
14

Ship

๐Ÿšข Ship is a APIKit plugin that can inject common processing to requests on APIKit.
Swift
28
star
15

yarn-outdated-notifier

๐Ÿš€ Add link to CHANGELOG the result of $ yarn outdated, and notify to GitHub Issue.
JavaScript
25
star
16

Degu

๐Ÿญ Degu is debug utility for iOS, tvOS and macOS.
Swift
24
star
17

Mag

๐ŸงฒMag is Framework which wraps NSLayoutAnchor.
Swift
21
star
18

kite

A Kotlin DSL to bind Android UI components to your app state.
Kotlin
20
star
19

github-action-auto-assign

The GitHub Actions assigns reviewers & changes the status labels.
JavaScript
18
star
20

xcbt

โŒ›๏ธxcbt shows Xcode build time of a specified project.
Swift
14
star
21

intly

intly is Type-safe (TS friendly) i18n library.
TypeScript
12
star
22

ts-proto-optimize

It's CLI tool for optimize TypeScript protobuf type-definition file.
TypeScript
9
star
23

fastlane-plugin-accessibility_test

Java
8
star
24

ExtensionProperty

๐Ÿ—œThe utility interface for Associated Object
Swift
8
star
25

fastlane-plugin-snapshot_test

Ruby
7
star
26

docker-node-headless-chrome-ja

๐Ÿณ Docker image for headless Chrome.
Dockerfile
6
star
27

github-action-detect-unmergeable

The GitHub Action to detect an unmergeable pull request on changing its upstream.
Go
5
star
28

eslint-config-abema

This project is presets of eslint configurations which we used in our some internal projects.
JavaScript
4
star
29

docker-node-headless-chrome

Docker Image for Chrome headless.
Dockerfile
3
star
30

fastlane-plugin-screenshot_notifier

2
star
31

hugo-cats-studio

A simple and minimal Hugo theme.
CSS
1
star