Rive

Rive 用 Flutter 完全重写了其强大的动画工具,使开发人员能够创建精美、跨平台的插图。

目标

Rive 允许开发人员创建和发布精美、交互式动画到任何平台。他们的开源运行时使创作者能够一次动画,然后在他们想要的任何平台上发布。

然而,情况并非总是如此。在开始时,团队花费了大量时间管理开发周期:维护许多 UI 功能的不同客户端 Web 包、自定义构建过程、自定义 DevOps、自定义测试、代码风格检查、语言服务器等等 - 所有这些都来自需要维护和不断更新的单独包。

相反,团队想要一个包含所有这些内容的框架,确保工作流程的这些方面之间的兼容性,以便他们可以更多地专注于开发,而不是维护。为了支持其强大的用户界面,并以实时方式提供无故障动画,Rive 需要一个能够跨多个浏览器和平台处理繁重图形渲染的工具。这时,他们转向了 Flutter。

为什么选择 Flutter?

Rive 的第一个版本完全用 JavaScript ES5 和 DOM 编写,这对 Web 来说效果很好,但对其他方面则不然。因此,他们接下来尝试了使用 ES6 的 React。他们使用了 webpack 和 CanvasKit 的早期版本,但维护所有不同平台需要付出巨大的努力。

大约在同一时间,Rive 正在与 Flutter 团队合作举办 Flutter Interact 活动。他们对 Flutter 了解得越多,就越觉得它适合 Rive。Flutter 提供了一个具有出色工具的连贯平台,一种强类型编程语言,以及强大的语言分析工具,包括标准化格式化程序、内置代码风格检查、流行编辑环境的语言服务器,以及直接从编辑环境进行测试的能力。

他们的解决方案

团队决定尝试一下 Flutter。他们使用 Canvaskit 在 Flutter 中构建了一个原型,并立即注意到改进。除了提供真正的跨平台解决方案之外,它还使新工程师的加入变得更加容易。他们也非常喜欢内置的测试功能,这使得维护应用程序的质量和稳定性变得更加容易。

结果

Rive 推出了完全用 Flutter 构建的编辑器。他们的代码库现在更容易维护,并允许工程师立即加入并开始编写代码。

他们还发现,在 Flutter 中添加自定义部分非常容易。功能构建变得更加容易和有趣,设计师能够更好地进行修改和构建原型。这使他们能够在 Rive 中开发更丰富的体验,包括动画、交互式图形以及流畅且响应式的布局。

应用程序的整体稳定性也得到了提高。由于内置的测试功能,他们现在每次构建都会运行数千次测试,这使他们有信心转向每日发布周期。

基于他们的成功,该团队现在正在努力推出适用于 MacOS 的桌面应用程序。对于此版本,团队表示他们甚至不需要进行太多定制,因为抽象已经完成。他们还发现,在 Flutter 中添加自定义部分非常容易。功能构建变得更加容易和有趣,设计师能够更好地进行修改和构建原型。这使他们能够在 Rive 中开发更丰富的体验,包括动画、交互式图形以及流畅且响应式的布局。