{"id":2311,"url":"https://github.com/Draveness/DKChainableAnimationKit","last_synced_at":"2025-08-02T23:32:58.115Z","repository":{"id":32017826,"uuid":"35588993","full_name":"draveness/DKChainableAnimationKit","owner":"draveness","description":"A DSL to make animation easy on iOS with Swift.","archived":true,"fork":false,"pushed_at":"2019-09-12T10:12:14.000Z","size":2658,"stargazers_count":1892,"open_issues_count":13,"forks_count":110,"subscribers_count":41,"default_branch":"master","last_synced_at":"2025-07-04T04:49:37.200Z","etag":null,"topics":["animation","animation-chain","animation-effects","chainable-animations","swift"],"latest_commit_sha":null,"homepage":"","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/draveness.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-05-14T03:37:22.000Z","updated_at":"2025-06-24T19:15:55.000Z","dependencies_parsed_at":"2022-07-30T05:37:50.986Z","dependency_job_id":null,"html_url":"https://github.com/draveness/DKChainableAnimationKit","commit_stats":null,"previous_names":["draveness/dkanimationkit"],"tags_count":15,"template":false,"template_full_name":null,"purl":"pkg:github/draveness/DKChainableAnimationKit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/draveness%2FDKChainableAnimationKit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/draveness%2FDKChainableAnimationKit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/draveness%2FDKChainableAnimationKit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/draveness%2FDKChainableAnimationKit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/draveness","download_url":"https://codeload.github.com/draveness/DKChainableAnimationKit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/draveness%2FDKChainableAnimationKit/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268473067,"owners_count":24255818,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-02T02:00:12.353Z","response_time":74,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["animation","animation-chain","animation-effects","chainable-animations","swift"],"created_at":"2024-01-05T20:16:10.545Z","updated_at":"2025-08-02T23:32:57.757Z","avatar_url":"https://github.com/draveness.png","language":"Swift","funding_links":[],"categories":["UI","Libs","Animation","Animation [🔝](#readme)"],"sub_categories":["Animation","Other free courses"],"readme":"![](./Gifs/DKChainableAnimationKit.jpg)\n\n\u003cp align='center'\u003e\n  \u003ca href='#'\u003e\u003cimg src=\"https://img.shields.io/badge/Language-%20Swift%20-orange.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"http://cocoadocs.org/docsets/DKChainableAnimationKit\"\u003e\u003cimg src=\"https://img.shields.io/cocoapods/p/DKChainableAnimationKit.svg?style=flat\"\u003e\u003c/a\u003e\n  \u003ca href='https://travis-ci.org/Draveness/DKChainableAnimationKit'\u003e\u003cimg src=\"https://travis-ci.org/Draveness/DKChainableAnimationKit.svg?branch=master\"\u003e\u003c/a\u003e\n  \u003ca href='#'\u003e\u003cimg src=\"https://img.shields.io/github/license/mashape/apistatus.svg\"\u003e\u003c/a\u003e\n  \u003ca href='#'\u003e\u003cimg src=\"https://img.shields.io/badge/platform-%20iOS%20-lightgrey.svg\"\u003e\u003c/a\u003e\n  \u003ca href='https://github.com/Carthage/Carthage'\u003e\u003cimg src=\"https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd width=\"75%\"\u003e\n\u003cimg src=\"./Gifs/Code1.png\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"25%\"\u003e\n\u003cimg src=\"./Gifs/Demo1.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003c/tr\n\u003ctr\u003e\n\u003ctd width=\"75%\"\u003e\n\u003cimg src=\"./Gifs/Code2.png\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"25%\"\u003e\n\u003cimg src=\"./Gifs/Demo2.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\nThis project is highly inspired by JHChainableAnimations, **If you project is developed with Objective-C, use [JHChainableAnimations](https://github.com/jhurray/JHChainableAnimations) instead.**\n\n## With DKChainableAnimationKit\n\nUsing DKChainableAnimationKit, you do not need to write the **extra parentheses**.\n\n```\nview.animation.makeScale(2.0).spring.animate(1.0)\n```\n\n# Installation with CocoaPods\n\n[CocoaPods](https://cocoapods.org/) is a dependency manager for Objective-C, which automates and simplifies the process of using 3rd-party libraries like DKNightVersion in your projects. See the [Get Started section](https://cocoapods.org/#get_started) for more details.\n\n## Podfile\n\n```\nuse_frameworks!\n\npod \"DKChainableAnimationKit\", \"~\u003e 2.0.0\"\n```\n\n# Installation with Carthage\n\n[Carthage](https://github.com/Carthage/Carthage) is a depency manager for Objectiv-C and Swift. \n\n## Cartfile\n```\ngithub \"Draveness/DKChainableAnimationKit\"\n```\n\n# Usage\n\nImport DKChainableAnimationKit in proper place.\n\n```\nimport DKChainableAnimationKit\n```\n\nDKChainableAnimationKit is designed to be extremely easy to use. First call `animation` method on `UIView` instance, and then add the animation you want followed by a `animate(t)` method.\n\n\n```\nview.animation.moveX(100.0).animate(1.0)\n```\n\n## Animating\n\nChainable properties or functions like **`moveX(x)`** must come between the **`animate(duration)`** function.\n\n```\nview.animation.moveX(100.0).animate(1.0)\n```\n\nIf you want mutiple animation at one time.\n\n```\nview.animation.moveX(100.0).moveY(100.0).animate(1.0)\n```\n\nThis will move the view 100 point right and 100 point down at the same time. Order is not important.\n\n## Chaining Animations\n\nTo chain animations separate the chains with the **thenAfter(duration)** function.\n\n```\nview.animation.moveX(100.0).thenAfter(1.0).makeScale(2.0).animate(2.0)\n```\n\nThis will move the view for one second and after moving, it will scale for two seconds.\n\n## Animation Effects\n\nTo add animation effect, call the effect method after the chainable property you want it to apply it.\n\nBelow is an example of moving a view with a spring effect.\n\n```\nview.animation.moveX(10).spring.animate(1.0)\n```\n\nIf you add two animation effect, the first will be cancel out.\n\n```\nview.animation.moveX(10).spring.bounce.animate(1.0)\n// The same as view.animation.moveX(10).bounce.animate(1.0)\n```\n\n## Anchoring\n\nTo anchor your view call an anchoring method at some point in an animation chain. And if you add two anchoring property, the first will be cancel like effects.\n\n```\nview.animation.rotate(180).anchorTopLeft.thenAfter(1.0).rotate(90).anchorCenter.animanimation\n```\n\n## Delay\n\nTo delay an animation call the **`wait(time)`** or **`delay(time)`** chainable function.\n\n```\nview.animation.moveXY(100, 40).wait(0.5).animate(1.0)\nview.animation.moveXY(100, 40).delay(0.5).animate(1.0)\ndelay\n```\n\nThis will move the view after 0.5 second delay.\n\n## Completion\n\nIf you want to run code after an animation finishes, you are supposed to set the **`animationCompletion`** property or call **`animateWithCompletion(t, completion)`** function.\n\n```\nview.animation.makeX(0).animateWithCompletion(1.0, {\n    println(\"Animation Done\")\n})\n```\n\nThis is the same as\n\n```\nview.animation.animationCompletion = {\n    println(\"Animation Done\")\n}\nview.animation.makeX(0).animate(1.0)\n```\n\nAnd also the same as\n\n```\nview.animation.makeX(0).animate(1.0).animationCompletion = {\n    println(\"Animation Done\")\n}\n```\n\n## Bezier Paths\n\nYou can also animate a view along a UIBezierPath. Call `bezierPathForAnimation` method first and then add points or curves to it and us it in a chainable property.\n\n```\nlet path = view.animation.bezierPathForAnimation()\npath.addLintToPoint(CGPoint(x: 30, y: 40))\nview.animation.moveOnPath(path).animate(1.0)\n```\n\nAnimation effects does not work on path movement.\n\n----\n\n# Chainable Properties\n\n\u003ctable\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/moveX.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emoveX(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/moveY.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emoveY(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/moveWidth.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emoveWidth(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/moveHeight.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emoveHeight(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/moveXY.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emoveXY(100.0, 100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeX.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeX(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeY.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeY(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeOrigin.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeOrigin(100.0, 100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeCenter.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeCenter(100.0, 100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeWidth.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeWidth(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeHeight.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeHeight(100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeHeight.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeSize(100.0, 100.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeFrame.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeFrame(rect) // let rect: CGRect\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeBounds.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeBounds(rect) // let rect: CGRect\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeScale.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeScale(2.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeScaleX.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeScaleX(2.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeScaleY.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeScaleY(2.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeOpacity.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeOpacity(0.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeBackground.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeBackground(purple) // let purple: UIColor\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeBorderColor.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeBorderColor(red) // let red: UIColor\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeBorderWidth.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeBorderWidth(10.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\n\u003ctr\u003e\n\u003ctd width=\"20%\"\u003e\n\u003cimg src=\"./Gifs/Demo/makeCornerRadius.gif\"\u003e\u003c/img\u003e\n\u003c/td\u003e\n\u003ctd width=\"80%\"\u003e\n\u003ccode\u003emakeCornerRadius(25.0)\u003c/code\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n# To Do\n\n* Support OS X\n* Support Swift 2.0\n\n----\n\n# Contact\n\n* If you have some advice open an issue or a PR.\n* Email [Draveness](mailto: i@draveness.me)\n\n# License\n\nDKChainableAnimationKit is available under the MIT license. See the LICENSE file for more info.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FDraveness%2FDKChainableAnimationKit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FDraveness%2FDKChainableAnimationKit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FDraveness%2FDKChainableAnimationKit/lists"}