class ColorStatefulBox extends StatefulWidget {
  const ColorStatefulBox({Key? key, required this.color}) : super(key: key);
  final Color color;

  @override
  State<ColorStatefulBox> createState() => _ColorBoxState();
}

class _ColorBoxState extends State<ColorStatefulBox> {
  int count = 0;
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        count++;
        setState(() {});
      },
      child: Container(
        color: widget.color,
        width: 100+count.toDouble(),
        height: 100+count.toDouble(),
        child: Center(
          child: Text(
            count.toString(),
            style: TextStyle(fontSize: 30),
          ),
        ),
      ),
    );
  }
}
class TestPage extends StatefulWidget {
  @override
  _TestPageState createState() => _TestPageState();
}

class _TestPageState extends State<TestPage> {
  List<Widget> widgetList = [
    ColorStatefulBox(
      color: Colors.yellow,
      key: GlobalKey(),
    ),
    ColorStatefulBox(
      color: Colors.blue,
      key: GlobalKey(),
    )
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("key test"),
        ),
        body: Container(
          padding: EdgeInsets.all(20),
          child: Column(
              children: [...widgetList],),
        ),);
  }
}

当点击ColorStatefulBox时，它会变大。另外一个ColorStatefulBox会按列移动。关键是：列如何知道它的子级更改大小并需要移动其他子级？
我在Column的重新构建中创建了一个断点，但是当单击ColorStatefulBox时它不会调用