Есть ли способ исключить BottomAppBar из анимации в Flutter? - PullRequest
Новая
       61

Есть ли способ исключить BottomAppBar из анимации в Flutter?

0 голосов
/ 24 февраля 2020

Я попытался обернуть его в виджет Hero, так как это должно достичь того, чего я хочу. Это работает с BottomNavigationBar, но не с BottomAppBar, который выдает эту ошибку: Scaffold.geometryOf() called with a context that does not contain a Scaffold. Я попытался дать ему контекст с помощью Builder, но это тоже не сработало. Вот пример приложения для демонстрации поведения: 

void main() {
  runApp(
    MaterialApp(
      home: PageOne(),
    ),
  );
}

Widget _bottomNavigationBar() {
  return BottomNavigationBar(items: [
    BottomNavigationBarItem(icon: Icon(Icons.menu), title: Text('menu')),
    BottomNavigationBarItem(icon: Icon(Icons.arrow_back), title: Text('back')),
  ]);
}

Widget _bottomAppBar() {
  return BottomAppBar(
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        IconButton(icon: Icon(Icons.menu), onPressed: null),
        IconButton(icon: Icon(Icons.arrow_back), onPressed: null),
      ],
    ),
  );
}

class PageOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: Hero(
        tag: 'bottomNavigationBar',
        child: _bottomAppBar(),
      ),
      body: Center(
        child: IconButton(
          iconSize: 200,
          icon: Icon(Icons.looks_two),
          onPressed: () => Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => PageTwo()),
          ),
        ),
      ),
    );
  }
}

class PageTwo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: Hero(
        tag: 'bottomNavigationBar',
        child: _bottomAppBar(),
      ),
      body: Center(
        child: IconButton(
          iconSize: 200,
          icon: Icon(Icons.looks_one),
          onPressed: () => Navigator.pop(context),
        ),
      ),
    );
  }
}

Ответы [ 2 ]

0 голосов
/ 24 февраля 2020

Я решил эту проблему, поместив строку с виджетом Hero в BottomAppBar. Это по-прежнему разрешает переходы страниц и не анимирует BottomAppBar, как предполагалось. 

BottomAppBar(
  child: Hero(
    tag: 'bottomAppBar',
    child: Material(
      child: Row(
        ...
      ),
    ),
  ),
);

Однако при использовании CircularNotchedRectangle это приводит к задержкам анимации.

0 голосов
/ 24 февраля 2020

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

class PageOne extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: _bottomAppBar(),
      body: Center(
        child: IconButton(
          iconSize: 200,
          icon: Icon(Icons.looks_two),
          onPressed: () => Navigator.push(
            context,
            PageRouteBuilder(
              pageBuilder: (context, anim1, anim2) => PageTwo(),
              transitionsBuilder: (context, anim1, anim2, child) =>
                  Container(child: child),
            ),
          ),
        ),
      ),
    );
  }
}

Существуют дополнительные способы управления анимацией для навигации здесь (О, и я избавился от Героя ( ) виджет)

...