adaptive_navigation_view 2.0.1 copy "adaptive_navigation_view: ^2.0.1" to clipboard
adaptive_navigation_view: ^2.0.1 copied to clipboard

A Flutter package for creating adaptive navigation views that seamlessly adapt to different platforms and devices.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:adaptive_navigation_view/adaptive_navigation_view.dart';
import 'package:go_router/go_router.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      theme: ThemeData(brightness: Brightness.dark),
      themeMode: ThemeMode.dark,
      supportedLocales: const [
        Locale('en', 'US'),
        Locale('ar', 'DZ'),
      ],
      localizationsDelegates: const [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      //locale: Locale('en', 'US'),
      locale: Locale('ar', 'DZ'),
      routerConfig: _router,
    );
  }
}

class MyApp extends StatefulWidget {
  const MyApp({super.key, required this.state, required this.child});
  final GoRouterState state;
  final Widget? child;

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with TickerProviderStateMixin {
  late NavigationViewController controller;

  void _navigateToPath(String? path) {
    if (path != null) {
      context.go(path);
    }
  }

  Widget _buildLeading() {
    return Builder(
      builder: (context) => IconButton(
        onPressed: controller.previousPaths.isNotEmpty &&
                controller.previousPaths.length > 1
            ? () {
                controller.goBack();
              }
            : null,
        icon: Icon(Icons.adaptive.arrow_back),
        tooltip: 'Back',
      ),
    );
  }

  @override
  void initState() {
    controller = NavigationViewController(
      length: 6,
      initialPath: '/',
      destinationType: DestinationTypes.byPath,
      onDestinationPath: _navigateToPath,
      vsync: this,
    );
    super.initState();
  }

  @override
  void didUpdateWidget(covariant MyApp oldWidget) {
    super.didUpdateWidget(oldWidget);
    final currentPath = widget.state.matchedLocation;
    if (controller.selectedPath != currentPath) {
      controller.selectDestinationByPath(currentPath);
    }
  }

  @override
  void dispose() {
    super.dispose();
    controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return PopScope(
      // Impede o pop padrão do Android e delega ao controller
      canPop: false,
      onPopInvokedWithResult: (didPop, result) {
        if (didPop) return;

        if (controller.canGoBack) {
          controller.goBack();
        } else {
          // Nenhum histórico no controller: sai do app
          SystemNavigator.pop();
        }
      },
      child: NavigationView(
        controller: controller,
        appBar: NavigationAppBar(
          centerTitle: false,
          titleSpacing: 10,
          additionalLending: Padding(
            padding: const EdgeInsetsDirectional.only(start: 8.0),
            child: _buildLeading(),
          ),
          title: const Text('Navigation View Example'),
        ),
        pane: NavigationPane(
          footers: const [
            PaneItemDestination(
              icon: Icon(Icons.settings_outlined),
              selectedIcon: Icon(Icons.settings),
              label: Text('Settings'),
              path: '/settings',
            ),
          ],
          destinations: const [
            PaneItemDestination(
              icon: Icon(Icons.home_outlined),
              selectedIcon: Icon(Icons.home),
              label: Text('Home'),
              path: '/',
            ),
            PaneItemDestination(
              icon: Icon(Icons.person_outline),
              selectedIcon: Icon(Icons.person),
              label: Text('Profile'),
              path: '/profile',
            ),
            PaneItemDestination(
              icon: Icon(Icons.folder_outlined),
              label: Text('Documents'),
              children: [
                PaneItemDestination(
                  icon: Icon(Icons.description_outlined),
                  selectedIcon: Icon(Icons.description),
                  label: Text('Files'),
                  path: '/files',
                ),
                PaneItemDestination(
                  icon: Icon(Icons.image_outlined),
                  selectedIcon: Icon(Icons.image),
                  label: Text('Images'),
                  path: '/images',
                ),
              ],
            ),
          ],
        ),
        body: Card(
          margin: EdgeInsets.zero,
          elevation: 2,
          child: widget.child!,
        ),
      ),
    );
  }
}

final GoRouter _router = GoRouter(
  routes: <RouteBase>[
    ShellRoute(
      builder: (context, state, child) {
        return MyApp(state: state, child: child);
      },
      routes: <RouteBase>[
        GoRoute(
          path: '/',
          builder: (context, state) {
            return const Center(
              child: Text('Home'),
            );
          },
        ),
        GoRoute(
          path: '/profile',
          builder: (context, state) {
            return const Center(
              child: Text('Profile'),
            );
          },
        ),
        GoRoute(
          path: '/files',
          builder: (context, state) {
            return const Center(
              child: Text('Files'),
            );
          },
        ),
        GoRoute(
          path: '/images',
          builder: (context, state) {
            return const Center(
              child: Text('Images'),
            );
          },
        ),
        GoRoute(
          path: '/settings',
          builder: (context, state) {
            return const Center(
              child: Text('Settings'),
            );
          },
        ),
      ],
    ),
  ],
);
4
likes
160
points
279
downloads
screenshot

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

A Flutter package for creating adaptive navigation views that seamlessly adapt to different platforms and devices.

Repository (GitHub)
View/report issues

Topics

#navigation #adaptive #material #fluent-design #responsive

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on adaptive_navigation_view