Flutter - How can i query the same document id - on the next page - as a ListTile that was previously clicked

Question

Basically what i'm saying is - I have a listview.builder and each ListTile displays three fields from a particular document in my firestore collection. What i want to implement is , when that listtile is clicked it should take the user to a page that displays more fields from that same document. What i want to know is, What i am supposed to query and how can i get the exact same document id.

For more understanding, take a chat app for instance. When a list tile showing another users profile pic and name is clicked, how can i ensure the next page that's meant to show more fields about that user, queries its data from the same document as the list tile perviously clicked.

I'm not sure i explained that well but thanks anyway, would appreciate some help.

Part of my ListView.builder, for more context

FutureBuilder(
        future: getFifaTourneyData(),
        builder: (_, snapshot) {
          return ListView.builder(
              itemCount: snapshot.data.length,
              itemBuilder: (_, index) {
                return GestureDetector(
                    child: Container(
                      margin: EdgeInsets.only(top: 5),
                      width: 120,
                      height: 195,
                      decoration: BoxDecoration(
                        color: Colors.black,
                        borderRadius: BorderRadius.circular(4),
                        image: DecorationImage(
                            image:
                                AssetImage("assets/images/FifaImage3.jpg"),
                            colorFilter: new ColorFilter.mode(
                                Colors.black.withOpacity(0.5),
                                BlendMode.dstATop),
                            fit: BoxFit.cover),
                      ),
                      child: Container(
                        margin:
                            EdgeInsets.only(right: 10, left: 10, bottom: 0),
                        height: 190,
                        width: 340,
                        padding: EdgeInsets.all(10),
                        child: Column(children: <Widget>[
                          Container(
                            child: Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  Icon(
                                    FontAwesomeIcons.playstation,
                                    color: Colors.white,
                                    size: 35,
                                  ),
                                  Padding(
                                    padding:
                                        EdgeInsets.fromLTRB(130, 0, 0, 0),
                                  ),
                                  Text(
                                    "12 / 16 registered",
                                    style: TextStyle(
                                        color: Colors.white, fontSize: 13),
                                  )
                                ]),
                          ),
                          Padding(padding: EdgeInsets.only(top: 20)),
                          Container(
                            alignment: Alignment.center,
                            child: Text(
                                snapshot.data[index].data['tourneyname'] !=
                                        null
                                    ? snapshot
                                        .data[index].data['tourneyname']
                                    : 'No Name',
                                style: TextStyle(
                                    color: Colors.white,
                                    fontSize: 23,
                                    fontWeight: FontWeight.bold)),
                          ),
                          Padding(padding: EdgeInsets.only(top: 7)),
                                     .........
                      

Answer 1

If it's only the document id you need on the next page, you can pass it to it's constructor like so:

GestureDetector(
  onTap: () {
    Navigator.of(context).push(
      MaterialPageRoute(builder: (_) => NextPage(snapshot.data.documents[index].documentID)
    );
  },
  child: Container........
),

Your next page widget's constructor will be like:

class NextPage extends StatelessWidget {
   final String docID;

   NextPage(this.docID);

   @override
    Widget build(BuildContext context) {
         return ........
    }
}