fix: Search anchor box location when used on nested navigator (#127198)
This PR is to fix the position of `SearchAnchor` when used with nested navigator. This solution is based on what `DropdownButton` internally do, looking to the closest `Navigator` to proper calculate the where to render `SearchViewRoute`.
Fixes: https://github.com/flutter/flutter/issues/126435
<details>
<summary>Test case</summary>
```dart
void main() => runApp(const NestedSearchBarApp());
class NestedSearchBarApp extends StatefulWidget {
const NestedSearchBarApp({super.key});
@override
State<NestedSearchBarApp> createState() => _NestedSearchBarAppState();
}
class _NestedSearchBarAppState extends State<NestedSearchBarApp> {
final SearchController controller = SearchController();
@override
Widget build(BuildContext context) {
final ThemeData themeData = ThemeData(useMaterial3: true);
return MaterialApp(
theme: themeData,
builder: (BuildContext context, Widget? child) {
return Scaffold(
body: Row(
children: <Widget>[
NavigationRail(
selectedIndex: 1,
destinations: const <NavigationRailDestination>[
NavigationRailDestination(
icon: Icon(Icons.favorite_border),
selectedIcon: Icon(Icons.favorite),
label: Text('First'),
),
NavigationRailDestination(
icon: Icon(Icons.bookmark_border),
selectedIcon: Icon(Icons.book),
label: Text('Second'),
),
],
),
const VerticalDivider(thickness: 1, width: 1),
Expanded(child: child!)
],
),
);
},
home: Scaffold(
appBar: AppBar(title: const Text('Search Anchor Sample')),
body: Column(
children: <Widget>[
SearchAnchor(
searchController: controller,
builder: (BuildContext context, SearchController controller) {
return IconButton(
icon: const Icon(Icons.search),
onPressed: () {
controller.openView();
},
);
},
suggestionsBuilder:
(BuildContext context, SearchController controller) {
return List<ListTile>.generate(5, (int index) {
final String item = 'item $index';
return ListTile(
title: Text(item),
onTap: () {
setState(() {
controller.closeView(item);
});
},
);
});
}),
Center(
child: controller.text.isEmpty
? const Text('No item selected')
: Text('Selected item: ${controller.value.text}'),
),
],
),
),
);
}
}
```
</details>
<details>
<summary>Before fix:</summary>

</details>
<details>
<summary>After fix:</summary>

</details>