Flutter，更新 Bloc 內有狀態小部件列表的狀態

Question

我正在構建一個網格系統，並且在連續更新每個小部件的狀態時遇到了麻煩。 它們的大小需要動態變化。 在某些情況下會調用 didUpdateWidget()，但每個小部件的狀態並不總是更新。

基本上，我如何遍歷 Bloc 函數內的 StatefulWidgets 列表，並讓每個 Widget 更新其狀態以便寬度發生變化？

我發現的所有指南都關注有狀態小部件在內部而不是外部更新自身。

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),
      ),
    );
  }
}

只是補充一下，這將是我正在使用的 for 循環..我已經刪除了從我的小部件中為這個問題編寫 updateItemWidth 的所有嘗試。

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

}

Answer 1

所以我最終找到了一個解決方案

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));

由於沒有正確的方法來強制刷新，通過完全刪除一個 Widget 並重新創建它，您可以調用 build 方法。 我也切換到 StatelessWidget。