Question

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

我已经尝试过将一些setState放在秒表的initState函数中，但这没用。

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

// 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),   
      );
  }
}

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

1 个答案: