#3 bottomNavigationBar & PageView()

colors.dart

import 'package:flutter/material.dart';
const mobileBackgroundColor = Color.fromRGBO(0, 0, 0, 1);
const webBackgroundColor = Color.fromRGBO(32, 33, 36, 1);
const primaryColor = Colors.white;
const secondaryColor = Color.fromARGB(166, 158, 158, 158);
const blueColor = Color.fromRGBO(0, 149, 246, 1);

bottomNavigationBar:

bottomNavigationBar: CupertinoTabBar(
     onTap: (index){  _pageController.jumpToPage(index);   
        // change icon color  
      } 
     backgroundColor:  ...,
     items: [
      BottomNavigationBarItem(
        label: "...",
        icon: ...,)

 ]),

PageView()

PageView(
   onPageChanged: (index) {...}
   physics: NeverScrollableScrollPhysics(),      
   controller: _pageController,
   children: [...],
)

To control which page is visible in a PageView:

1- Create a PageController.

final PageController _pageController = PageController();

2- Connect the PageController to a PageView().

PageView( controller: _pageController, ),

3- Create a function to do what you want.

CupertinoTabBar(
   onTap: (index) {
   // navigate to the tabed page
   _pageController.jumpToPage(index);
}
)

4- stop listening when the widget is deleted.

@override
void dispose() {
   _pageController.dispose();
   super.dispose();
}

#3 bottomNavigationBar & PageView()

To control which page is visible in a PageView:

#3.1 Task solution