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

516

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: ...,
     ),
   ],
)
Share:
516
MrJM
Author by

MrJM

Android consultant and Google enthusiast lucky to have worked on various projects at different big companies throughout Belgium. Eager to learn and try new things. It's all about mobile!

Updated on November 21, 2022

Comments

  • MrJM
    MrJM over 1 year

    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