{"id":15030439,"url":"https://github.com/samsung/rlottie","last_synced_at":"2025-05-15T15:05:37.418Z","repository":{"id":39647361,"uuid":"170099639","full_name":"Samsung/rlottie","owner":"Samsung","description":"A platform independent standalone library that plays Lottie Animation. ","archived":false,"fork":false,"pushed_at":"2024-08-26T08:03:16.000Z","size":13135,"stargazers_count":1246,"open_issues_count":74,"forks_count":241,"subscribers_count":25,"default_branch":"master","last_synced_at":"2025-04-07T17:06:48.231Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"C++","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Samsung.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"COPYING","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":"AUTHORS","dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-02-11T09:12:16.000Z","updated_at":"2025-04-02T10:47:50.000Z","dependencies_parsed_at":"2023-02-16T00:30:59.589Z","dependency_job_id":"38a14415-65b5-47a8-a23b-d3c4df34d390","html_url":"https://github.com/Samsung/rlottie","commit_stats":{"total_commits":876,"total_committers":40,"mean_commits":21.9,"dds":0.365296803652968,"last_synced_commit":"e3026b1e1a516fff3c22d2b1b9f26ec864f89a82"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samsung%2Frlottie","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samsung%2Frlottie/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samsung%2Frlottie/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samsung%2Frlottie/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Samsung","download_url":"https://codeload.github.com/Samsung/rlottie/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254364270,"owners_count":22058878,"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-09-24T20:13:21.006Z","updated_at":"2025-05-15T15:05:37.388Z","avatar_url":"https://github.com/Samsung.png","language":"C++","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# rlottie\n\n[![Build Status](https://travis-ci.org/Samsung/rlottie.svg?branch=master)](https://travis-ci.org/Samsung/rlottie)\n[![Build status](https://ci.appveyor.com/api/projects/status/n3xonxk1ooo6s7nr?svg=true\u0026passingText=windows%20-%20passing)](https://ci.appveyor.com/project/smohantty/rlottie-mliua)\n[![Gitter](https://badges.gitter.im/rLottie-dev/community.svg)](https://gitter.im/rLottie-dev/community?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge)\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"240\" height=\"240\" src=\"https://github.com/Samsung/rlottie/blob/master/.Gifs/logo.png\"\u003e\n\u003c/p\u003e\n\nrlottie is a platform independent standalone c++ library for rendering vector based animations and art in realtime.\n\nLottie loads and renders animations and vectors exported in the bodymovin JSON format. Bodymovin JSON can be created and exported from After Effects with [bodymovin](https://github.com/bodymovin/bodymovin), Sketch with [Lottie Sketch Export](https://github.com/buba447/Lottie-Sketch-Export), and from [Haiku](https://www.haiku.ai).\n\nFor the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand. Since the animation is backed by JSON they are extremely small in size but can be large in complexity!\n\nHere are small samples of the power of Lottie.\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/Samsung/rlottie/blob/master/.Gifs/1.gif\"\u003e\n  \u003cimg src=\"https://github.com/Samsung/rlottie/blob/master/.Gifs/2.gif\"\u003e\n  \u003cimg src=\"https://github.com/airbnb/lottie-ios/blob/master/_Gifs/Examples1.gif\"\u003e\n\u003c/p\u003e\n\n## Contents\n- [Building Lottie](#building-lottie)\n\t- [Meson Build](#meson-build)\n\t- [Cmake Build](#cmake-build)\n\t- [Test](#test)\n- [Demo](#demo)\n- [Previewing Lottie JSON Files](#previewing-lottie-json-files)\n- [Quick Start](#quick-start)\n- [Dynamic Property](#dynamic-property)\n- [Supported After Effects Features](#supported-after-effects-features)\n- [Issues or Feature Requests?](#issues-or-feature-requests)\n\n## Building Lottie\nrlottie supports [meson](https://mesonbuild.com/) and [cmake](https://cmake.org/) build system. rlottie is written in `C++14`. and has a public header dependency of `C++11`\n\n### Meson Build\ninstall [meson](http://mesonbuild.com/Getting-meson.html) and [ninja](https://ninja-build.org/) if not already installed.\n\nRun meson to configure rlottie\n```\nmeson build\n```\nRun ninja to build rlottie\n```\nninja -C build\n```\n\n### Cmake Build\n\nInstall [cmake](https://cmake.org/download/) if not already installed\n\nCreate a build directory for out of source `build`\n```\nmkdir build\n```\nRun cmake command inside `build` directory to configure rlottie.\n```\ncd build\ncmake ..\n\n# install in a different path. eg ~/test/usr/lib\ncmake -DCMAKE_INSTALL_PREFIX=~/test ..\n\n# static build\ncmake -DBUILD_SHARED_LIBS=OFF ..\n```\nRun make to build rlottie\n\n```\nmake -j 2\n```\nTo install rlottie library\n\n```\nmake install\n```\n\n### Test\n\nConfigure to build test\n```\nmeson configure -Dtest=true\n```\nBuild test suit\n\n```\nninja\n```\nRun test suit\n```\nninja test\n```\n[Back to contents](#contents)\n\n#\n## Demo\nIf you want to see rlottie library in action without building it please visit [rlottie online viewer](http://rlottie.com)\n\nWhile building rlottie library it generates a simple lottie to GIF converter which can be used to convert lottie json file to GIF file.\n\nRun Demo\n```\nlottie2gif [lottie file name]\n```\n\n#\n## Previewing Lottie JSON Files\nPlease visit [rlottie online viewer](http://rlottie.com)\n\n[rlottie online viewer](http://rlottie.com) uses rlottie wasm library to render the resource locally in your browser. To test your JSON resource drag and drop it to the browser window.\n\n#\n## Quick Start\n\nLottie loads and renders animations and vectors exported in the bodymovin JSON format. Bodymovin JSON can be created and exported from After Effects with [bodymovin](https://github.com/bodymovin/bodymovin), Sketch with [Lottie Sketch Export](https://github.com/buba447/Lottie-Sketch-Export), and from [Haiku](https://www.haiku.ai).\n\nYou can quickly load a Lottie animation with:\n```cpp\nauto animation = rlottie::Animation::loadFromFile(\"absolute_path/test.json\");\n```\nYou can load a lottie animation from raw data with:\n```cpp\nauto animation = rlottie::Animation::loadFromData(std::string(rawData), std::string(cacheKey));\n```\n\nProperties like `frameRate` , `totalFrame` , `duration` can be queried with:\n```cpp\n# get the frame rate of the resource.\ndouble frameRate = animation-\u003eframeRate();\n\n#get total frame that exists in the resource\nsize_t totalFrame = animation-\u003etotalFrame();\n\n#get total animation duration in sec for the resource\ndouble duration = animation-\u003eduration();\n```\nRender a particular frame in a surface buffer `immediately` with:\n```cpp\nrlottie::Surface surface(buffer, width , height , stride);\nanimation-\u003erenderSync(frameNo, surface);\n```\nRender a particular frame in a surface buffer `asyncronousely` with:\n```cpp\nrlottie::Surface surface(buffer, width , height , stride);\n# give a render request\nstd::future\u003crlottie::Surface\u003e handle = animation-\u003erender(frameNo, surface);\n...\n#when the render data is needed\nrlottie::Surface surface = handle.get();\n```\n\n[Back to contents](#contents)\n\n\n## Dynamic Property\n\nYou can update properties dynamically at runtime. This can be used for a variety of purposes such as:\n- Theming (day and night or arbitrary themes).\n- Responding to events such as an error or a success.\n- Animating a single part of an animation in response to an event.\n- Responding to view sizes or other values not known at design time.\n\n### Understanding After Effects\n\nTo understand how to change animation properties in Lottie, you should first understand how animation properties are stored in Lottie. Animation properties are stored in a data tree that mimics the information hierarchy of After Effects. In After Effects a Composition is a collection of Layers that each have their own timelines. Layer objects have string names, and their contents can be an image, shape layers, fills, strokes, or just about anything that is drawable. Each object in After Effects has a name. Lottie can find these objects and properties by their name using a KeyPath.\n\n### Usage\n\nTo update a property at runtime, you need 3 things:\n1. KeyPath\n2. rLottie::Property\n3. setValue()\n\n### KeyPath\n\nA KeyPath is used to target a specific content or a set of contents that will be updated. A KeyPath is specified by a list of strings that correspond to the hierarchy of After Effects contents in the original animation.\nKeyPaths can include the specific name of the contents or wildcards:\n- Wildcard *\n\t- Wildcards match any single content name in its position in the keypath.\n- Globstar **\n\t- Globstars match zero or more layers.\n\n### Properties\n\n`rLottie::Property` is an enumeration of properties that can be set. They correspond to the animatable value in After Effects and the available properties are listed below.\n```cpp\nenum class Property {\n    FillColor,     /*!\u003c Color property of Fill object , value type is rlottie::Color */\n    FillOpacity,   /*!\u003c Opacity property of Fill object , value type is float [ 0 .. 100] */\n    StrokeColor,   /*!\u003c Color property of Stroke object , value type is rlottie::Color */\n    StrokeOpacity, /*!\u003c Opacity property of Stroke object , value type is float [ 0 .. 100] */\n    StrokeWidth,   /*!\u003c stroke with property of Stroke object , value type is float */\n    ...\n};\n```\n\n### setValue()\n\n`setValue()` requires a keypath of string and value. The value can be `Color`, `Size` and `Point` structure or a function that returns them. `Color`, `Size`, and `Point` vary depending on the type of `rLottie::Property`. This value or function(callback) is called and applied to every frame. This value can be set differently for each frame by using the `FrameInfo` argument passed to the function.\n\n\n### Usage\n```cpp\nanimation-\u003esetValue\u003crlottie::Property::FillColor\u003e(\"**\",rlottie::Color(0, 1, 0));\n```\n\n```cpp\nanimation-\u003esetValue\u003crlottie::Property::FillColor\u003e(\"Layer1.Box 1.Fill1\",\n    [](const rlottie::FrameInfo\u0026 info) {\n         if (info.curFrame() \u003c 15 )\n             return rlottie::Color(0, 1, 0);\n         else {\n             return rlottie::Color(1, 0, 0);\n         }\n     });\n```\n\n[Back to contents](#contents)\n\n#\n#\n## Supported After Effects Features\n\n| **Shapes** | **Supported** |\n|:--|:-:|\n| Shape | 👍 |\n| Ellipse | 👍 |\n| Rectangle | 👍 |\n| Rounded Rectangle | 👍 |\n| Polystar | 👍 |\n| Group | 👍 |\n| Trim Path (individually) | 👍 |\n| Trim Path (simultaneously) | 👍 |\n| **Renderable** | **Supported** |\n| Fill  | 👍 |\n| Stroke | 👍 |\n| Radial Gradient | 👍 |\n| Linear Gradient | 👍 |\n| Gradient Stroke | 👍 |\n| **Transforms** | **Supported** |\n| Position | 👍 |\n| Position (separated X/Y) | 👍 |\n| Scale | 👍 |\n| Skew | ⛔️ |\n| Rotation | 👍 |\n| Anchor Point | 👍 |\n| Opacity | 👍 |\n| Parenting | 👍 |\n| Auto Orient | 👍 |\n| **Interpolation** | **Supported** |\n| Linear Interpolation | 👍 |\n| Bezier Interpolation | 👍 |\n| Hold Interpolation | 👍 |\n| Spatial Bezier Interpolation | 👍 |\n| Rove Across Time | 👍 |\n| **Masks** | **Supported** |\n| Mask Path | 👍 |\n| Mask Opacity | 👍 |\n| Add | 👍 |\n| Subtract | 👍 |\n| Intersect | 👍 |\n| Lighten | ⛔️ |\n| Darken | ⛔️ |\n| Difference | ⛔️ |\n| Expansion | ⛔️ |\n| Feather | ⛔️ |\n| **Mattes** | **Supported** |\n| Alpha Matte | 👍 |\n| Alpha Inverted Matte | 👍 |\n| Luma Matte | 👍 |\n| Luma Inverted Matte | 👍 |\n| **Merge Paths** | **Supported** |\n| Merge | ⛔️ |\n| Add | ⛔️ |\n| Subtract | ⛔️ |\n| Intersect | ⛔️ |\n| Exclude Intersection | ⛔️ |\n| **Layer Effects** | **Supported** |\n| Fill | ⛔️ |\n| Stroke | ⛔️ |\n| Tint | ⛔️ |\n| Tritone | ⛔️ |\n| Levels Individual Controls | ⛔️ |\n| **Text** | **Supported** |\n| Glyphs |  ⛔️ |\n| Fonts | ⛔️ |\n| Transform | ⛔️ |\n| Fill | ⛔️ |\n| Stroke | ⛔️ |\n| Tracking | ⛔️ |\n| Anchor point grouping | ⛔️ |\n| Text Path | ⛔️ |\n| Per-character 3D | ⛔️ |\n| Range selector (Units) | ⛔️ |\n| Range selector (Based on) | ⛔️ |\n| Range selector (Amount) | ⛔️ |\n| Range selector (Shape) | ⛔️ |\n| Range selector (Ease High) | ⛔️ |\n| Range selector (Ease Low)  | ⛔️ |\n| Range selector (Randomize order) | ⛔️ |\n| expression selector | ⛔️ |\n| **Other** | **Supported** |\n| Expressions | ⛔️ |\n| Images | 👍 |\n| Precomps | 👍 |\n| Time Stretch |  👍 |\n| Time remap |  👍 |\n| Markers | 👍  |\n\n#\n[Back to contents](#contents)\n\n## Issues or Feature Requests?\nFile github issues for anything that is broken. Be sure to check the [list of supported features](#supported-after-effects-features) before submitting.  If an animation is not working, please attach the After Effects file to your issue. Debugging without the original can be very difficult. For immidiate assistant or support please reach us in [Gitter](https://gitter.im/rLottie-dev/community#)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamsung%2Frlottie","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsamsung%2Frlottie","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamsung%2Frlottie/lists"}