dromara-newcar

阿超

发布于 2024-04-20 09:37:15

860

发布于 2024-04-20 09:37:15

文章被收录于专栏：快乐阿超快乐阿超

发上开出了蔷薇，袖底是风，足下是莲。——顾城

https://github.com/dromara/newcar

最近dromara新加入了一个前端项目newcar

Newcar 是一款高度可配置且先进的通用引擎，专为快速动画创建而设计。它适用于广泛的应用，包括视频剪辑、动态图表（未来计划），甚至 2D 游戏开发（也是未来计划）。

这个项目作者竟

然是09年的，我们快速开始

$ pnpm create vite project-name
$ cd project-name
$ pnpm install

引入依赖

$ pnpm add newcar

初始化

import * as nc from 'newcar'

const engine = await new nc.Engine().init(
  '../node_modules/canvaskit-wasm/bin/canvaskit.wasm',
)

const defaultScene = new nc.Scene(new Widget())
engine.createApp().checkout(defaultScene).play()

这里做了三步

等待 init() 直到 CanvasKit 完全加载。
创建一个 Scene ，并将根小部件作为其第一个参数。
查看 defaultScene 并播放动画。

我们再添加一个圆

const engine = await new nc.Engine().init(
  '../node_modules/canvaskit-wasm/bin/canvaskit.wasm',
)
const defaultScene = new nc.Scene(new Widget().add(new nc.Circle(100)))
engine.createApp().checkout(defaultScene).play()

对这个圆创建动画

本文参与?腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2024-04-18，如有侵权请联系 cloudcommunity@tencent.com 删除

动画