Jak prowadzić pętlę animacji z prędkością 60 klatek na sekundę za pomocą Dart i internetu?

Question

Jak prowadzić pętlę animacji lub pętlę gry przy 60 fps w aplikacji internetowej Dart?

Answer 1

Użyj window.animationFrame, kuzyna przyszłościowego tradycyjnego window.requestAnimationFrame.

Dart został zmieniony, aby używać Future i Stream jako bardziej obiektowych sposobów obsługi operacji asynchronicznych. Oparte na oddzwanianiu (stare 'n busted) requestAnimationFrame zostaje zastąpione oparta na Przyszłości (new hotness) animationFrame.

Oto przykład:

import 'dart:html'; 

gameLoop(num delta) { 
    // do stuff 
    window.animationFrame.then(gameLoop); 
} 

void main() { 
    window.animationFrame.then(gameLoop); 
} 

Podpis animationFrame wygląda następująco:

Future<num> animationFrame(); 

Wskazówki jak animationFrame zwraca przyszłości, która uzupełnia z num, który posiada „wysoką wydajność timer "podobny do window.performance.now(). num to monotonicznie rosnąca delta między teraz i kiedy strona się zaczęła. Ma rozdzielczość mikrosekundy.

Przyszłość kończy się tuż przed przeglądarką dotyczącą losowania strony. Zaktualizuj stan swojego świata i narysuj wszystko, gdy ta Przyszłość się zakończy.

Musisz zażądać nowej Przyszłości z animationFrame na każdej klatce, jeśli chcesz kontynuować animację lub pętlę. W tym przykładzie rejestracja gameLoop() jest powiadamiana o następnej klatce animacji.

BTW istnieje pakiet publikacji o nazwie game_loop, który może okazać się przydatny.