Flutter BottomNavigationBarItem 底部导航，底部icon切换的时候第一次会闪一下

背景

如上图，点击底部导航，第一次点击某一个导航的时候，其icon会闪一下
经分析原因是：这里每个导航上，使用了两个icon来表示未选中状态与选中状态，除了默认被选中的导航外，其他导航均只加载了未选中状态的icon，当点击其中一个导航之后，该导航需要显示选中状态的icon，而此时需要加载然后显示，这个过程照成了闪一下的问题。

解决方案

原因知道了，解决方案也很明了了。
先把所有涉及的图片都预先加载到内存，然后在切换的时候，直接从内存读取数据，这样就不会闪了。

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _State();
  }
}

class _State extends State<HomePage> {
 ..................
 ..................

  AssetImage homeImage = AssetImage('assets/images/home/home.png');
  AssetImage homeImageActive = AssetImage('assets/images/home/home_active.png');

  AssetImage sortImage = AssetImage('assets/images/home/sort.png');
  AssetImage sortImageActive = AssetImage('assets/images/home/sort_active.png');

  AssetImage favImage = AssetImage('assets/images/home/fav.png');
  AssetImage favImageActive = AssetImage('assets/images/home/fav_active.png');

  AssetImage myImage = AssetImage('assets/images/home/my.png');
  AssetImage myImageActive = AssetImage('assets/images/home/my_active.png');

........	........	........
  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    /// 这里需要释放预加载的图片
    /// 这里需要释放预加载的图片
    /// 这里需要释放预加载的图片
    imageCache.clear();
  }

  @override
  Widget build(BuildContext context) {
   /// 在build的时候把图片预加载到内存
   /// 在build的时候把图片预加载到内存
   /// 在build的时候把图片预加载到内存
    precacheImage(homeImage, context);
    precacheImage(homeImageActive, context);
    precacheImage(sortImage, context);
    precacheImage(sortImageActive, context);
    precacheImage(favImage, context);
    precacheImage(favImageActive, context);
    precacheImage(myImage, context);
    precacheImage(myImageActive, context);

    return Stack(
      children: <Widget>[
        Scaffold(
            body: PageView.builder(
                controller: pageController,
                itemCount: pages.length,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (BuildContext context, int index) {
                  return pages[index];
                }),
            bottomNavigationBar: Padding(
              padding: EdgeInsets.only(left: 0, right: 0),
              child: BottomNavigationBar(
                backgroundColor: DColor.mainViewBgColor,
                currentIndex: _currentIndex,
                onTap: _onTapHander,
                selectedItemColor: DColor.mainColor100,
                unselectedItemColor: DColor.mainColor40,
                selectedFontSize: 11,
                unselectedFontSize: 11,
                type: BottomNavigationBarType.fixed,
                items: [
                ///  经过预加载的之后的图片在使用，就不会再闪了
                  BottomNavigationBarItem(
                      icon: Image(
                        width: 24,
                        height: 24,
                        image: homeImage,
                      ),
                      activeIcon: Image(
                        width: 24,
                        height: 24,
                        image: homeImageActive,
                      ),
                      title: Text("主页")),
                   ///  经过预加载的之后的图片在使用，就不会再闪了
                  BottomNavigationBarItem(
                      icon: Image(
                        width: 24,
                        height: 24,
                        image: sortImage,
                      ),
                      activeIcon: Image(
                        width: 24,
                        height: 24,
                        image: sortImageActive,
                      ),
                      title: Text("分类")),
                   ///  经过预加载的之后的图片在使用，就不会再闪了
                  BottomNavigationBarItem(
                      backgroundColor: Colors.yellow,
                      icon: Image(
                        width: 24,
                        height: 24,
                        image: favImage,
                      ),
                      activeIcon: Image(
                        width: 24,
                        height: 24,
                        image: favImageActive,
                      ),
                      title: Text("收藏")),
                 ///  经过预加载的之后的图片在使用，就不会再闪了
                  BottomNavigationBarItem(
                      icon: Image(
                        width: 24,
                        height: 24,
                        image: myImage,
                      ),
                      activeIcon: Image(
                        width: 24,
                        height: 24,
                        image: myImageActive,
                      ),
                      title: Text("我的")),
                ],
              ),
            )),
        privacyWidget()
      ],
    );
  }
}