导航到从列表中的联系人

Question

我想点击一个特定的联系人，并带我到他们的页面。我不知道如何让导航工作。当我点击联系人列表页面的名字，我希望它带我去的那个人的信息viewContact页。

    class ContactList extends StatelessWidget {
  final List<Contact> _contacts;

  ContactList(this._contacts);

  @override
  Widget build(BuildContext context) {
    return new ListView.builder(
      padding: new EdgeInsets.symmetric(vertical: 8.0),
      itemBuilder: (context, index) {
        return new _ContactListItem(_contacts[index], onTap: () {
          Navigator.push(context,  MaterialPageRoute(builder: (context) => viewContact()),
        });
      },

      itemCount: _contacts.length,
    );

  }
}

其他选项我想出了：

class ContactList extends StatelessWidget {
  final List<Contact> _contacts;

  ContactList(this._contacts);

  @override
  Widget build(BuildContext context) {
    return new ListView.builder(
      padding: new EdgeInsets.symmetric(vertical: 8.0),
      itemBuilder: (context, index) {
        return new _ContactListItem(_contacts[index]);
        Navigator.push(context,  MaterialPageRoute(builder: (context) => viewContact())
        );
      },

      itemCount: _contacts.length,
    );

  }
}

Answer 1

我认为这是一个Proper page navigation的副本无法标志，因为其他的问题没有一个给予好评或接受的答案。粘贴在这里我的回答也是如此。

这里有几件事情，我可以立即指出（问题）：

• onPressed不适用于ListView.builder()，您可以点击这里：https://docs.flutter.io/flutter/widgets/ListView/ListView.builder.html
• Navigator.push(context, MaterialPageRoute(builder: (context) => viewContact())这不会执行，因为它是return后

建议：

• 您可能需要一个包裹里面_ContactListItem()您GestureDetector和实施onTap回调

示例代码：

class ContactList extends StatelessWidget {
  final List<Contact> _contacts;

  ContactList(this._contacts);

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      padding: EdgeInsets.symmetric(vertical: 8.0),
      itemBuilder: (context, index) {
        return GestureDetector(
          onTap: () {
            //TODO: Insert your navigation logic here
            Navigator.of(context).push(MaterialPageRoute(
                builder: (BuildContext context) =>
                    ContactView(_contacts[index])));
          },
          child: _ContactListItem(_contacts[index]),
        );
      },
      itemCount: _contacts.length,
    );
  }
}

• 另一种选择可能是改变_ContactListItem()的实现，并且可以使用ListTile和实施onTap的ListTile，你可以在这里找到：https://docs.flutter.io/flutter/material/ListTile-class.html
• 你也可以尝试推行命名路由，这里是该https://flutter.io/cookbook/networking/named-routes/教程

我希望这是有帮助的某种方式，让我知道如果我误解了问题。

Answer 2

我建议你对这个教程一看，因为它看起来是你想达到什么：https://flutter.io/docs/cookbook/navigation/passing-data

我们的想法是要重新定义页内MaterialRoutePage发送特定的数据。

这里的例子

onTap: () {
  Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => DetailScreen(contact: contact_information),
    ),
  );
},

但是，你的DetailScreen构造应采取接触作为参数。

希望能帮助到你 ！！