メインコンテンツへスキップ

🗑️ InteractionManager

非推奨

時間のかかる作業は避け、代わりにrequestIdleCallbackを使用してください。

InteractionManagerを使用すると、インタラクション/アニメーションが完了した後に時間のかかる作業をスケジュールできます。これにより、特にJavaScriptアニメーションをスムーズに実行できます。

アプリケーションは、次の方法でインタラクション後に実行されるタスクをスケジュールできます。

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

他のスケジューリングの代替案と比較してください。

  • 時間の経過とともにビューをアニメーション化するコードにはrequestAnimationFrame()を使用します。
  • setImmediate/setTimeout()はコードを後で実行しますが、アニメーションを遅らせる可能性があることに注意してください。
  • runAfterInteractions()は、アクティブなアニメーションを遅らせることなく、後でコードを実行します。

タッチ処理システムは、1つ以上のアクティブなタッチを「インタラクション」とみなし、すべてのタッチが終了またはキャンセルされるまでrunAfterInteractions()コールバックを遅延させます。

InteractionManagerは、アニメーション開始時にインタラクション「ハンドル」を作成し、完了時にそれをクリアすることで、アプリケーションがアニメーションを登録することもできます。

tsx
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は、プレーンなコールバック関数、またはPromiseを返すgenメソッドを持つPromiseTaskオブジェクトを受け取ります。PromiseTaskが提供された場合、同期的に以前にキューに入っていた可能性のある次のタスクを開始する前に、それが完全に解決されます（runAfterInteractionsを介してさらにタスクをスケジュールする非同期依存関係も含む）。

デフォルトでは、キューに入れられたタスクは1つのsetImmediateバッチでループでまとめて実行されます。正の数でsetDeadlineが呼び出された場合、タスクはデッドライン（jsイベントループの実行時間に関して）に近づくまでのみ実行され、その時点で実行はsetTimeoutを介して中断され、タッチなどのイベントがインタラクションを開始し、キューに入れられたタスクの実行をブロックできるようになり、アプリの応答性が向上します。

例​

基本​

詳細​

リファレンス

Methods​

runAfterInteractions()​

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

すべてのインタラクションが完了した後に実行される関数をスケジュールします。キャンセル可能な「プロミス」を返します。

createInteractionHandle()​

tsx
static createInteractionHandle(): Handle;

インタラクションが開始したことをマネージャーに通知します。

clearInteractionHandle()​

tsx
static clearInteractionHandle(handle: Handle);

インタラクションが完了したことをマネージャーに通知します。

setDeadline()​

tsx
static setDeadline(deadline: number);

正の数は、eventLoopRunningTimeがデッドライン値に達した後にsetTimeoutを使用してタスクをスケジュールします。それ以外の場合、すべてのタスクは1つのsetImmediateバッチで実行されます（デフォルト）。