title: How can I create an animation for the bottom navigation bar in Flutter?
body: <p>I have a <strong>bottom navigation bar</strong> with some tabs and I want to <strong>animate the icons</strong> of them when I switch page, without an external package.</p>
  <p>And I have one more question, I added a <strong>view pager</strong> to switch pages <strong>swiping</strong>, and <strong>taping in the nav bar icons</strong>, but I got an error.
  For example: I am in the <strong>page 1</strong>, and I want to switch to <strong>page 3</strong>, while it is going and passes <strong>page 2</strong>, it goes back and stay in <strong>page 2</strong>.</p>
  <p><strong>_onPageChanged method:</strong></p>
  <pre><code>_onPageChanged(int index) {
    setState(() {
      _pageController.animateToPage(index,
          duration: const Duration(milliseconds: 200), curve: Curves.easeInOut);
  
      _activePage = index;
    });
  }
  </code></pre>
  <p><strong>BottomNavBar(from scratch) and ViewPager:</strong></p>
  <pre><code>bottomNavigationBar: BottomNavBar(
    activeTab: _activePage,
    onTabTap: _onPageChanged,
    tabs: const [
      BottomNavBarItem(
        icon: Icon(Icons.icon_1, color: gray),
        selectedIcon: Icon(Icons.icon_1_selected, color: white)
      ),
      BottomNavBarItem(
        icon: Icon(Icons.icon_2, color: gray),
        selectedIcon: Icon(Icons.icon_2_selected, color: white)
      ),
      BottomNavBarItem(
        icon: Icon(Icons.icon_3, color: gray),
        selectedIcon: Icon(Icons.icon_3_selected, color: white)
      ),
    ],
  ),
  body: PageView(
    controller: _pageController,
    onPageChanged: _onPageChanged,
    children: _pages,
  ),
  </code></pre>