Flare и Flutter с разными устройствами (экранами)

Я делаю свои первые шаги с бликами и флаттером, и сейчас очень приятно иметь возможность помещать анимации во флаттер, не кодируя их вручную. Но я не понимаю, как сделать вспышку отзывчивой (как поддерживать разные размеры экрана).

Это часть заставки:

@override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: const Color.fromRGBO(250, 224, 61, 1.0),
        body: Center(
          child: Container(
              child: FlareActor(
                "assets/flare/splash.flr",
                callback: (nameOfAnimation) =>
                    Navigator.pushReplacementNamed(context, "/login"),
                fit: BoxFit.none,
                animation: "splash",
              )),
        ));
  }

Это хорошо работает на моем iPhone X, потому что анимация предназначена для этого размера. Есть ли способ, как меньшее устройство может использовать ту же самую анимацию вспышки? При тестировании на iPhone SE анимация была обрезана.

Я надеюсь, что есть другой способ, кроме создания нескольких анимаций для нескольких размеров экрана.


flutter flare
person Logemann    schedule 21.08.2019    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Просто добавьте свою анимацию как дочернюю по отношению к SizedBox и задайте ей ширину / высоту, и все будет в порядке.

Вы также можете использовать MediaQuery.of(context).size.width или height для получения размеров области просмотра и настроить SizedBox на использование% экрана соответственно, если хотите.

person Miguel Ruivo    schedule 23.08.2019
comment
не работает. Кажется, что Flare не может изменить масштаб своей анимации, не матовый, какой родительский контейнер я использую. - person Logemann; 27.08.2019
comment
Вы также можете попробовать обернуть его в OverflowBox и установить максимальную высоту и ширину равными SizedBox * 1.10. Он должен работать. - person Miguel Ruivo; 28.08.2019

arrow_upward
0
arrow_downward

вы можете использовать MediaQuery с текущим контекстом вашего виджета и получить width или height в своем контейнере или поле размера, как это

width: MediaQuery.of(context).size.width * 0.65
   height: MediaQuery.of(context).size.width * 0.65

else Если у вас есть один виджет, вы можете использовать виджет FractionallySizedBox, чтобы указать процент доступного пространства для заполнения

FractionallySizedBox(
    widthFactor: 0.7,
    heightFactor: 0.3,
    child:FlareActor(
                "assets/flare/splash.flr",
                callback: (nameOfAnimation) =>
                    Navigator.pushReplacementNamed(context, "/login"),
                fit: BoxFit.none,
                animation: "splash",
              )),
  );
person griffins    schedule 23.08.2019
comment
не работает. Кажется, что Flare не может изменить масштаб своей анимации, не матовый, какой родительский контейнер я использую. - person Logemann; 27.08.2019