从列表导航到联系人答案

【问题标题】：Navigate to a contact from list从列表导航到联系人
【发布时间】：2018-09-11 23:51:55
【问题描述】：

所以目前我有一个联系人列表，我可以在其中查看静态列表中的联系人。我希望能够单击搜索栏，而不是将其放在联系人上方，模糊用户视图，搜索将在一个新的空白页面中打开

 class _ContactPage extends State<ContactsPage> {
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          home: new Scaffold(
              appBar: new AppBar(
                title: widget.appBarTitle,

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

您可以将 Scaffold 的主体包裹在导航器中，并在您开始输入时将搜索页面推送到该导航器上。像这样的：

...

// Declare this at the top
_navigatorKey = new GlobalKey<NavigatorState>();

...

// onChanged method for your search text field
onChanged: (value) {
  if (shouldShowSearchResults) {  // TODO
    _navigatorKey.currentState.pushNamed('contacts/search');
  } else if (shouldHideSearchResults {  // TODO
    _navigatorKey.currentState.pop();
  }
}

...

// New body for your Scaffold
body: new Navigator(
  key: _navigatorKey,
  initialRoute: 'contacts',
  onGenerateRoute: (RouteSettings settings) {
    if (settings.name == 'contacts') {
      return new MaterialPageRoute(
        builder: (_) => new ContactList(kContacts),
        settings: settings
      );
    } else if (settings.name == 'contacts/search') {
      return new MaterialPageRoute(
        builder: (_) => new SearchPage(contacts: kContacts, search: searchValue),  // TODO
        settings: settings
      );
    }
  }
)

...

【讨论】：