在使用BottomNavigationBar时如何持久化选项卡？

在使用BottomNavigationBar进行底部导航栏的实现时，持久化选项卡状态通常意味着用户在切换选项卡后，应用能够在重新启动或从后台恢复时保持用户最后选择的选项卡。以下是实现这一功能的基础概念和相关步骤：

基础概念

BottomNavigationBar: 是Flutter框架中的一个组件，用于在屏幕底部显示一组导航图标和标签。
持久化: 指的是将数据保存在设备上，以便即使在应用关闭或设备重启后也能恢复数据。

实现步骤

保存当前选中的索引：当用户切换选项卡时，需要将当前选中的索引保存到本地存储中。
恢复选中的索引：当应用启动或从后台恢复时，需要从本地存储中读取上次保存的索引，并设置为BottomNavigationBar的当前选中项。

示例代码

以下是一个简单的Flutter示例，展示了如何使用shared_preferences插件来持久化BottomNavigationBar的选中状态：

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: TabScreen(),
        bottomNavigationBar: BottomNavigationBar(
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
            BottomNavigationBarItem(icon: Icon(Icons.settings), label: 'Settings'),
          ],
          onTap: (index) => _changeTab(index),
          currentIndex: _currentIndex,
        ),
      ),
    );
  }

  int _currentIndex = 0;

  void _changeTab(int index) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setInt('tab_index', index);
    setState(() {
      _currentIndex = index;
    });
  }

  Future<void> _initTab() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    int index = prefs.getInt('tab_index') ?? 0;
    setState(() {
      _currentIndex = index;
    });
  }
}

class TabScreen extends StatefulWidget {
  @override
  _TabScreenState createState() => _TabScreenState();
}

class _TabScreenState extends State<TabScreen> {
  @override
  void initState() {
    super.initState();
    _initTab();
  }

  @override
  Widget build(BuildContext context) {
    return IndexedStack(
      index: MyApp()._currentIndex,
      children: [
        HomeScreen(),
        SettingsScreen(),
      ],
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(child: Text('Home Screen'));
  }
}

class SettingsScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(child: Text('Settings Screen'));
  }
}