我想在切换屏幕时保持此秒表屏幕运行

Question

我有这个 Flutter iOS 风格的秒表，我想在切换屏幕时保持秒表运行。

Actual Stopwatch behavior

我已经尝试在我的秒表的 initState 函数中设置一些 setState，但这不起作用。

我认为当我返回秒表屏幕时它不会重建小部件。

//home_screen.dart 文件中的我的构建器

@override
  Widget build(BuildContext context) {
    return CupertinoTabScaffold(
      controller: controller,
      tabBar: CupertinoTabBar(
        items: [
          BottomNavigationBarItem(
            icon: Icon(
              Ionicons.getIconData('ios-globe'),
            ),
            title: Text('World Clock'),
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Ionicons.getIconData('ios-alarm'),
            ),
            title: Text('Alarm'),
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Ionicons.getIconData('ios-bed'),
            ),
            title: Text('Bedtime'),
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Ionicons.getIconData('ios-stopwatch'),
            ),
            title: Text('Stopwatch'),
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Ionicons.getIconData('ios-timer'),
            ),
            title: Text('Timer'),
          ),
        ],
      ),
      tabBuilder: (context, i) {
        if(i == 3){
          final Dependencies dependencies = new Dependencies();
          return StopWatch(dependencies: dependencies,);
        }else{
          return CupertinoTabView(
            builder: (context){
              return CupertinoPageScaffold(
                navigationBar: CupertinoNavigationBar(
                  middle: Text(chooseMiddle(i)),
                ),
                child: Center(
                  child: Text('Screen $i'),
                ),
              );
            },
          );
        }
      },
    );
  }

Answer 1

每当您在选项卡之间切换时，都会重新构建屏幕，从而在选项卡构建器中创建 StopWatch 小部件的新对象。您必须使用 PageStorageBucket 和 PageStorageKeys 来维护页面。

这样的事情应该会有所帮助

class HomeScreen extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return HomeWidget();
  }
}

class HomeWidget extends State<HomeScreen>{

final List<Widget> pages = [
    DashboardScreen(
      key: PageStorageKey('Dashboard'),
    ),
    CarsScreen(
      key: PageStorageKey('Cars'),
    ),
    MapScreen(
      key: PageStorageKey('Find'),
    ),
    ProfileScreen(
      key: PageStorageKey('Profile'),
    ),
    SettingScreen(
      key: PageStorageKey('Settings'),
    )
  ];

  final PageStorageBucket bucket = PageStorageBucket();

  int _selectedIndex = 0;

Widget _bottomNavigationBar(int selectedIndex) => BottomNavigationBar(
  type: BottomNavigationBarType.fixed,
  onTap: (int index) => setState(() => _selectedIndex = index),
  currentIndex: selectedIndex,
  items: const <BottomNavigationBarItem>[
    BottomNavigationBarItem(
        icon: Icon(CupertinoIcons.home), title: Text('Home')),
    BottomNavigationBarItem(
        icon: Icon(CupertinoIcons.car), title: Text('My Cars')),
    BottomNavigationBarItem(
        icon: Icon(CupertinoIcons.search), title: Text('Find')),
    BottomNavigationBarItem(
      icon: Icon(CupertinoIcons.profile_circled), title: Text('Profile')),
    BottomNavigationBarItem(
      icon: Icon(CupertinoIcons.settings), title: Text('Settings')),
    ],
  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Smart Park'),
        ),
        body: PageStorage(
          child: pages[_selectedIndex],
          bucket: bucket,
        ),
        bottomNavigationBar: _bottomNavigationBar(_selectedIndex),   
      );
  }
}