FlareActor получает / устанавливает продолжительность анимации .flr при отображении в виджете Flutter

Я создаю пользовательский виджет TextView с Flutter, в котором я хочу отображать анимацию рукописных цифр, так что кажется, что текст написан вручную.
Я создал анимацию для каждой цифры с бликами, используя 60 кадров в секунду и длительность 00:00:50 (500 мс).
При работе с несколькими цифрами анимации должны воспроизводиться последовательно слева направо. Т.е. анимация второй цифры должна начинаться только после окончания анимации первой цифры.

Во-вторых, при написании от руки продолжительность каждой записываемой цифры различается. Например. «1» не так много времени, чтобы написать, как «5».

До сих пор я использовал жестко запрограммированные задержки 700 мс с использованием класса Timer. Например. при записи числа «18» сначала запускается анимация для «1», затем после ожидания в течение 700 мс запускается анимация для «8» и так далее. Проблема в том, что последовательность анимаций все еще не кажется естественной, даже после экспериментов с разными значениями задержки.

Пример использования рукописной анимации «1»:

FlareActor(
  "assets/animations/hw_1.flr",
  alignment: Alignment.center,
  fit: BoxFit.fitHeight,
  animation: firstAnimationState,
)

Запуск двух последовательных анимаций:

setState(() {
  // start first animation
  firstAnimationState = "write";
});

Timer(const Duration(milliseconds: 700), () {
  setState(() {
    // start second animation
    secondAnimationState = "write";
  });
});

Должно быть легко синхронизировать анимацию цифр в моем виджете, а также синхронизировать полные TextView между собой.

Есть ли способ во Flutter либо получить продолжительность анимации программно (в FlareActor), либо можно заранее установить продолжительность воспроизводимой анимации?


person WieFel    schedule 09.08.2019    source источник
comment
может быть, лучше прикрепить файл .flr и опубликовать гифку, иначе трудно увидеть реальный эффект.   -  person JerryZhou    schedule 09.08.2019


Ответы (1)


Вы можете подключиться к событию completed виджета FlareActor, а затем воспроизвести следующую анимацию.

person Niklas Raab    schedule 12.10.2019