Как сделать список контактов интерактивным?

Question

Итак, я следую этому уроку https://medium.com/@XensS/flutter-v-material-design-ii-7b0196e7b42d и пытаюсь создать что-то вроде списка контактов, в котором вы нажимаете на контакт, и он переносит вас на другой экран со всей информацией о нем. Но я просто застреваю, я не уверен, как добавить интерактивность, поэтому, когда вы нажимаете на контакт, он переносит вас на личную страницу. Это мой код до сих пор. Код для отображения списка контактов и строки поиска:

import 'package: flutter / material.dart';

class ContactsPage extends StatefulWidget {
  Widget appBarTitle = new Text("Contacts");
  Icon actionIcon = new Icon(Icons.search);

  @override
  State<StatefulWidget> createState() {
    return new _ContactPage();
  }
}

class _ContactPage extends State<ContactsPage> {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
          appBar: new AppBar(
            title: widget.appBarTitle,
            actions: <Widget>[
              new IconButton(
                icon: widget.actionIcon,
                onPressed: () {
                  setState(() {
                    if (widget.actionIcon.icon == Icons.search) {
                      widget.actionIcon = new Icon(Icons.close);
                      widget.appBarTitle = new TextField(
                        style: new TextStyle(
                          color: Colors.white,
                        ),
                        decoration: new InputDecoration(
                            prefixIcon:
                            new Icon(Icons.search, color: Colors.white),
                            hintText: "Search...",
                            hintStyle: new TextStyle(color: Colors.white)),
                        onChanged: (value) {
                          print(value);
                          //filter your contact list based on value
                        },
                      );
                    } else {
                      widget.actionIcon =
                      new Icon(Icons.search); //reset to initial state
                      widget.appBarTitle = new Text("Contacts");
                    }
                  });
                },
              ),
            ],
          ),
          body: new ContactList(kContacts)),

    );
  }
}

class ContactPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("Contacts"),
        ),
        body: new ContactList(kContacts));
  }
}


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]);
      },
      itemCount: _contacts.length,
    );
  }
}

class _ContactListItem extends ListTile {
  _ContactListItem(Contact contact)
      : super(
      title: new Text(contact.fullName),
      leading: new CircleAvatar(child: new Text(contact.fullName[0])));
}

А это код, который хранит всю контактную информацию:

class Contact {
  final String fullName;

  const Contact({this.fullName});
}


const kContacts = const <Contact>[
  const Contact(
      fullName: 'Joey Trib',

  ),
  const Contact(
      fullName: 'Johnny Boy',

  )
];

Answer 1

Решение этой проблемы находится в репозитории для учебника, на который вы ссылаетесь

List<_ContactListItem> _buildContactList() {
return _contacts.map((contact) =>
                      new _ContactListItem(
                        contact: contact,
                        onTap: () { _showContactPage(context, contact); }
                      ))
                .toList();
}

void _showContactPage(BuildContext context, Contact contact) {
Navigator.push(context, new MaterialPageRoute<Null>(
  settings: const RouteSettings(name: ContactPage.routeName),
  builder: (BuildContext context) => new ContactPage(contact)
));
}

}

Источник:

https://github.com/fabiomsr/Flutter-StepByStep/blob/master/step5/lib/module/contacts/contact_list_view.dart#L110