Skip to main content

cube()

note

这是一个付费项目,您可以在这里购买

一个演示文稿,其中进入和退出场景都带有3D透视效果。

Nothing here

示例

CubeTransition.tsx
tsx
import { linearTiming, TransitionSeries } from "@remotion/transitions";
 
const BasicTransition = () => {
return (
<TransitionSeries>
<TransitionSeries.Sequence durationInFrames={40}>
<Letter color="#0b84f3">A</Letter>
</TransitionSeries.Sequence>
<TransitionSeries.Sequence durationInFrames={60}>
<Letter color="pink">B</Letter>
</TransitionSeries.Sequence>
</TransitionSeries>
);
};
CubeTransition.tsx
tsx
import { linearTiming, TransitionSeries } from "@remotion/transitions";
 
const BasicTransition = () => {
return (
<TransitionSeries>
<TransitionSeries.Sequence durationInFrames={40}>
<Letter color="#0b84f3">A</Letter>
</TransitionSeries.Sequence>
<TransitionSeries.Sequence durationInFrames={60}>
<Letter color="pink">B</Letter>
</TransitionSeries.Sequence>
</TransitionSeries>
);
};

API

cube() 函数接受一个具有以下属性的对象:

direction

其中之一:from-leftfrom-rightfrom-topfrom-bottom

perspective?

翻转动画的CSS perspective。默认为 1000

参见