视觉对象

文字定义了叙事的内容，而 Animate 扩展了叙事的表现方式，这便是 VN 的魅力所在。

Visual

在脚本中，可以使用 visual 函数来使用在 World 中注册的视觉对象。

const rinne = visual("v_rinne");

leave 是立即发生的动效（不会产生动画）。

const stage = scene("s_main");

rinne.enter(p => {
  p.into(stage); // 进入场景
});

leave 是立即发生的动效（不会产生动画），用于将对象从场景中移除。

rinne.leave();

instant 是立即发生的动效（不会产生动画）。

rinne.instant(p => {});

animate 是一个动效，它会产生动画。

rinne.animate(p => {
  p.duration(1000);
  p.ease("none");
});

这里的通用指令，指的是 enter、leave、instant 和 animate 通用的指令。

下面的代码仅以 animate 为例, 在其他动效内的用法完全一致。

应用位置变换。未被修改的属性将保持原值。

rinne.animate(p => {
  p.x(100);
  p.y(100);
  p.z(0);

  p.pos(100, 100);
  p.pos(100, 100, 0);
});

应用缩放变换。控制 x、y 和 z 三个方向的缩放比例。未被修改的属性将保持原值。

rinne.animate(p => {
  p.scale({ x: 2, y: 0.5, z: 1 });
});

应用旋转变换。使用欧拉角（Euler Angles）控制对象的姿态。未被修改的属性将保持原值。

// 单位为角度
rinne.animate(p => {
  p.rotate({ x: 0, y: 0, z: 60 });
});

使用 World 中注册的 Expr 预设（参见 Expr 预设）

rinne.animate(p => {
  p.expr("body:side");

  // 同时使用多个预设
  p.expr("body:side", "1#body");
});

rinne.animate(p => {
  p.timelabel("enter"); // 设置时间轴标签
});

关于 timelabel，请参阅动效时间轴

设置材质的自定义着色器参数（Uniforms）。

@TODO

rinne.animate(p => {
  p.renderOrder(100);
});

渲染顺序对于透明物体的绘制结果是非常重要的。一般来说透明物体必须从远到近（从后往前）绘制，当两个透明物体位置非常接近，或者相互穿插，就可能会出现闪烁或遮挡关系错误。

此时，可以通过调整渲染顺序来解决这个问题，数值越小就越早绘制（在底层），反之则越晚绘制（在顶层）。类似地，也可以采取修改 z 值的方式（如果不使用透视相机，或不影响透视效果的话）。