Можно ли анимировать переход между вкладками CupertinoTabScaffold? - PullRequest
Новая
       18

Можно ли анимировать переход между вкладками CupertinoTabScaffold?

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

Я использую приведенный ниже пример (взят из страницы документации CupertinoTabScaffold ).

Существует переход "слайд" при нажатии нового маршрута внутри вкладки, но когда я нажмите на элемент панели вкладок, содержание жестоко заменяется. Как я могу иметь переход при переключении между вкладками?

Я хотел бы реализовать что-то вроде этого: https://github.com/Interactive-Studio/TransitionableTab

CupertinoTabScaffold(
  tabBar: CupertinoTabBar(
    items: [
      BottomNavigationBarItem(
        icon: Icon(CupertinoIcons.home),
        title: Text("Tab 0"),
      ),
      BottomNavigationBarItem(
        icon: Icon(CupertinoIcons.news),
        title: Text("Tab 1"),
      ),
    ],
  ),
  tabBuilder: (BuildContext context, int index) {
    return CupertinoTabView(
      builder: (BuildContext context) {
        return CupertinoPageScaffold(
          navigationBar: CupertinoNavigationBar(
            middle: Text('Page 1 of tab $index'),
          ),
          child: Center(
            child: CupertinoButton(
              child: const Text('Next page'),
              onPressed: () {
                Navigator.of(context).push(
                  CupertinoPageRoute<void>(
                    builder: (BuildContext context) {
                      return CupertinoPageScaffold(
                        navigationBar: CupertinoNavigationBar(
                          middle: Text('Page 2 of tab $index'),
                        ),
                        child: Center(
                          child: CupertinoButton(
                            child: const Text('Back'),
                            onPressed: () { Navigator.of(context).pop(); },
                          ),
                        ),
                      );
                    },
                  ),
                );
              },
            ),
          ),
        );
      },
    );
  },
)
...