I’d like to use localised strings in bottom navigation bar using StatefulShellRoute.indexedStack
. How to achieve that?
MaterialApp.router(
...
routerConfig: goRouter
)
final goRouter = GoRouter(
...
routes: [
StatefulShellRoute.indexedStack(
builder: (context, state, navigationShell) {
return AppFrameWithNavBar(navigationShell: navigationShell);
},
class AppFrameWithNavBar extends ConsumerWidget {
const AppFrameWithNavBar({
required this.navigationShell,
Key? key,
}) : super(key: key ?? const ValueKey('ScaffoldWithNestedNavigation'));
final StatefulNavigationShell navigationShell;
@override
Widget build(BuildContext context, WidgetRef ref) {
_listenForConnectivityChanges(ref, context);
return Scaffold(
body: navigationShell,
bottomNavigationBar: NavigationBar(
selectedIndex: navigationShell.currentIndex,
destinations: [
NavigationDestination(
label: AppLocalizations.of(context)!.app_name,
icon: const Icon(Icons.local_drink),
),
NavigationDestination(
label: AppLocalizations.of(context)!.parties,
icon: const Icon(Icons.meeting_room),
),
NavigationDestination(
label: AppLocalizations.of(context)!.user,
icon: const Icon(Icons.manage_accounts),
),
],
onDestinationSelected: _goBranch,
),
);
}
}
I get a following error: Null check operator used on a null value
, problem is Applocalizations.of(context)
being null on the app startup.
It seems like a common case – localization of strings in the bottom nav bar. How to achieve that?
I found a solution, turned out I was missing AppLocalizations.delegate
in localizationsDelegates
list.
return MaterialApp.router(
...
localizationsDelegates: const [
AppLocalizations.delegate,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],
)