Добавление timeDilation на одном экране замедляет загрузку других страниц во флаттере? - PullRequest
Новая
       9

Добавление timeDilation на одном экране замедляет загрузку других страниц во флаттере?

0 голосов
/ 09 января 2019

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

class PhotoHero extends StatelessWidget {
 const PhotoHero({Key key, this.photo, this.onTap, this.width})
  : super(key: key);

 final String photo;
  final VoidCallback onTap;
  final double width;

Widget build(BuildContext context) {
return SizedBox(
  width: width,
  child: Hero(
    tag: photo,
    child: Material(
      color: Colors.transparent,
      child: InkWell(
        onTap: onTap,
        child: Image.asset(
          photo,
          fit: BoxFit.contain,
        ),
      ),
    ),
  ),
);  }}

class HeroAnimation extends StatelessWidget {
Widget build(BuildContext context) {
timeDilation = 10.0; // 1.0 means normal animation speed.

return Scaffold(
  appBar: AppBar(
    title: const Text('Basic Hero Animation'),
  ),
  body: Center(
    child: PhotoHero(
      photo: 'images/flippers-alpha.png',
      width: 300.0,
      onTap: () {
        Navigator.of(context).push(
            MaterialPageRoute<void>(builder: (context) => SecondScreen()));
      },
    ),
  ),
); }}

void main() {
runApp(MaterialApp(
routes: {
  '/': (context) => HeroAnimation(),
  '/second': (context) => SecondScreen(),
  '/third': (context) => ThirdScreen(),
},  ));}

class ThirdScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Title(color: Colors.red, child: Text('Dummy Title')),
  ),
); }}

class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: const Text('Flippers Page'),
  ),
  body: Container(
    // Set background to blue to emphasize that it's a new route.
    color: Colors.lightBlueAccent,
    padding: const EdgeInsets.all(16.0),
    alignment: Alignment.topLeft,
    child: PhotoHero(
      photo: 'images/flippers-alpha.png',
      width: 100.0,
      onTap: () {
        Navigator.of(context).pushNamed('/third');
      },
    ),
  ),
);  }}

Ответы [ 2 ]

0 голосов
/ 11 января 2019

Если вы добавите timeDilation, это повлияет на время анимации других экранов. Потому что это глобальная собственность. Чтобы вернуться к нормальной скорости анимации, вы должны изменить значение этой переменной на 1.0, что является нормальной скоростью анимации. 

class FirstScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
 timeDilation = 8.0; // Since we need the animation to slow down.
}

class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
 timeDilation = 1.0; // Changing the value to normal animation speed.
}

Как примечание, если вы вернетесь с помощью кнопки назад, метод сборки не будет вызван, поэтому значение timeDilation не изменится на значение экрана, на котором вы находитесь. В этом случае вам необходимо сделайте ваш экран StatefulWidget, тогда вы сможете установить значение в методах жизненного цикла.

0 голосов
/ 09 января 2019

Это ожидаемо, так как timeDilation является своего рода глобальным свойством, поэтому вам нужно устанавливать его каждый раз, когда вам нужно изменить скорость вашей анимации onTap будет идеальным местом для этого,

проверьте измененный код ниже 

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';

class PhotoHero extends StatelessWidget {
  const PhotoHero({Key key, this.photo, this.onTap, this.width})
      : super(key: key);

  final String photo;
  final VoidCallback onTap;
  final double width;

  Widget build(BuildContext context) {
    return SizedBox(
      width: width,
      child: Hero(
        tag: photo,
        child: Material(
          color: Colors.transparent,
          child: InkWell(
            onTap: onTap,
            child: Image.asset(
              photo,
              fit: BoxFit.contain,
            ),
          ),
        ),
      ),
    );  }}

class HeroAnimation extends StatelessWidget {
  Widget build(BuildContext context) {
    //timeDilation = 10.0; // 1.0 means normal animation speed.

    return Scaffold(
      appBar: AppBar(
        title: const Text('Basic Hero Animation'),
      ),
      body: Center(
        child: PhotoHero(
          photo: '/images/flippers-alpha.png',
          width: 300.0,
          onTap: () {
            timeDilation = 10.0;

            Navigator.of(context).push(
                MaterialPageRoute<void>(builder: (context) => SecondScreen()));
          },
        ),
      ),
    ); }}

void main() {
  runApp(MaterialApp(
    routes: {
      '/': (context) => HeroAnimation(),
      '/second': (context) => SecondScreen(),
      '/third': (context) => ThirdScreen(),
    },  ));}

class ThirdScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    timeDilation = 1.0;
    return Scaffold(
      appBar: AppBar(
        title: Title(color: Colors.red, child: Text('Dummy Title')),
      ),
    ); }}

class SecondScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //timeDilation = 1.0;
    return Scaffold(
      appBar: AppBar(
        title: const Text('Flippers Page'),
      ),
      body: Container(
        // Set background to blue to emphasize that it's a new route.
        color: Colors.lightBlueAccent,
        padding: const EdgeInsets.all(16.0),
        alignment: Alignment.topLeft,
        child: PhotoHero(
          photo: '/images/flippers-alpha.png',
          width: 100.0,
          onTap: () {
            Navigator.of(context).pushNamed('/third');
          },
        ),
      ),
    );  }}
...