I am having trouble on adding random images to the page by using floating action button. After drawing image from .shuffle list, I want to draw another picture from the list. I was able to add more picture with the action button, but when pressing the floating action button, it also changes the previous image. As a result, even if I can shuffle the images, I can only get the result of showing large amount of same image instead of adding different image.

 
List stickerList = [];

void addNewImageToList () {
  setState(() {
    stickerList.add(Container(
       width: 250,
       height: 250,
       decoration: BoxDecoration(
        image: DecorationImage(
        image: AssetImage(
           'lib/images/${assetsList[stickerList.length]}'),
        fit: BoxFit.fill,),  
        borderRadius: BorderRadius.circular(50)
    ));
  });
}


body: ListView.builder(
      itemCount: stickerList.length,
      itemBuilder: (context, index) {
        return Column(
          children: [Container(
                    width: 250,
                    height: 250,
                    decoration: BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage(
                          'lib/images/${assetsList[stickerList.length]}'),
                    fit: BoxFit.fill,),  
                    borderRadius: BorderRadius.circular(50))
          )],
        );
      },),

floatingActionButton:FloatingActionButton(
          onPressed: () {
          addNewImageToList();},
      heroTag: Icons.group_add,
      child: Icon(Icons.group_add),)

I would like to ask how can I modify it and add a new image from shuffle list every time without affect the previously added image?
What logic direction should I go for?
Like, disconnecting the previous image with the action button?
Generating a shuffle list and call the image accordingly with ascending order without shuffling it every time?
I am not quite sure which direction is valid as I am not quite familiar with coding.
Thank you.