fix(2d): fix transition scaling (#1017)

motion-canvas · Mar 30, 2024 · bccf8a9 · bccf8a9
1 parent 5bd7c8e
commit bccf8a9
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 4 deletions.
diff --git a/packages/core/src/transitions/slideTransition.ts b/packages/core/src/transitions/slideTransition.ts
@@ -28,7 +28,7 @@ export function* slideTransition(
   direction: Direction | Origin = Direction.Top,
   duration = 0.6,
 ): ThreadGenerator {
-  const size = useScene().getSize();
+  const size = useScene().getRealSize();
   const position = size.getOriginOffset(direction).scale(2);
   const previousPosition = Vector2.createSignal();
   const currentPosition = Vector2.createSignal(position);

diff --git a/packages/core/src/transitions/zoomInTransition.ts b/packages/core/src/transitions/zoomInTransition.ts
@@ -13,7 +13,7 @@ import {useTransition} from './useTransition';
  * @param duration - The duration of the transition.
  */
 export function* zoomInTransition(area: BBox, duration = 0.6): ThreadGenerator {
-  const scale = useScene().getSize().div(area.size);
+  const scale = useScene().getRealSize().div(area.size);
 
   const currentPosition = Vector2.createSignal(area.position);
   const currentScale = Vector2.createSignal(Vector2.one.div(scale));

diff --git a/packages/core/src/transitions/zoomOutTransition.ts b/packages/core/src/transitions/zoomOutTransition.ts
@@ -16,7 +16,7 @@ export function* zoomOutTransition(
   area: BBox,
   duration = 0.6,
 ): ThreadGenerator {
-  const scale = useScene().getSize().div(area.size);
+  const scale = useScene().getRealSize().div(area.size);
 
   const currentPosition = Vector2.createSignal(
     area.position.flipped.mul(scale),

diff --git a/packages/docs/docs/getting-started/transitions.mdx b/packages/docs/docs/getting-started/transitions.mdx
@@ -129,7 +129,7 @@ export function* slideTransition(
   direction: Direction = Direction.Top,
   duration = 0.6,
 ): ThreadGenerator {
-  const size = useScene().getSize();
+  const size = useScene().getRealSize();
   const position = size.getOriginOffset(direction).scale(2);
   const previousPosition = Vector2.createSignal();
   const currentPosition = Vector2.createSignal(position);