I have a widget A
that I want to scale (pixel perfect). Depending on display width of the device, the size of A
should be either increased or decreased. I tried the Transform.scale
widget to change the size of the A
. This works well but the size of the Transform.scale
widget never changes. It always matches the original size of A
(without scaling).
Is there any way to force Transform.scale
that it always adopts the size of its child? Or is there an alternative approach?
You can find an image here that shows the current and the required situation
EDIT:
Widget A
and its children should shrink/grow uniformly. The ratios between them should not change.
Here is the code I currently tried
_buildWidgetA(scalingFactor) {
return Transform.scale(
scale: scalingFactor,
child: A(),
);
}
Thanks to the input from @LOfG I learned that you cannot achieve the desired behavior with Transform.scale
widget. Unfortunately, this widget does not change its size to match the dimensions of the scaled child but will always keep the width and height of the original, unscaled child.
I found another widget, FittedBox
, with which I got the desired behavior. When using FittedBox
, you do not define a scaling factor as you would do with Transform.scale
. You rather put FittedBox
inside a SizedBox
and define its width or height or both. The child of FittedBox
is then scaled to match the parent SizedBox
.
https://api.flutter.dev/flutter/widgets/FittedBox-class.html
_buildWidgetA(width, height) {
return SizedBox(
width: width,
height: height,
child: FittedBox(
child: A(),
),
);
}