Remove Image from Widget's list - flutter

Question

On my Page, I have a button to take picture. Once that picture is taken, it'll update my Model (it's using Provider ChangeNotifier). And once picture is taken, the Page gets rebuild, and in the Scaffold main I'm build the widgets:
Widget build(BuildContext context) {
return SingleChildScrollView(
// Somewhere in the middle of this
getPicturesSection(),
// Continue with other widgets
)
}
Widget getPicturesSection(BuildContext context) {
var imagesPath = Provider.of<MyModel>(context, listen:false).imagesPath;
var wids = <Widget>[]
// Basically show all the taken pictures
imagesPath.forEach((f) {
wids.add(
Image.file(
File(f)
)
)
})
return Row(children: wids);
}
What I want to do is allow users to delete each image. So I want to add a delete icon below each image:
imagesPath.forEach((f) {
wids.add(
Column(
children: <Widget> [
Image.file(
File(f)
),
IconButton(
onTap: () {
// How do I delete from the very same list that I am using to build this list?
}
),
],
)
)
})
Never mind, I figured out the answer. Since I'm already using ChangeNotifier, I just need to add the function to remove entry from the model, and the changes will propagate downwards.
List<String> imagesPath = new List<String>();
removeRejectionPicturePath(int ind) {
this.imagesPath.removeAt(ind);
notifyListeners(); // This will basically ask all the widgets that is the listener to rebuild the widget tree
}

Answer 1

You can try this !
imagesPath.forEach((f) {
wids.add(
Column(
children: <Widget> [
Image.file(
File(f)
),
IconButton(
icon:Icon(Icons.remove_circle),
onPressed: () {
setState((){
wids.removeAt(imagesPath.values.toList().indexOf(f));
});
}
),
],
)
);
});