我检查了你的代码，我认为你把bottomnavbar支架的颜色与容器的颜色相同，你可以尝试在你的bottomnavbar代码中改变它。

return MaterialApp(
        home: Scaffold(
          extendBodyBehindAppBar: false,
          backgroundColor: AppColors.Primebg, // THIS PART
          appBar: appbar,
          body: _pages[_selectedIndex],
          bottomNavigationBar: Container(
            decoration: BoxDecoration(
              color: AppColors.Primebg,
              border: Border.all(color: AppColors.line, width: 2),
              borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(10), topRight: Radius.circular(10)),
            ),
            child: Padding(
              padding: const EdgeInsets.fromLTRB(10, 5, 10, 5),
              child: GNav(
                onTabChange: (index) {
                  _navigateBottomBar(index);
                },
                haptic: true, // haptic feedback
                tabBorderRadius: 50,
                tabActiveBorder: Border.all(color: AppColors.litegrey, width: 1), // tab button border
                curve: Curves.easeInOutQuart, // tab animation curves
                duration: Duration(milliseconds: 100), // tab animation duration
                gap: 5,
                padding: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
                iconSize: 30,
                color: AppColors.darkgrey,
                activeColor: AppColors.whiteText,
                tabBackgroundColor: AppColors.vitred,

背景颜色：AppColors.Primebg，//本部分
变成这样

backgroundColor: AppColors.vitgreen,

我不知道为什么你的底部导航栏设计看起来像这样。我建议你做这样的东西，这只是给你的建议

class BottomNavScreen extends StatefulWidget {
  static const routeName = "/Bottom-nav-screen";
  const BottomNavScreen({Key? key}) : super(key: key);

  @override
  State<BottomNavScreen> createState() => _BottomNavScreenState();
}

class _BottomNavScreenState extends State<BottomNavScreen> {
  final List _pages = [
    const HomeScreen(),
    const LiveScreen(),
    const FeedsScreen(),
    const CartScreen(),
    const ProfileScreen(),
  ];

  int _currentIndex = 0;

  _onTap(int i) {
    setState(() {
      _currentIndex = i;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _pages[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        currentIndex: _currentIndex,
        onTap: _onTap,
        selectedItemColor: primaryColor,
        unselectedItemColor: Colors.grey,
        selectedLabelStyle: const TextStyle(color: primaryColor),
        unselectedLabelStyle: const TextStyle(color: Colors.grey),
        showSelectedLabels: true,
        showUnselectedLabels: true,
        items: const [
          BottomNavigationBarItem(
            activeIcon: Icon(Icons.home),
            icon: Icon(Icons.home_outlined),
            label: "Home",
          ),
          BottomNavigationBarItem(
            activeIcon: Icon(Icons.camera_alt),
            icon: Icon(Icons.camera_alt_outlined),
            label: "Live",
          ),
          BottomNavigationBarItem(
            activeIcon: Icon(Icons.rss_feed),
            icon: Icon(Icons.rss_feed_outlined),
            label: "Feeds",
          ),
          BottomNavigationBarItem(
            activeIcon: Icon(Icons.shopping_bag),
            icon: Icon(Icons.shopping_bag_outlined),
            label: "Cart",
          ),
          BottomNavigationBarItem(
            activeIcon: Icon(Icons.person),
            icon: Icon(Icons.person_outline),
            label: "Me",
          ),
        ],
      ),
    );
  }
}