how to place a listview inside a SingleChildScrollView but prevent them from scrolling separately?

You could use your first widget-tree and apply the following changes:

In every ListView and GridView set shrinkWrap: true. This fixes the error message you were getting.
In every ListView and GridView set physics: NeverScrollableScrollPhysics(). This disables the scroll on them and new you can only scroll on the SingleChildScrollView

Set primary to false in your ListView.

ListView(
   primary: false,
),

That should prevent it from scrolling separately.

For me, setting primary to false and shrinkWrap to true worked.

ListView(
   primary: false,
   shrinkWrap: true,
),

Related