Animate layout transition from Row to Column

Viewed 817

I have a row that by tapping on it, layout changes to the new one. I want to animate this layout transition. something you have seen a lot with hero animations. but hero is only for route transitions.

The target animation is very simple consist of size and position animations:

  1. Image sizes increase and positioned to left: 0 , top: 0, right: screenSize.width and height to for example 200.
  2. texts will move below the image
  3. description text will enlarge enough to fit all remaining texts.

the problem is initial parent widget is Row but final parent widget is Column. but how can I animate this Row to Column layout transition? all the flutter animation tutorials I have seen relates to changing size, opacity, transform animations, but none of them described this kind of transition. How can I achieve this below layout transition animation?

enter image description here

1 Answers
Related