浏览代码

использовать таймер физдвижка в анимациях

master
父节点
当前提交
f0cdef815e
共有 3 个文件被更改,包括 40 次插入23 次删除
  1. +13
    -10
      6.0/игра/075.Анимация.js
  2. +25
    -12
      6.0/игра/080.Анимации.js
  3. +2
    -1
      6.0/игра/700.Игра.js

+ 13
- 10
6.0/игра/075.Анимация.js 查看文件

@@ -2,6 +2,8 @@ function Анимация(элемент, параметры)
{
this.запустить = function()
{
this.идёт = false;

let п = параметры;
let воспроизведений = Number(п["воспроизведений"]);
let скорость = Number(п["скорость"]);
@@ -32,26 +34,27 @@ function Анимация(элемент, параметры)
let кадровПоГоризонтали = Math.floor(ширинаДиапазона / ширинаКадра);
let кадровПоВертикали = Math.floor(высотаДиапазона / высотаКадра);

this.скорость = скорость;
this.номерВоспроизведения = 0;
this.колвоВоспроизведений = воспроизведений;
this.размерКадра = [к0, к1];
this.поГоризонтали = кадровПоГоризонтали > кадровПоВертикали;
this.номерКадра = 0;
this.номерКадра = -1;
this.колвоКадров = this.поГоризонтали ? кадровПоГоризонтали : кадровПоВертикали;
this.началоДиапазона = [д0, д1];
// Выставляем первоначальное значение в начало диапазона.
элемент.style.backgroundPosition = `${д0}px -${д1}px`;
// Возможно, в будущем стоит заменить частные таймеры на один общий.
// Вдруг в браузерах есть ограничение на количество таймеров от одной страницы.
this.таймер = setInterval(() => { this.анимировать(); }, скорость);
this.номерИтерации = null;
this.идёт = true;
};

this.остановить = function()
this.обновить = function(время)
{
if (this.таймер)
let итерация = Math.floor(время / this.скорость);
if (this.номерИтерации == итерация)
{
clearInterval(this.таймер);
return;
}
this.анимировать();
this.номерИтерации = итерация;
};

this.анимировать = function()
@@ -65,7 +68,7 @@ function Анимация(элемент, параметры)
this.колвоВоспроизведений > 0 &&
this.номерВоспроизведения >= this.колвоВоспроизведений
) {
this.остановить();
this.идёт = false;
return;
}
}


+ 25
- 12
6.0/игра/080.Анимации.js 查看文件

@@ -2,18 +2,36 @@ function Анимации(события)
{
this.создать = function()
{
this.задано = {};
this.анимации = {};
this.задано = {};
};

this.запустить = function(имя, элемент)
{
let ключ = `${элемент.id}`;
// Останавливаем прошлый экземпляр этой анимации на том же элементе.
this.остановить(имя, элемент);
this.остановить(ключ);
// Запускаем новый экземпляр анимации на том же элементе.
let ключ = `${элемент.id}`;//-${имя}`;
this.анимации[ключ] = new Анимация(элемент, this.задано[имя]);
}
};

this.обновить = function(время)
{
var удалить = [];
// Проигрываем активные анимации.
for (var ключ in this.анимации) {
this.анимации[ключ].обновить(время);
if (!this.анимации[ключ].идёт)
{
удалить.push(ключ);
}
}

// Удаляем завершившиеся анимации.
for (var номер in удалить) {
this.остановить(удалить[номер]);
}
};

this.обработатьКлюч = function(ключ, путь, значение)
{
@@ -33,15 +51,10 @@ function Анимации(события)
события.уведомить(`анимации/${имя}`);
};

this.остановить = function(имя, элемент)
this.остановить = function(ключ)
{
let ключ = `${элемент.id}`;//-${имя}`;
if (ключ in this.анимации)
{
this.анимации[ключ].остановить();
delete this.анимации[ключ];
}
}
delete this.анимации[ключ];
};

// Конструктор.
this.создать();


+ 2
- 1
6.0/игра/700.Игра.js 查看文件

@@ -68,8 +68,9 @@ function Игра()
this.обновить = function()
{
Matter.Engine.update(мир.физдвижок);
мир.слежение.обновить();

мир.анимации.обновить(мир.физдвижок.timing.timestamp);
мир.слежение.обновить();
мир.grСцена.обновить();

var тут = this;


正在加载...
取消
保存