Scale down all children in widget by a factor based on the parent size

Question

In Flutter I am implementing "what's new" screens which will show a preview of the real screens in the app. For that I reuse the screen Widgets in the "what's new" flow. The preview will be shown in a smaller Container and not cover the whole screen.

I want to scale down the text sizes, line heights, etc. for all widgets within this Container to match the smaller bounds. Is there a way to do this without individually adding a smaller style for every Widget separately?

e.g. scale down all fontSizes by 20% for a Widget child regardless of the size set in the theme

Answer 1

I found the solution. Wrapping the child widget tree with Transform.scale(...) will scale all the Widgets down the tree according to the supplied scale factor.

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    Transform.scale(
      scale: 0.9,
      child: MyScaledWidgetTree(),
     ),
     Container(
      child: ...,
     ),
   ],
)