当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript framesync.onFrameUpdate函数代码示例

本文整理汇总了TypeScript中framesync.onFrameUpdate函数的典型用法代码示例。如果您正苦于以下问题:TypeScript onFrameUpdate函数的具体用法?TypeScript onFrameUpdate怎么用?TypeScript onFrameUpdate使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。


在下文中一共展示了onFrameUpdate函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1:

 complete: () => {
   if (!hasCompleted) {
     hasCompleted = true;
     numCompletedActions++;
     if (numCompletedActions === numActions) onFrameUpdate(complete);
   }
 },
开发者ID:jamesgeorge007,项目名称:popmotion,代码行数:7,代码来源:multi.ts

示例2: onFrame

 tweenTimer = onFrame().start(() => {
   elapsed += timeSinceLastFrame() * playDirection;
   updateTween();
   if (isTweenComplete() && complete) {
     tweenTimer.stop();
     onFrameUpdate(complete, true);
   }
 });
开发者ID:jamesgeorge007,项目名称:popmotion,代码行数:8,代码来源:index.ts

示例3: action

const multitouch = ({ preventDefault = true, scale = 1.0, rotate = 0.0 }: PointerProps = {}): Action => action(({ update }) => {
  const output = {
    touches: points,
    scale,
    rotate
  };

  let initialDistance = 0.0;
  let initialRotation = 0.0;

  const isGesture = points.length > 1;

  if (isGesture) {
    const [ firstTouch, secondTouch ] = points;
    initialDistance = distance(firstTouch, secondTouch);
    initialRotation = angle(firstTouch, secondTouch);
  }

  const updatePoint = () => {
    if (isGesture) {
      const [ firstTouch, secondTouch ] = points;
      const newDistance = distance(firstTouch, secondTouch);
      const newRotation = angle(firstTouch, secondTouch);

      output.scale = scale * (newDistance / initialDistance);
      output.rotate = rotate + (newRotation - initialRotation);
    }

    update(output);
  };

  const onMove = (e: TouchEvent) => {
    if (preventDefault || e.touches.length > 1) e.preventDefault();
    onFrameUpdate(updatePoint);
  };

  const updateOnMove = listen(document, 'touchmove', { passive: !preventDefault })
    .start(onMove);

  if (isTouchDevice) onFrameUpdate(updatePoint);

  return {
    stop: () => {
      cancelOnFrameUpdate(updatePoint);
      updateOnMove.stop();
    }
  };
});
开发者ID:XuyiKing,项目名称:popmotion,代码行数:48,代码来源:index.ts

示例4: action

const frame = (): Action => action(({ update }) => {
  let isActive = true;
  const startTime = currentTime();

  const nextFrame = () => {
    if (!isActive) return;
    update(Math.max(currentFrameTime() - startTime, 0));
    onFrameUpdate(nextFrame);
  };

  onFrameUpdate(nextFrame);

  return {
    stop: () => isActive = false
  };
});
开发者ID:XuyiKing,项目名称:popmotion,代码行数:16,代码来源:index.ts

示例5: action

const mouse = ({ preventDefault = true }: PointerProps = {}): Action => action(({ update }) => {
  const updatePoint = () => update(point);

  const onMove = (e: MouseEvent) => {
    if (preventDefault) e.preventDefault();
    onFrameUpdate(updatePoint);
  };

  const updateOnMove = listen(document, 'mousemove').start(onMove);

  if (isMouseDevice) onFrameUpdate(updatePoint);

  return {
    stop: () => {
      cancelOnFrameUpdate(updatePoint);
      updateOnMove.stop();
    }
  };
});
开发者ID:XuyiKing,项目名称:popmotion,代码行数:19,代码来源:mouse.ts

示例6: action

const tween = (props: TweenProps = {}): Action => action(({ update, complete }: IObserver): TweenInterface => {
  const {
    duration = 300,
    ease = easeOut,
    flip = 0,
    loop = 0,
    yoyo = 0
  } = props;
  let {
    from = 0,
    to = 1,
    elapsed = 0,
    playDirection = 1,
    flipCount = 0,
    yoyoCount = 0,
    loopCount = 0
  } = props;

  let playhead = scrubber({ from, to, ease }).start(update);

  let progress = 0;
  let tweenTimer: ColdSubscription;
  let isActive = false;
  const reverseTween = () => playDirection *= -1;

  const isTweenComplete = (): boolean => {
    const isComplete = (playDirection === 1)
      ? isActive && elapsed >= duration
      : isActive && elapsed <= 0;

    if (!isComplete) return false;
    if (isComplete && !loop && !flip && !yoyo) return true;

    let isStepTaken = false;
    if (loop && loopCount < loop) {
      elapsed = 0;
      loopCount++;
      isStepTaken = true;

    } else if (flip && flipCount < flip) {
      elapsed = duration - elapsed;

      [from, to] = [to, from];
      playhead = scrubber({ from, to, ease }).start(update);

      flipCount++;
      isStepTaken = true;

    } else if (yoyo && yoyoCount < yoyo) {
      reverseTween();
      yoyoCount++;
      isStepTaken = true;
    }

    return !isStepTaken;
  };

  const updateTween = () => {
    progress = clampProgress(getProgressFromValue(0, duration, elapsed));
    playhead.seek(progress);
  };

  const startTimer = () => {
    isActive = true;
    tweenTimer = onFrame().start(() => {
      elapsed += timeSinceLastFrame() * playDirection;
      updateTween();
      if (isTweenComplete() && complete) {
        tweenTimer.stop();
        onFrameUpdate(complete, true);
      }
    });
  };

  const stopTimer = () => {
    isActive = false;
    if (tweenTimer) tweenTimer.stop();
  };

  startTimer();

  return {
    isActive: () => isActive,
    getElapsed: () => clamp(0, duration)(elapsed),
    getProgress: () => progress,
    stop() {
      stopTimer();
    },
    pause() {
      stopTimer();
      return this;
    },
    resume() {
      startTimer();
      return this;
    },
    seek(newProgress: number) {
      elapsed = getValueFromProgress(0, duration, newProgress);
      onFrameUpdate(updateTween, true);
      return this;
//.........这里部分代码省略.........
开发者ID:jamesgeorge007,项目名称:popmotion,代码行数:101,代码来源:index.ts

示例7: setProp

 update: (v: any) => {
   setProp(output, name, v);
   onFrameUpdate(updateOutput, true);
 }
开发者ID:XuyiKing,项目名称:popmotion,代码行数:4,代码来源:multi.ts

示例8:

 complete: () => {
   numCompletedActions++;
   if (numCompletedActions === numActions) onFrameUpdate(complete);
 },
开发者ID:XuyiKing,项目名称:popmotion,代码行数:4,代码来源:multi.ts

示例9: onFrameUpdate

 const onMove = (e: MouseEvent) => {
   if (preventDefault) e.preventDefault();
   onFrameUpdate(updatePoint);
 };
开发者ID:XuyiKing,项目名称:popmotion,代码行数:4,代码来源:mouse.ts

示例10: onFrameUpdate

 const onMove = (e: TouchEvent) => {
   if (preventDefault || e.touches.length > 1) e.preventDefault();
   onFrameUpdate(updatePoint);
 };
开发者ID:XuyiKing,项目名称:popmotion,代码行数:4,代码来源:index.ts


注:本文中的framesync.onFrameUpdate函数示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。