Flutter笔记:美工设计.导出视频到RIVE

Flutter笔记
美工设计.导出视频到RIVE

- 文章信息 - Author: 李俊才 (jcLee95)
Visit me at CSDN: https://jclee95.blog.csdn.net
My WebSitehttp://thispage.tech/
Email: 291148484@163.com.
Shenzhen China
Address of this article:https://blog.csdn.net/qq_28550263/article/details/136549982
HuaWei:https://bbs.huaweicloud.com/blogs/426809

flutter-ljc


【介绍】:本文介绍导出视频到RIVE。

(https://jclee95.blog.csdn.net/)

推荐阅读:

  • 《Flutter Widgets Easier组件库使用消息吐丝(Notify Toasts)》:https://jclee95.blog.csdn.net/article/details/138425637
    example_5MJrSKGAUZ
  • 《Flutter Widgets Easier组件库使用弹窗》:https://jclee95.blog.csdn.net/article/details/138342949

example_QCpD0oPAWg

example_XXgNIBMhxU


1. 概述与准备

1.2 什么是Rive

Rive

图片连接地址:https://rive.app/
Flutter Pub中的Rive库:https://pub.dev/packages/rive

Rive 是一个强大的设计和动画工具,专为开发者和设计师创建交互式图形和动画而设计。它提供了一个平台,使设计师可以直接构建功能性图形,这些图形具有丰富的交互性和动画效果,从而极大地缩短了从设计到开发的交接时间。Rive 的核心特点是其能够在不牺牲设计质量的前提下,提高开发效率和产品质量。Rive具有以下特点:

  1. 交互性设计与动画工具:Rive 提供了一套熟悉的设计和动画工具,结合其创新的状态机(State Machine),允许设计师创建复杂的交互动画。这些工具不仅直观易用,而且功能强大,支持从简单的动画到复杂的用户交互。

  2. 跨平台兼容性:Rive 支持广泛的平台,包括 Web、iOS、macOS、Android、Windows 和 Flutter 等,确保动画和交互可以无缝集成到各种应用和游戏中。这一跨平台的特性使得 Rive 成为多平台项目的理想选择。

  3. 开源运行时:Rive 提供开源运行时,允许开发者根据需要选择无代码或全代码的方式来嵌入交互动画。这种灵活性使得 Rive 不仅适用于需要高度定制的项目,也适用于快速开发的场景。

  4. 实时矢量图形渲染:Rive 的渲染器是一个在实时矢量图形领域的重大突破,能够在屏幕上绘制大量的矢量图形,同时保持120 fps的完美动画质量。这对于需要高性能动画的应用和游戏尤为重要。

  5. 社区和支持:Rive 拥有一个活跃的社区,设计师和开发者可以在此交流经验,分享文件,并通过论坛和Discord频道获得支持。此外,Rive 还提供专业的客户支持和丰富的学习资源,帮助用户充分利用其功能。

1.3 Adobo系列工具

本文需要用到的Adobo系列工具包括两个,一个是Adobo After Effect(AE);另外一个是Adobe Media Encoder(ME)。

Adobe After Effects是一款专业的视频编辑和动画制作软件,它可以创建和编辑矢量动画。然而,它并不直接支持将视频文件导出为矢量动画。
你可以使用Bodymovin插件(现在已经更名为LottieFiles)来将After Effects中的动画导出为Lottie(JSON)文件,这是一种矢量动画格式,可以在Web和移动应用中使用。

Adobe Media Encoder(ME)可以为AE提供需要的解码器。
在这里插入图片描述

2. 安装AE插件bodymovin

2.1 下载zxp安装器

需要zxp安装器才能安装:https://aescripts.com/learn/zxp-installer/bodymovin,然后选择bodymovin.zxp文件进行安装。

直接将zxp文件拖拽进安装器。如果之前安装过bodymovin,会覆盖掉原来的版本。

2.1 安装Bodymovin插件

首先,你需要下载Bodymovin插件。你可以在这里:https://aescripts.com/bodymovin/下载插件。

3. 用法

3.1 Bodymovin插件窗口打开方法

打开一个 Adobe After Effect 项目,点击 Window - Extensions -Bodymovin(窗口-扩展-bodymovin),出现如图2所示对话框

在这里插入图片描述

3.2 导入视频到AE项目中

  1. 打开After Effects:首先,打开Adobe After Effects软件。
  2. 创建新项目:如果你还没有创建项目,可以通过选择File > New > New Project来创建一个新项目。
  3. 导入视频:在项目面板中,右键点击空白区域,然后选择 Import > File。在弹出的文件浏览器中,选择你想要导入的视频文件,然后点击Open。
  4. 创建新合成:在项目面板中,右键点击导入的视频文件,然后选择New Comp from Selection。这将创建一个新的合成,合成的尺寸和帧速率将根据你的视频文件自动设置。
    现在,你已经将视频导入到After Effects中,你可以在合成中编辑和添加动画。

3.3 通过视频创建“合成”

在这里插入图片描述

3.4 在Bodymovin插件窗口生成JSON文件

在这里插入图片描述
在这里插入图片描述

3.4 使用LottieFiles:

你可以在LottieFiles网站(https://lottiefiles.com/)上上传你的Lottie文件,然后下载为JSON格式,这就是你的 矢量动画文件

请注意,虽然 Lottie 是一种矢量动画格式,但它并不是所有矢量动画的最佳选择。在某些情况下,使用SVGWebGL动画可能更合适。

4. 整合Lottie动画到Rive

4.1 Bodymovin插件窗口打开方法

目前,Rive 平台本身并不直接支持从 Lottie JSON 文件导入动画。Rive 使用自己的格式和编辑器来创建和管理动画。因此,如果你想将 Lottie 动画整合到 Rive 中使用,你需要通过一些间接的方法来实现这一转换。

  1. 手动重建

最直接的方法是在 Rive 工具中手动重建 Lottie 动画。这意味着你需要在 Rive 中从头开始创建新的动画,可能需要参考 Lottie 动画的视觉效果和行为。
这种方法虽然耗时较长,但可以充分利用 Rive 的所有功能,包括交互性和动态响应。

  1. 使用第三方工具

可以寻找是否有可用的第三方工具来转换 Lottie JSON 文件到 Rive 支持的格式。这些工具可能不常见,且转换效果取决于工具的更新和维护状态。如果找到合适的工具,按照工具的说明进行操作,将 Lottie JSON 转换为 Rive 可以识别的格式。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/833567.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

华为eNSP中型企业局域网网络规划设计(上)

敲半天一个闪退全™给我干没了呜呜呜,eNSP,wcnm!wcnm!wcnm! →b站传送门,感谢大佬← →华为eNSP中型企业局域网网络规划设计(下)← →拓扑图传送门,可以自己配置着玩←…

Vue从入门到实战Day01

一、Vue快速上手 1. vue概念 概念:Vue是一个用于 构建用户界面的 渐进式 框架 构建用户界面:基于数据动态渲染页面渐进式:循序渐进的学习框架:一套完整的项目解决方案,提升开发效率 优点:大大提升开发效…

【Debug日记】albumentations包安装失败解决方案

直接pip安装pip install albumentations 报错: ERROR: Command errored out with exit status 1:command: D:\anaconda3\envs\pytorch\python.exe D:\anaconda3\envs\pytorch\lib\site-packages\pip\_vendor\pep517\in_process\_in_process.py build_wheel C:\Users…

责任链模式和观察者模式

1、责任链模式 1.1 概述 在现实生活中,常常会出现这样的事例:一个请求有多个对象可以处理,但每个对象的处理条件或权限不同。例如,公司员工请假,可批假的领导有部门负责人、副总经理、总经理等,但每个领导…

C语言——每日一题(轮转数组)

一.前言 前不久学习了时间复杂度的概念,便在力扣上刷了一道需要参考时间复杂度的题——轮转数组 https://leetcode.cn/problems/rotate-array/submissions这道题不能使用暴力算法,因为这道题对时间复杂度的要求不能为O(N^2)。因…

Tansformer原理解读

什么是注意力机制 生物学中的注意力机制是指人类或动物能够选择性地将感知和认知资源集中到某些信息或任务上的能力。这种能力允许我们在众多信息的背景中过滤出重要的信息,并将这些信息传递给相应的神经元进行处理。 本质:能从中抓住重点,…

一个好用的短链接都需要具备哪些功能?

大家好,今天我们将会来聊聊一款优秀的短链接,都需要具备的功能,看看是不是你想要的呢? 1. 能够支持自定义域名 现在越来越多的用户都不会选择公用域名了,因为那样风险太大,而会选择用一个他们自己的专用域…

自动控制原理MATLAB:系统分析

控制系统时域分析 (1)稳定性分析 稳定是控制系统的重要性能,也是系统设计过程中的首要问题。线性系统稳定的充分必要条件是:闭环系统特征方程的所有根均具有负实部。在MATLAB中可以调用roots命令求取特征根,进而判别…

C#实战—代码实现收发文件智能化

在信息化的今天,收发电子文档几乎是每个朋友都要经历的事情。比如班级学委和班长需要收发作业,企业管理者需要收发工作文件。但是!!! 每到要交结果时,往往会发现总会有一些人没有即使交上,50个…

8W 1.5KVDC 隔离宽电压输入 DC/DC 电源模块——TP08DA 系列

TP08DA系列电源模块额定输出功率为8W,外形尺寸为31.80*20.30*10.00,应用于2:1,4:1电压输入范围 9-18V,18-36V,36-72V9V-36V和18V-72VDC的输入电压环境,输出电压精度可达1%,具有输出短路保护等功能&#xff…

图卷积神经网络GCN

计算图 通过消息传递的框架构建一个局部邻域的计算图 每个节点分别构建自己的计算图 理论上任意深度,根据六度空间理论,层数一般不会超过六层 基本过程 数学形式 矩阵表示 代码表示 图计算改进 能够听见自己内心的声音 最终形式 如何训…

windows端口复用

1. 概述 使用 HTTP.sys 中的 Net.tcp Port Sharing 服务,配合 WinRM 实现端口复用。 优点: HTTP.sys 为 windows 原生机制, WinRM 为 windows 自带功能,动作较小,不易触发主 动防御。 需要管理员权限。 2. 原理 (…

鞋店小程序商城的作用是什么

鞋与服装一样其购买/复购属性都非常足,每个人生活所需无疑促进了品牌多样化、工厂/店铺商家/个人都有很多,其目的都是为了品牌宣传和将更多货卖给下游/客户。 对消费者来说,买鞋渠道线上线下选择比较多,普遍会以品牌为主&#xf…

✬ ✬ ✬ 宁波推进ISO14000认证:共创美好生态家园✬ ✬ ✬

🌈🌈宁波推进ISO14000认证,🍉共创美好生态家园🤩 😃哇!宁波这个大都市🍓真的在努力推进🚈ISO14000认证啊!🚵‍♀️作为一个环保爱好者&#xff0…

文本批量操作实例:如何实现文本批量拆分?实用方法与技巧分享

在文本处理和数据分析的过程中,我们经常会遇到需要批量拆分大量文本数据的情况。文本批量拆分能够大大提高工作效率,减少重复劳动。下面,我们将通过一个实例来介绍如何实现文本批量拆分,并分享一些实用方法与技巧。 一、实例背景 …

U盘管控软件,禁止员工用U盘拷贝机密数据,防止信息通过U盘泄露

随着信息技术的不断发展,U盘等便携式存储设备已成为我们日常工作中不可或缺的工具。然而,随着U盘的普及,企业面临的信息泄露风险也在不断增加。为了确保企业的信息安全,许多企业开始采用U盘管控软件,禁止员工使用U盘拷…

【YOLOv8改进[Backbone]】使用SCINet改进YOLOv8在黑暗环境的目标检测效果

目录 一 SCINet 1 本文方法 ① 权重共享的照明学习 ② 自校准模块 ③ 无监督训练损失 二 使用SCINet助力YOLOv8在黑暗环境的目标检测效果 1 整体修改 2 配置文件 3 训练 其他 一 SCINet 官方论文地址:https://arxiv.org/pdf/2204.10137 官方代码地址&…

STM32平衡车-MPU6050的DMP库移植

本文目录 一、硬件接线二、需要移植的三个文件夹1. DMP文件夹目录2. IIC文件夹目录3. MPU6050文件夹目录 三、文件内容IO12C.cIO12C.hMPU6050.cMPU6050.hmain.c 四、附录1.更改IIC引脚 一、硬件接线 SCL-- PA11 SDA-- PA12 VCC-- 3.3v GND-- GND 二、需要移植的三个文件夹 1.…

winscp断点续传

背景 超大文件上传, scp可能因为网络或其他原因中断,并且已上传完的文件无法同步。如何断点续传呢?使用winscp软件 winscp安装 百度搜索,自行安装 开启断点续传功能 https://jingyan.baidu.com/article/fdffd1f8395529b2e98ca…

图纸管理的高效策略与最佳实践

图纸管理的高效策略与最佳实践 在工程设计、产品研发和建筑行业中,图纸管理是一项至关重要的任务。随着项目规模的扩大和复杂性的增加,如何高效、有序地管理图纸已成为企业和团队关注的焦点。本文将为您介绍图纸管理的高效策略与最佳实践,帮助…