Animated transformation of Row to Column on layout change

I'm using a LayoutBuilder to layout 2 different widgets in a Row if the width is big enough, and in a Column if not. I would like to have some animation when the layout changes from Row to Column and vice-versa. I tried with Hero widgets but this didn't work.

Here is a simplified code and the result:

@override
Widget build(BuildContext context) {
  return Center(
    child: LayoutBuilder(
      builder: (context, constraints) {
        final isWide = constraints.maxWidth >= 600;
        if (isWide) {
          return Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Hero(
                tag: 'blue',
                child: Container(
                  color: Colors.blue,
                  height: 50,
                  width: 50,
                ),
              ),
              Hero(
                tag: 'red',
                child: Container(
                  color: Colors.red,
                  height: 50,
                  width: 50,
                ),
              )
            ],
          );
        } else {
          return Column(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Hero(
                tag: 'blue',
                child: Container(
                  color: Colors.blue,
                  height: 50,
                  width: 50,
                ),
              ),
              Hero(
                tag: 'red',
                child: Container(
                  color: Colors.red,
                  height: 50,
                  width: 50,
                ),
              )
            ],
          );
        }
      },
    ),
  );
}

How can I have an animation?