0QY2ZYQUHusM33D9O7he.dart

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'MyApp Demo',
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: SingleChildScrollView(
            child: NavigationBar2Widget(),
          ),
        ),
      ),
    );
  }
}

class NavigationBar2Widget extends StatelessWidget {
  const NavigationBar2Widget({super.key});

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 350,
      child: NavigationBarTheme(
        data: NavigationBarThemeData(
          backgroundColor: Colors.grey.shade200,
          elevation: 20,
          indicatorColor: const Color(0x12000000),
          labelTextStyle: MaterialStateProperty.resolveWith((states) {
            if (states.contains(MaterialState.selected)) {
              return GoogleFonts.getFont(
                'Roboto',
                color: Colors.black,
                fontSize: 14,
              );
            }
            return GoogleFonts.getFont(
              'Roboto',
              color: Colors.black,
              fontSize: 12,
            );
          }),
          iconTheme: MaterialStateProperty.resolveWith((states) {
            if (states.contains(MaterialState.selected)) {
              return const IconThemeData(
                color: Color(0xFFDC00FF),
              );
            }
            return const IconThemeData(
              color: Color(0xFF00FF0E),
            );
          }),
          labelBehavior: NavigationDestinationLabelBehavior.alwaysShow,
        ),
        child: NavigationBar(
          selectedIndex: 0,
          onDestinationSelected: (index) {},
          backgroundColor: Colors.grey.shade200,
          elevation: 20,
          height: 56,
          labelBehavior: NavigationDestinationLabelBehavior.alwaysShow,
          destinations: const [
            NavigationDestination(
              icon: Icon(Icons.home),
              label: 'Home',
            ),
            NavigationDestination(
              icon: Icon(Icons.search),
              label: 'Search',
            ),
            NavigationDestination(
              icon: Icon(Icons.notifications),
              label: 'Notifications',
            ),
            NavigationDestination(
              icon: Icon(Icons.person),
              label: 'Profile',
            )
          ],
        ),
      ),
    );
  }
}