ionic-lottie - Sample using ng-lottie and ionic 3 to view animations rendered from After Effects

  •        113

This is a sample project that uses ng-lottie to display animations provided by an after effects animation json in ionic 3. ps: Take note that this sample has too many animations running at once for sampling purposes only. If you would like to run on a device, remove a few of these animations to have them running smoothly.

http://ionicframework.com/

Dependencies:

@angular/common : 5.0.0
@angular/compiler : 5.0.0
@angular/compiler-cli : 5.0.0
@angular/core : 5.0.0
@angular/forms : 5.0.0
@angular/http : 5.0.0
@angular/platform-browser : 5.0.0
@angular/platform-browser-dynamic : 5.0.0
@ionic-native/core : 3.4.2
@ionic-native/splash-screen : 3.4.2
@ionic-native/status-bar : 3.4.2
@ionic/storage : 2.1.3
ionic-angular : 3.9.0
ionicons : 3.0.0
ng-lottie : ^0.2.2
rxjs : 5.5.2
sw-toolbox : 3.4.0
zone.js : 0.8.18

Tags
Implementation
License
Platform

   




Related Projects

lottie-react-native - Lottie wrapper for React Native.

  •    Java

For the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand. After this, open the Xcode project configuration and add the Lottie.framework as Embedded Binaries.

lottie-react-native - Lottie wrapper for React Native.

  •    Java

For the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand. If you have issues linking your iOS project check out this StackOverflow thread on how to fix it.

lottie-editor - A tool to edit colors in Lottie animations.

  •    Javascript

Discussion here. Contributions are welcome, help improve this tool. Work in progress.

lottie-ios - An iOS library to natively render After Effects vector animations

  •    Objective-C

Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations exported as json with bodymovin and renders the vector animations natively on mobile and through React Native!


LottieXamarin - Render After Effects animations natively on Android, iOS, MacOS and TvOS for Xamarin

  •    CSharp

All of these animations were created in After Effects, exported with Bodymovin, and rendered natively with no additional engineering effort. Bodymovin is an After Effects plugin created by Hernan Torrisi that exports After effects files as json and includes a javascript web player. We've built on top of his great work to extend its usage to Android, iOS, and React Native.

ionic3-components - A project full of ionic 3 components and samples - to make life easier :)

  •    TypeScript

If you just want to check this project out, you can see the online demo at https://yannbf.github.io/ionic3-components or use Ionic View with the code bd1b6d71. Please notice that some plugins may only work when using a real device, so don't expect everything to work on ionic view or the browser.

lottie-web - Render After Effects animations natively on Web, Android and iOS, and React Native

  •    Javascript

Or get it from the adobe store https://creative.adobe.com/addons/products/12557 CC 2014 and up.

SVGAPlayer-Android - Similar to Lottie

  •    Java

use layout.xml. Add SVGAImageView via code.

SVGAPlayer-iOS - Similar to Lottie

  •    Objective-C

SVGAParser use NSURLSession request remote data via network. You may use following ways to control cache. Server response SVGA files in Body, and response header either. response header has cache-control / etag / expired keys, all these keys telling NSURLSession how to handle cache.

collide - A powerful javascript animation engine for web and hybrid mobile apps, inspired by Facebook Pop, built by the Ionic team

  •    Javascript

Collide is a powerful yet simple javascript animation engine for web and hybrid mobile apps, inspired by Facebook Pop, built by the Ionic team. Animations in Collide have more power and control than CSS animations or transitions, all without sacrificing performance.

ionic-ion-swipe-cards - Swipeable card based layout for Ionic and Angular

  •    Javascript

Include `ionic.swipecards.js` after the rest of your Ionic and Angular includes. Then use the following AngularJS directives:```html<swipe-cards> <swipe-card ng-repeat="card in cards" on-destroy="cardDestroyed($index)" on-card-swipe="cardSwiped($index)"> Card content here </swipe-card></swipe-cards>```To add new cards dynamically, just add them to the cards array:```javascript$scope.cards = [ { // card 1 }, { // card 2 }];$scope.cardDestroyed = function(index) { $scope.cards.splice(index

ng-cordova - OBSOLETE: Please move to Ionic Native https://github.com/ionic-team/ionic-native

  •    Javascript

ngCordova is obsolete and is no longer maintained. ngCordova gives you simple AngularJS wrappers for a massive amount of Cordova plugins. Check out the list below for all of the available plugins, and create an issue for a new request.

ng-select - :star: Native angular 6+ select component

  •    TypeScript

Library is under active development and may have API breaking changes for subsequent major versions after 1.0.0. To allow customization and theming, ng-select bundle includes only generic styles that are necessary for correct layout and positioning. To get full look of the control, include one of the themes in your application. If you're using the Angular CLI, you can add this to your styles.scss or include it in .angular-cli.json (Angular v5 and below) or angular.json (Angular v6 onwards).