lottie-react-native

传送门

1.npm i --save lottie-react-native
2.react-native link lottie-ios
3.react-native link lottie-react-native

如果找不到文件 Lottie.h文件

Go to General > Embedded Binaries > add Lottie.framework

使用步骤:

1.1.使用Adobe After Effects软件做出特效动画;

1.2.通过bodymovin项目工具把特效动画采用JSON格式文件进行导出;

1.3.用Lottie库进行解析JSON文件并且在移动端上面渲染效果即可。

相关参数:

1. source 导入json文件
2. progress 动画执行的进程
3. speed 动画执行的速度/number
4. loop 动画是否循环执行/boolean
5. autoPlay 是否自动播放/boolean
6. autoSize 是否原始大小/boolean
7. style
8. imageAssetsFolder 安卓需要配置图片资源,ios不要

GitHub 传送门: https://github.com/allenxieyusheng/aeAnimations

React Native 炫酷的动画库 实现任何AE动画 lottie-react-native的更多相关文章

  1. 学习animate.css包含了一组炫酷、有趣、跨浏览器的动画

    1.animate.css包含了一组炫酷.有趣.跨浏览器的动画,可以在你的项目中直接使用. 第一步:引入animate.css样式文件或者引入某些平台的CDN文件: <head> < ...

  2. iOS开发之 Lottie -- 炫酷的动效

    动效在软件开发中非常常见,炫酷的动画能提升应用的B格,然而由设计师的设计转化成程序猿GG的代码是个非常"痛苦"的过程.对于复杂动画,可能要花费很多时间去研究和实现.Lottie 的 ...

  3. >炫酷的计时器效果Canvas绘图与动画<

    >炫丽的计时器效果Canvas绘图与动画< 虽然我是学习java的,但是因为最近使用html5的关系,多学习了一下前端知识. 现在,我要介绍的计时器是十分炫酷的,使用画布完成. 喜欢htm ...

  4. 7种炫酷HTML5 SVG液态水滴融合分解动画特效

    这是一组使用HTML5 SVG过滤器制作的炫酷液态水滴融合分解动画特效.这些SVG动画特效使一些HTML元素.如菜单.分页button.APP.选择框等元素的过渡动画像几粒水滴一样融合分解.效果很的酷 ...

  5. 【轮子】发现一个效果丰富酷炫的Android动画库

    没有什么比发现一个好轮子更让人开心的了. 这个库分分钟提高交互体验 :AndroidViewAnimations 一张图说明一切 配置和使用也相当简单 GitHub地址

  6. particles.js 一个非常酷炫的粒子动画库

    GIT 地址:https://github.com/VincentGarreau/particles.js/ 效果:

  7. 给lol人物模型添加动画库(mixamo)中的动画

    参考链接:https://www.bilibili.com/video/av61771773/?p=4   作为一个懒人,给提取出来的lol人物模型亲手制作动画是不存在的,但是又想给人物模型应用新的有 ...

  8. 2019年10个最受欢迎的JavaScript动画库!

    摘要: 非常炫酷的动画库! 原文:值得看看,2019 年 11 个受欢迎的 JavaScript 动画库! 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 1. Three.js 超过 ...

  9. 7款纯CSS3实现的炫酷动画应用

    1.纯CSS3实现人物摇头动画 这次我们要来分享一款超级可爱的纯CSS3人物摇头动画,初始化的时候人物的各个部位是利用CSS3动画效果拼接而成,接下来就是人物听音乐的场景,一边听音乐一边摇着脑袋,十分 ...

随机推荐

  1. 区块链3.0 ada Cardano卡尔达诺如何获得一致好评?

    区块链3.0 ada Cardano卡尔达诺如何获得一致好评? EOS 的直接竞争对手是以太坊.文章介绍的卡尔达诺(Cardano)的目标就更加远大了,他要同时锁定比特币和以太坊.但大家去网上搜索卡尔 ...

  2. Lambda表达式select()和where()的区别

    可能很多同学和我一样对于select()和where()区别并不是太清晰,其实两者还是有本质区别的. 1.where()用法:必须加条件,且返回对象结果. static void Main(strin ...

  3. axios post参数为空

    今天在360浏览器访问时后台接收不到参数,但是用谷歌浏览器就能收到传入的值.

  4. The logback manual #01# Introduction

    依赖包如下pom.xml: <?xml version="1.0" encoding="UTF-8"?> <project xmlns=&qu ...

  5. Docker学习笔记之搭建Docker运行环境

    0x00 概述 既然 Docker 是一款实用软件,我们就不得不先从它的安装说起,只有让 Docker 运行在我们的计算机上,才能更方便我们对 Docker 相关知识和使用方式的学习.得益于与商业性的 ...

  6. win7使用问题解决

    1. VM和主机互相PING不通 问题:桥接模式,VM可以ping 通外网,可以ping 通局域网其它机子,就是ping 不通本地主机 解决:将 vm网卡和本地网连接网卡都共享出来

  7. BootstrapTable(附源码)

    Bootstrap结合BootstrapTable的使用,分为两种模试显示列表. 引用的css: <link href="@Url.Content("~/Css/bootst ...

  8. Thinkphp5 分页带参数

    原文链接:http://www.zhaisui.com/article/51.html

  9. caffe中的若干问题

    找不到cublas....: 在/etc/ld.so.conf文件夹中新建cuda.conf,里面添加/usr/local/cuda/lib64,然后sudo /sbin/ldconfig -v. c ...

  10. 向eclipse的JavaWeb项目中导入jar包

    一:      在你所需的jar包网站下载对应的jar包.如org.apache.commons.lang.jar. 二:复制粘贴到该JavaWeb的WEB-INF目录下的lib目录下,如: 三:右键 ...