Flutter，更新 Bloc 内有状态小部件列表的状态

Question

I am building a grid system and have been trouble updating the State of every widget in a row. Their sizes need to dynamically change. didUpdateWidget() is called in certain cases, but the state of every widget isn't always updated.

Basically how can I loop through a List of StatefulWidgets inside a Bloc function, and have each Widget update their state so the width will change?

All the guides I am finding focus on Stateful Widget updating itself interally, rather than externally.

class ResponsiveGridItem extends StatefulWidget {

   double itemWidth;
   double height;
   Color color;
   String content;
   int row;
   int column;
   bool empty;

 ResponsiveGridItem(
      
        this.itemWidth ,
        this.height ,
        this.color,
        this.content,
        this.row,
        this.column,
        this.empty,);


  @override
  ResponsiveGridItemState createState() => ResponsiveGridItemState();
 } 

class ResponsiveGridItemState extends State<ResponsiveGridItem> {
  double itemWidth = 37;
  double height = 100;
  Color color = Colors.blue;
  String content = "";
  int row;
  int column;
  bool empty = true;

  @override
  initState() {
    super.initState();
     itemWidth = widget.itemWidth;
    // print("init itemWdith is " + itemWidth.toString());
     height = widget.height;
     color = widget.color;
     content = widget.content;
     row = widget.row;
     column = widget.column;
     empty = widget.empty;
  }


  @override
  void didUpdateWidget(ResponsiveGridItem oldWidget) {
  
      itemWidth = widget.itemWidth;
      color = widget.color;
      row = widget.row;
      column = widget.column;
      content = widget.content;
      empty = widget.empty;
     
    super.didUpdateWidget(oldWidget);
  }

 
  @override
  Widget build(BuildContext context) {

   
    return Container(
      height: 100,
      width: itemWidth,
      alignment: Alignment(0, 0),
      color: color,
      child: DragTargetWidget(
        row,
        column,
        empty,
        cardItem: CardItem(content: content, width: itemWidth),
      ),
    );
  }
}

Just to add, this would be the for loop I am using.. I have removed all attempts at writing updateItemWidth from my widget for this question.

 for (int i = 0; i < gridData[row].length; i++) {
     
    gridData[row][i].updateItemWidth(newGridItemsSize);

}

Answer 1

So a solution I found in the end

var gridItem =  gridData[row][i];
gridData[row].removeAt(i);
          
gridData[row].insert(i, new ResponsiveGridItemSolid(
              gridItem.itemWidth, gridItem.height, gridItem.color, gridItem.content,  row, i, gridItem.empty));

Since there is no proper way to force refresh, by removing a Widget completely, and recreating it, you can invoke the build method. I've switched to a StatelessWidget as well.