periwinkle-flora-7707

readme.md

periwinkle-flora-7707

Created with <3 with dartpad.dev.

main.dart

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

/// Flutter code sample for [NavigationRail].

void main() => runApp(const NavigationRailExampleApp());

final GoRouter _router = GoRouter(
  routes: <RouteBase>[
    GoRoute(
      path: '/',
      builder: (BuildContext context, GoRouterState state) {
        return const PageScreen(page: 1);
      },
    ),
    GoRoute(
      path: '/second',
      builder: (BuildContext context, GoRouterState state) {
        return const PageScreen(page: 2);
      },
    ),
    GoRoute(
      path: '/third',
      builder: (BuildContext context, GoRouterState state) {
        return const PageScreen(page: 3);
      },
    ),
  ],
);

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(useMaterial3: true),
      home: const NavRailExample(),
    );
  }
}

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

  @override
  State<NavRailExample> createState() => _NavRailExampleState();
}

class _NavRailExampleState extends State<NavRailExample> {
  int _selectedIndex = 0;
  NavigationRailLabelType labelType = NavigationRailLabelType.all;
  bool showLeading = false;
  bool showTrailing = false;
  double groupAlignment = -1.0;

  _NavRailExampleState() {
    WidgetsBinding.instance.addPostFrameCallback((_) {
    _router.routerDelegate.addListener(_navigatorListener);
    });
  }

  _navigatorListener() {
    final location =
        _router.routerDelegate.currentConfiguration.last.matchedLocation;
    int index = ['/', '/second', '/third'].indexOf(location);
    print(location);
    if (index >= 0) {
      setState(() {
        _selectedIndex = index;
      });
    }
  }

  @override
  dispose() {
    _router.routerDelegate.removeListener(_navigatorListener);
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Row(
          children: <Widget>[
            NavigationRail(
              selectedIndex: _selectedIndex,
              groupAlignment: groupAlignment,
              onDestinationSelected: (int index) {
                setState(() {
                  _selectedIndex = index;
                  _router.push(['/', '/second', '/third'][index % 3]);
                });
              },
              labelType: labelType,
              leading: showLeading
                  ? FloatingActionButton(
                      elevation: 0,
                      onPressed: () {
                        // Add your onPressed code here!
                      },
                      child: const Icon(Icons.add),
                    )
                  : const SizedBox(),
              trailing: showTrailing
                  ? IconButton(
                      onPressed: () {
                        // Add your onPressed code here!
                      },
                      icon: const Icon(Icons.more_horiz_rounded),
                    )
                  : const SizedBox(),
              destinations: const <NavigationRailDestination>[
                NavigationRailDestination(
                  icon: Icon(Icons.favorite_border),
                  selectedIcon: Icon(Icons.favorite),
                  label: Text('First'),
                ),
                NavigationRailDestination(
                  icon: Badge(child: Icon(Icons.bookmark_border)),
                  selectedIcon: Badge(child: Icon(Icons.book)),
                  label: Text('Second'),
                ),
                NavigationRailDestination(
                  icon: Badge(
                    label: Text('4'),
                    child: Icon(Icons.star_border),
                  ),
                  selectedIcon: Badge(
                    label: Text('4'),
                    child: Icon(Icons.star),
                  ),
                  label: Text('Third'),
                ),
              ],
            ),
            const VerticalDivider(thickness: 1, width: 1),
            // This is the main content.
            Expanded(
              child: MainPage(),
            ),
          ],
        ),
      ),
    );
  }
}

class MainPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerConfig: _router,
    );
  }
}

class PageScreen extends StatelessWidget {
  final int page;
  const PageScreen({required this.page, super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
            child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
          Padding(
              padding: const EdgeInsets.all(5),
              child: ElevatedButton(
                  onPressed: _router.canPop()
                      ? () {
                          _router.pop();
                        }
                      : null,
                  child: const Text('POP'))),
          Text(['first', 'second', 'third'][(page - 1) % 3])
        ])));
  }
}