flutter_speed_dial_navbar 0.0.2

A customizable and animated radial speed dial navigation bar for Flutter apps. Easily integrate a floating action button menu with multiple items to enhance UX, perfect for modern mobile UI designs.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_speed_dial_navbar/flutter_speed_dial_navbar.dart';
import 'package:flutter_speed_dial_navbar/src/flutter_speed_dial_navbar.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Speed Dial Navbar Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const DemoHomePage(),
    );
  }
}

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

  @override
  State<DemoHomePage> createState() => _DemoHomePageState();
}

class _DemoHomePageState extends State<DemoHomePage> {
  int _selectedIndex = 0;

  static const List<Widget> _pages = [
    Center(child: Text('🏠 Home Page')),
    Center(child: Text('🎬 Reels Page')),
    Center(child: Text('💾 Saved Page')),
    Center(child: Text('⚙️ Settings Page')),
  ];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
    debugPrint("Tapped on index: $index");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Speed Dial Example'),
      ),
      body: _pages[_selectedIndex],
      floatingActionButton: RadialFab(
        onItemSelected: _onItemTapped,
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
        shape: const CircularNotchedRectangle(),
        notchMargin: 8,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: const [
            IconButton(onPressed: null, icon: Icon(Icons.home)),
            SizedBox(width: 48), // Space for FAB
            IconButton(onPressed: null, icon: Icon(Icons.person)),
          ],
        ),
      ),
    );
  }
}