Tutorial
Reading State
Read the current location, route parameters, pane and shell scopes from any widget.
Cheat sheet
AdaptiveRouter.of(context).location.value; // '/products/1'
AdaptiveRouteState.of(context).pathParameters; // {'id': '1'}
AdaptivePaneScope.maybeOf(context) != null; // inside a two-column pane?
AdaptivePaneScope.maybeOf(context)?.title.value = name; // breadcrumb title
AdaptiveShellScope.maybeOf(context)?.isExpanded; // two columns right now?
A live location label
location, matches and currentBranch
on the router are signals. Wrap readers in SignalBuilder (from signals_flutter) and they rebuild on every navigation. Drop this into the tutorial's
AccountPage list:
SignalBuilder(
builder: (context) => ListTile(
leading: const Icon(Icons.link),
title: Text(AdaptiveRouter.of(context).location.value),
),
)
Pane and shell scopes
-
AdaptivePaneScope.maybeOf(context)is non-null only inside a two-column pane. Use it to chooseuseRootNavigatorfor dialogs and to set titles. -
AdaptiveShellScope.maybeOf(context)gives theAdaptiveShellState(currentIndex,isCompact,isMedium,isExpanded,goBranch) to widgets deep inside the shell.
Drawing titles in your own chrome
To render titles somewhere other than the built-in breadcrumb strip, read AdaptiveRouter.of(context).matches.value.branchMatches; each match has a
title signal and a name.
Next: Layout without the router.