Motion Canvas v3.15.0

New features 🎉

• 

  全新的

  Code

  节点,具有专用代码信号、可自定义语法高亮和更具表现力的动画系统(包括自动基于差异的转换)。

  #946
  Press play to preview the animation

  import ...
  
  export default makeScene2D(function* (view) {
    const code = createRef<Code>();
  
    view.add(
      <Code
        ref={code}
        fontSize={28}
        fontFamily={'JetBrains Mono, monospace'}
        offsetX={-1}
        x={-400}
        code={'const number = 7;'}
      />,
    );
  
    yield* waitFor(0.6);
    yield* all(
      code().code.replace(code().findFirstRange('number'), 'variable', 0.6),
      code().code.prepend(0.6)`function example() {\n  `,
      code().code.append(0.6)`\n}`,
    );
  
    yield* waitFor(0.6);
    yield* code().selection(code().findFirstRange('variable'), 0.6);
  
    yield* waitFor(0.6);
    yield* all(
      code().code('const number = 7;', 0.6),
      code().selection(DEFAULT, 0.6),
    );
  });
  

• 

  新的

  withDefaults

  辅助函数让你可以快速使用自己的默认值扩展节点。

  #982

  import {Txt, withDefaults} from '@wangyaoshen/locus-2d';
  
  export const MyTxt = withDefaults(Txt, {
    fill: 'rgba(255, 255, 255, 0.6)',
    fontFamily: 'JetBrains Mono',
    fontSize: 28,
  });

• 

  使用

  loop

  时,可以省略迭代计数以创建无限循环:

  #952

  // These two are equivalent:
  yield* loop(() => { /* animation */ });
  yield* loop(Infinity, () => { /* animation */ });

• 

  新的

  spawn

  函数让你可以在任何地方在后台运行动画,而无需 yield 它们。

  #951
• Polygon

  现在扩展

  Curve

  ,使其可以访问所有与曲线相关的属性,如

  startArrow

  和

  radius

  。

  #961
• 

  编辑器中的颜色字段现在带有视觉颜色选择器。

  #962
• 

  新的

  Vector2

  方法: #985

  • rounded
  • ceiled
  • map
  • toArray
• 

  新的

  cardinalPoint

  方法让你可以将

  Origin

  s 和

  Direction

  s 映射到节点的相应 cardinal 点。

  #988
• 

  新的

  waitTransition

  让你使用节点为转场设置动画。

  #983
• 

  传递给 OpenGL 时,

  Matrix2D

  现在转换为 3x3 方阵(而不是 3x2 矩阵)

  #984
• 

  视图的

  cachePadding

  在计算单个节点的缓存大小时现在被尊重。

  #986
• 

  演示模式现在支持 PowerPoint 快捷方式(Page Up、Page Down 等)

  #993
• 

  motion-canvas-player shadow root 的部分现在使用 part 公开,可以使用 CSS 自定义。

  #956
• 

  此网站上的 Fiddles 现在在滚动到视图时自动播放。

  #1001

Fixed bugs 🐛

• 

  在缓存中考虑斜体字体。

  #968
• 

  修复快速入门指南中的拼写错误。

  #974
• 

  检索节点的绝对位置时正确处理 offset。

  #987
• 

  修复响应式点的样条警告。

  #981

查看 更新指南 获取如何更新现有项目的信息。