如何处理 flutter 中小部件的唯一性？

Question

I have a project. I am trying to make a scanner. Everything is going well except for previews of the images.

This how preview should like this. I manage the make the view of this screenshot. But the problem is that I couldn't manage to make unique for every title. I hold my titles in location table and my images in image table. Image table has location id so that in every location has different images from each other. But my code is overriding all the locations so they are showing same images of one location. Like this: : Only first one has a picture but my code show like they have all the same image.

This is my part of the homescreen code:

                   future: future,
                   builder: (ctx, snapshot) =>
                       snapshot.connectionState == ConnectionState.waiting
                           ? Center(
                               child: CircularProgressIndicator(),
                             )
                           : Consumer<Titles>(
                               builder: (ctx, titles, ch) => Expanded(
                                 child: ListView.builder(
                                     controller: ScrollController(),
                                     scrollDirection: Axis.vertical,
                                     shrinkWrap: true,
                                     itemCount: titles.items.length,
                                     itemBuilder: (ctx, i) { if (searchString=="") {
                                       getimages(titles.items[i].id);
   
                                       print(list_of_images);
                                       print("yukarıda");
   
                                       return TitleList(titleList:titles.items[i],images:list_of_images);
                                     }
                                     getimages(titles.items[i].id);    
                                     return titles.items[i].title!.contains(searchString) ?  TitleList(titleList:titles.items[i],images:list_of_images) :Container(); 
}

I am sending the title and images to TitleList widget:

I am getting the images like this:

    List<File> list_of_images=[];
    void getimages(id)    {
        print("fark ne kadar");
      Future<List<Map<String, dynamic>>> futureTasks = DBHelper.selectImageforlist(id); //first make the querylist_of_images
       futureTasks.then((data){
        print("heyoo");
        print(data);
        for(int i = 0; i < data.length; i++) {
          list_of_images.add(File(data[i]['Image']));
        }
      });
    }

And this is the part of the TitleListWidget code:

var titleList;
  List<File> images;

  TitleList({required this.titleList,required this.images});

return GestureDetector(
      onTap: () {
        Navigator.of(context).pushNamed(
          ImageScreen.routeName,
          arguments: {'id': titleList.id, 'name': titleList.title},
        );
      },
      child: Row(
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              Container(
                padding: EdgeInsets.only(top: 15, left: 12),
                child: Row(
                  children: [
                    Container(
                      child: Text(
                        truncate(titleList.title, length: 7),
                        style: TextStyle(
                            fontSize: 20,
                            fontWeight: FontWeight.bold,
                            color: Colors.white),
                      ),
                    ),
                    Container(
                        padding: EdgeInsets.only(left: 15),
                        child: Text(
                          getdate(titleList.date),
                          style: TextStyle(
                              fontWeight: FontWeight.normal,
                              color: Colors.white),
                        )),
                  ],
                ),
              ),
              Container(
                padding: EdgeInsets.only(left: 10),
                child: Row(children: [
                  Stack(
                    overflow: Overflow.visible,
                    children: makephoto(
                        images.length, images),
                  ),

                ]),
              )
            ],
          ),

Answer 1

I used map. I took every image to Map. The key of the image is the FileId.

 Future<Map> getimages() async   {
    print("fark ne kadar");
  Future<List<Map<String, dynamic>>> futureTasks = DBHelper.selectImageforlist(); //first make the querylist_of_images
   futureTasks.then((data){
    print("heyoo");
    print(data);
    for(int i = 0; i < data.length; i++) {
      if (identifier.containsKey(data[i]['fileId'])){
        identifier[data[i]['fileId']].add(File(data[i]['Image']));


      }
      else {
        identifier[data[i]['fileId']]=[File(data[i]['Image'])];
      }
    }
  });
   return identifier;
  }