{"id":13428397,"url":"https://github.com/alexjlockwood/kyrie","last_synced_at":"2025-04-13T02:07:31.996Z","repository":{"id":55534194,"uuid":"119093169","full_name":"alexjlockwood/kyrie","owner":"alexjlockwood","description":"🍀 Animated Vector Drawables on steroids 🍀","archived":false,"fork":false,"pushed_at":"2020-12-23T12:26:04.000Z","size":3195,"stargazers_count":1068,"open_issues_count":12,"forks_count":45,"subscribers_count":27,"default_branch":"master","last_synced_at":"2025-04-13T02:07:30.549Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/index.html","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alexjlockwood.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":"2018-01-26T19:19:55.000Z","updated_at":"2025-03-23T11:05:35.000Z","dependencies_parsed_at":"2022-08-15T02:40:50.887Z","dependency_job_id":null,"html_url":"https://github.com/alexjlockwood/kyrie","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexjlockwood%2Fkyrie","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexjlockwood%2Fkyrie/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexjlockwood%2Fkyrie/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alexjlockwood%2Fkyrie/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alexjlockwood","download_url":"https://codeload.github.com/alexjlockwood/kyrie/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248654095,"owners_count":21140236,"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","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":[],"created_at":"2024-07-31T01:00:55.917Z","updated_at":"2025-04-13T02:07:31.972Z","avatar_url":"https://github.com/alexjlockwood.png","language":"Kotlin","funding_links":[],"categories":["Libraries","etc"],"sub_categories":[],"readme":"# Kyrie\n\n[![Build status][travis-badge]][travis-badge-url]\n[![Download](https://api.bintray.com/packages/alexjlockwood/maven/kyrie/images/download.svg)](https://bintray.com/alexjlockwood/maven/kyrie/_latestVersion)\n\nKyrie is a superset of Android's `VectorDrawable` and `AnimatedVectorDrawable` classes: it can do everything they can do and more.\n\n![Screen capture of tool](art/screencap.gif)\n\n## Motivation\n\n`VectorDrawable`s are great because they provide density independence—they can be scaled arbitrarily on any device without loss of quality. `AnimatedVectorDrawable`s make them even more awesome, allowing us to animate specific properties of a `VectorDrawable` in a variety of ways.\n\nHowever, these two classes have three main limitations:\n\n1. They can't be paused, resumed, or seeked.\n2. They can't be dynamically created at runtime (they must be inflated from a drawable resource).\n3. They only support a small subset of features that SVGs provide on the web.\n\nKyrie was created in order to address these problems.\n\n## Getting started\n\nTo create an animation using Kyrie, you first need to build a [`KyrieDrawable`][kyriedrawable]. There are two ways to do this:\n\n### Option #1: from an existing VD/AVD resource\n\nWith Kyrie, you can convert an existing `VectorDrawable` or `AnimatedVectorDrawable` resource into a `KyrieDrawable` with a single line:\n\n```kotlin\nval drawable = KyrieDrawable.create(context, R.drawable.my_vd_or_avd);\n```\n\n### Option #2: programatically using a [`KyrieDrawable.Builder`][kyriedrawable#builder]\n\nYou can also build `KyrieDrawable`s at runtime using the builder pattern. `KyrieDrawable`s are similar to SVGs and `VectorDrawable`s in that they are tree-like structures built of [`Node`][node]s. As you build the tree, you can optionally assign [`Animation`][animation]s to the properties of each `Node` to create an animatable `KyrieDrawable`.\n\nHere is a snippet of code from the [sample app][sample-app-source-code] that builds a material design circular progress indicator:\n\n```kotlin\nval drawable =\n    kyrieDrawable {\n        viewport = size(48f, 48f)\n        tint = Color.RED\n        group {\n            translateX(24f)\n            translateY(24f)\n            rotation(\n                Animation.ofFloat(0f, 720f)\n                    .duration(4444)\n                    .repeatCount(Animation.INFINITE)\n            )\n            path {\n                strokeColor(Color.WHITE)\n                strokeWidth(4f)\n                trimPathStart(\n                    Animation.ofFloat(0f, 0.75f)\n                        .duration(1333)\n                        .repeatCount(Animation.INFINITE)\n                        .interpolator(\"M 0 0 h .5 C .7 0 .6 1 1 1\".asPathInterpolator())\n                )\n                trimPathEnd(\n                    Animation.ofFloat(0.03f, 0.78f)\n                        .duration(1333)\n                        .repeatCount(Animation.INFINITE)\n                        .interpolator(\"M 0 0 c .2 0 .1 1 .5 1 C 1 1 1 1 1 1\".asPathInterpolator())\n                )\n                trimPathOffset(\n                    Animation.ofFloat(0f, 0.25f)\n                        .duration(1333)\n                        .repeatCount(Animation.INFINITE)\n                )\n                strokeLineCap(StrokeLineCap.SQUARE)\n                pathData(\"M 0 -18 a 18 18 0 1 1 0 36 18 18 0 1 1 0 -36\")\n            }\n        }\n    }\n```\n\n## Features\n\nKyrie supports 100% of the features that `VectorDrawable`s and `AnimatedVectorDrawable`s provide. It also extends the functionality of `VectorDrawable`s and `AnimatedVectorDrawable`s in a number of ways, making it possible to create even more powerful and elaborate scalable assets and animations.\n\n### `VectorDrawable` features\n\nIn addition to the features supported by `VectorDrawable`, Kyrie provides the following:\n\n#### `\u003cpath\u003e` features\n\n- `CircleNode`. Equivalent to the `\u003ccircle\u003e` node in SVG.\n- `EllipseNode`. Equivalent to the `\u003cellipse\u003e` node in SVG.\n- `LineNode`. Equivalent to the `\u003cline\u003e` node in SVG.\n- `RectangleNode`. Equivalent to the `\u003crect\u003e` node in SVG.\n- `strokeDashArray` (`FloatArray`). Equivalent to the `stroke-dasharray` attribute in SVG.\n- `strokeDashOffset` (`Float`). Equivalent to the `stroke-dashoffset` attribute in SVG.\n- `isScalingStroke` (`Boolean`). Equivalent to `vector-effect=\"non-scaling-stroke\"` in SVG. Defines whether a path's stroke width will be affected by scaling transformations.\n- The `strokeMiterLimit` attribute is animatable.\n\n#### `\u003cclip-path\u003e` features\n\n- `FillType` (either `NON_ZERO` or `EVEN_ODD`). Equivalent to the `clip-rule` attribute in SVG.\n- `ClipType` (either `INTERSECT` or `DIFFERENCE`). Defines whether the clipping region is additive or subtractive.\n\n#### `\u003cgroup\u003e` features\n\n- Transformations (`pivot`, `scale`, `rotation`, and `translation`) can be set on _any_ `Node`, not just `GroupNode`s.\n\n### `AnimatedVectorDrawable` features\n\nIn addition to the features supported by `AnimatedVectorDrawable`, Kyrie provides the following:\n\n- [`setCurrentPlayTime(long)`][kyriedrawable#setcurrentplaytime].\n  - Allows you to manually scrub the animation.\n- [`pause()`][kyriedrawable#pause] and [`resume()`][kyriedrawable#resume].\n  - Allows you to pause and resume the animation.\n- [`addListener(KyrieDrawable.Listener)`][kyriedrawable#addlistener].\n  - Allows you to listen for the following animation events: start, update, pause, resume, cancel, and end.\n\n## Further reading\n\n- Check out [this blog post][adp-blog-post] for more on the motivation behind the library.\n- Check out [the sample app][sample-app-source-code] for example usages in both Java and Kotlin.\n- Check out [the documentation][documentation] for a complete listing of all supported `Animation`s and `Node`s that can be used when constructing `KyrieDrawable`s programatically.\n\n## Dependency\n\nAdd this to your root `build.gradle` file (_not_ your module's `build.gradle` file):\n\n```gradle\nallprojects {\n    repositories {\n        // ...\n        jcenter()\n    }\n}\n```\n\nThen add the library to your module's `build.gradle` file:\n\n```gradle\ndependencies {\n    // ...\n    implementation 'com.github.alexjlockwood:kyrie:0.2.1'\n}\n```\n\n## Compatibility\n\n- **Minimum Android SDK**: Kyrie requires a minimum API level of 14.\n- **Compile Android SDK**: Kyrie requires you to compile against API 28 or later.\n\n[travis-badge]: https://travis-ci.org/alexjlockwood/kyrie.svg?branch=master\n[travis-badge-url]: https://travis-ci.org/alexjlockwood/kyrie\n[kyriedrawable]:https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/index.html\n[node]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-node/index.html\n[animation]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-animation/index.html\n[progressfragment]: https://github.com/alexjlockwood/kyrie/blob/master/sample/src/main/java/com/example/kyrie/ProgressFragment.kt\n[kyriedrawable#setcurrentplaytime]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/current-play-time.html\n[kyriedrawable#pause]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/pause.html\n[kyriedrawable#resume]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/resume.html\n[kyriedrawable#addlistener]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/add-listener.html\n[kyriedrawable#builder]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/-kyrie-drawable/-builder/index.html\n[documentation]: https://alexjlockwood.github.io/kyrie/com.github.alexjlockwood.kyrie/index.html\n[sample-app-source-code]: https://github.com/alexjlockwood/kyrie/tree/master/sample/src/main/java/com/example/kyrie\n[adp-blog-post]: https://www.androiddesignpatterns.com/2018/03/introducing-kyrie-animated-vector-drawables.html\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexjlockwood%2Fkyrie","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falexjlockwood%2Fkyrie","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falexjlockwood%2Fkyrie/lists"}