Skip to content

贴纸

贴纸本质上是 lottie 动画,Lottie 是 Airbnb 开发的一个开源动画渲染库,它可以解析 Adobe After Effects 导出的 JSON 格式动画文件(通过 Bodymovin 插件导出),并在各种平台(包括 Web、iOS、Android、React Native 等)上高质量地渲染这些动画。

lottie 动画

Lottie 动画的特点:

  1. 文件体积小 :Lottie 使用 JSON 格式描述动画,文件体积通常比 GIF 或视频小得多,加载速度更快。
  2. 高质量渲染 :动画是矢量的,可以无损缩放,不会在不同分辨率的屏幕上出现模糊。
  3. 复杂动画支持 :支持 After Effects 中的大多数动画效果,包括形状变换、蒙版、路径动画、描边动画等。
  4. 跨平台兼容性 :可以在多种平台上使用相同的 JSON 文件,保持动画效果的一致性。
  5. 性能优秀 :使用硬件加速渲染,动画流畅度高。
  6. 易于集成 :通过简单的 API 调用即可在应用中使用 Lottie 动画。 在无界云剪中,贴纸使用 Lottie 动画格式,这意味着它们可以包含丰富的动态效果,同时保持较小的文件体积和良好的性能。

lottie 参数设置

贴纸支持播放速度(1-16x)、相对原始动画开始播放的时间。

lottie参数设置

对齐方式

元素相对画布的对齐方式。

对齐方式

分别为:左对齐、水平居中对齐、右对齐、顶部对齐、垂直居中对齐、底部对齐。

位置

元素中心点相对画布上的位置坐标,坐标系为画布中心点位置是(0,0),X轴向右为正,Y轴向下为正。

位置

大小

元素在画布上的大小。大小设置右侧两个按钮分别可以快速恢复原始尺寸以及缩放到铺满全屏,需要注意的是如果缩放大小不是1,快捷操作将无法撑满全屏。

大小

缩放

缩放和大小的区别是缩放只能等比例进行缩放,而大小可以自定义宽高。

缩放

透明度

元素的透明度,范围0-100%。

透明度

旋转

元素的旋转角度,无大小限制(帧动画可旋转任意角度)。

旋转

动画设置

参考图片动画设置

滤镜设置

参考元素滤镜设置

Powered by 四川爱趣五科技有限公司.蜀ICP备18034069号.