Implementing Navigation with Bottom Navigation Bar

This example shows how to set up a basic app with a Bottom Navigation Bar to switch between different screens.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
return MaterialApp(
  title: 'Bottom Navigation',
  theme: ThemeData(primarySwatch: Colors.blue),
  home: MainScreen(),
);
  }
}

class MainScreen extends StatefulWidget {
  @override
  _MainScreenState createState() => _MainScreenState();
}

class _MainScreenState extends State<MainScreen> {
  int _currentIndex = 0;

  final List<Widget> _screens = [
Screen1(),
Screen2(),
Screen3(),
  ];

  void _onItemTapped(int index) {
setState(() {
  _currentIndex = index;
});
  }

  @override
  Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(title: Text('Bottom Navigation')),
  body: _screens&#91;_currentIndex],
  bottomNavigationBar: BottomNavigationBar(
    items: const &lt;BottomNavigationBarItem>&#91;
      BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
      BottomNavigationBarItem(icon: Icon(Icons.search), label: 'Search'),
      BottomNavigationBarItem(icon: Icon(Icons.person), label: 'Profile'),
    ],
    currentIndex: _currentIndex,
    onTap: _onItemTapped,
  ),
);
  }
}

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

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

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