abimana_zanneta_nav 0.0.2

A modern glassmorphism bottom navigation bar package for Flutter with badges, custom icons, smooth animations, and flexible theming.

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Abimana Zanneta Nav',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: const Color(0xFF22A7FF),
          brightness: Brightness.dark,
        ),
        useMaterial3: true,
      ),
      home: const ExampleHomePage(),
    );
  }
}

class ExampleHomePage extends StatefulWidget {
  const ExampleHomePage({super.key});

  @override
  State<ExampleHomePage> createState() => _ExampleHomePageState();
}

class _ExampleHomePageState extends State<ExampleHomePage> {
  int _currentIndex = 0;

  static const _titles = ['Obrolan', 'Kontak', 'Pengaturan', 'Profil'];

  static const _icons = [
    Icons.chat_bubble_outline,
    Icons.person_outline,
    Icons.settings_outlined,
    Icons.account_circle_outlined,
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBody: true,
      body: DecoratedBox(
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
            colors: [Color(0xFF0A111B), Color(0xFF17324A), Color(0xFF07101A)],
          ),
        ),
        child: SafeArea(
          child: Padding(
            padding: const EdgeInsets.fromLTRB(24, 24, 24, 128),
            child: AnimatedSwitcher(
              duration: const Duration(milliseconds: 260),
              child: _ExamplePage(
                key: ValueKey(_currentIndex),
                icon: _icons[_currentIndex],
                title: _titles[_currentIndex],
              ),
            ),
          ),
        ),
      ),
      bottomNavigationBar: AbimanaZannetaNav(
        selectedIndex: _currentIndex,
        enableSlidingIndicator: true,
        onItemSelected: (index) {
          setState(() => _currentIndex = index);
        },
        items: const [
          AbimanaZannetaNavItem(
            icon: Icon(Icons.chat_bubble_outline),
            activeIcon: Icon(Icons.chat_bubble),
            label: 'Obrolan',
            badgeCount: 4,
          ),
          AbimanaZannetaNavItem(
            icon: Icon(Icons.person_outline),
            activeIcon: Icon(Icons.person),
            label: 'Kontak',
          ),
          AbimanaZannetaNavItem(
            icon: Icon(Icons.settings_outlined),
            activeIcon: Icon(Icons.settings),
            label: 'Pengaturan',
          ),
          AbimanaZannetaNavItem(
            icon: Icon(Icons.account_circle_outlined),
            activeIcon: Icon(Icons.account_circle),
            label: 'Profil',
          ),
        ],
      ),
    );
  }
}

class _ExamplePage extends StatelessWidget {
  const _ExamplePage({super.key, required this.icon, required this.title});

  final IconData icon;
  final String title;

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(icon, size: 72, color: const Color(0xFF22A7FF)),
          const SizedBox(height: 18),
          Text(
            title,
            style: Theme.of(context).textTheme.headlineMedium?.copyWith(
              color: Colors.white,
              fontWeight: FontWeight.w800,
            ),
          ),
        ],
      ),
    );
  }
}