跳至主要内容

InteractionManager

InteractionManager 允许在所有交互/动画完成后调度长时间运行的工作。特别是,这允许 JavaScript 动画流畅运行。

应用程序可以使用以下方法调度在交互完成后运行的任务

InteractionManager.runAfterInteractions(() => {
// ...long-running synchronous task...
});

将其与其他调度方案进行比较

  • requestAnimationFrame() 用于随时间推移动画化视图的代码。
  • setImmediate/setTimeout() 稍后运行代码,请注意这可能会延迟动画。
  • runAfterInteractions() 稍后运行代码,而不会延迟活动的动画。

触摸处理系统将一个或多个活动触摸视为“交互”,并将延迟 runAfterInteractions() 回调,直到所有触摸结束或被取消。

InteractionManager 还允许应用程序通过在动画开始时创建交互“句柄”并在完成时清除它来注册动画。

const handle = InteractionManager.createInteractionHandle();
// run animation... (`runAfterInteractions` tasks are queued)
// later, on animation completion:
InteractionManager.clearInteractionHandle(handle);
// queued tasks run if all handles were cleared

runAfterInteractions 接受一个普通回调函数或一个 PromiseTask 对象,该对象具有一个返回 Promisegen 方法。如果提供了 PromiseTask,则在开始处理可能更早同步排队的下一个任务之前,它将完全解析(包括也通过 runAfterInteractions 调度更多任务的异步依赖项)。

默认情况下,排队的任务在一个 setImmediate 批次中循环一起执行。如果 setDeadline 被调用并带有一个正数,则任务将仅执行到截止日期(以 js 事件循环运行时间计)临近,此时执行将通过 setTimeout 让出,允许诸如触摸之类的事件启动交互并阻止排队的任务执行,从而使应用程序更具响应性。


示例

基础

高级

参考

方法

runAfterInteractions()

static runAfterInteractions(task?: (() => any) | SimpleTask | PromiseTask);

调度一个函数,使其在所有交互完成后运行。返回一个可取消的“promise”。


createInteractionHandle()

static createInteractionHandle(): Handle;

通知管理器交互已开始。


clearInteractionHandle()

static clearInteractionHandle(handle: Handle);

通知管理器交互已完成。


setDeadline()

static setDeadline(deadline: number);

一个正数将使用 setTimeout 来调度事件循环运行时间达到截止日期值后的任何任务,否则所有任务都将在一个 setImmediate 批次中执行(默认)。