Flutter How to update widgets one after the other instead of at the same time - flutter

Question

I want the function update_list to change the values in the list when it is called. And then I want it to change the text in the column.
That works, but now I want the first value to change (and to see the new value on the screen) and then a second later the next value and so on. But with my code it changes all together at the end.
How can I make the values change one after the other and not all at once?
class class_one extends StatefulWidget {
const class_one({Key? key}) : super(key: key);
#override
State<class_one> createState() => _class_oneState();
}
class _class_oneState extends State<class_one> {
List list = [0,1,2,3];
void update_list(){
setState((){
for (var i = 0; i < 4; i++){
list[i]=list[i]+10;
sleep(Duration(seconds: 1));
}
});
}
#override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
Text('${list[0]}'),
Text('${list[1]}'),
Text('${list[2]}'),
Text('${list[3]}'),
GestureDetector(onTap: (){update_list();},child: Container(color: Colors.red,child: Text("next"),),)
],
),
);
}
}

Answer 1

you can use two solution for this issue:
1: use streaming mechanism(actually use from streamBuilder widget).
2:
void update_list() async{
for (var i = 0; i < 4; i++){
setState((){
list[i]=list[i]+10;
});
await Future.delayed(Duration(seconds: 1));
}
}