How to resize all the text and images inside a card widget according to the size of the parent card?

Question

I have a card widget that looks like this:

I want to resize the text and images according to the size of the card

I tried to use layout builder to use the width from constraint but the max width would always be infinite. I also tried to use screensize, but I want the children's size to depend on parents width instead of screen width.

LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
      double parentWidth = constraints.maxWidth;
      double imageWidth = (parentWidth * 0.3)
          .clamp(24.0, 32.0); // e.g., 30% of the parent's width
      double fontSize = (parentWidth * 0.05).clamp(12.0, 24.0);
      
      return Row(
        children: [
          Container(
            padding: const EdgeInsets.all(4.0),
            decoration: ShapeDecoration(
              color: const Color(0xFF26364C),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(2.42),
              ),
            ),
            child: CachedNetworkImage(
              imageUrl: teamLogoUrl,
              fit: BoxFit.scaleDown,
              height: imageWidth,
              width: imageWidth,
            ),
          ),
          spaceX(extra: 8.0),
          Text(
            teamName,
            textAlign: TextAlign.right,
            style: TextStyle(
              color: const Color(0xFFFEFEFE),
              fontSize: fontSize,
              fontFamily: 'Inter',
              fontWeight: FontWeight.w700,
              height: 0,
            ),
          )
        ],
      );
    })

Answer 1

you can use FittedBox and set it's fit parameter to BoxFit.scaleDown it will take whatever widget inside it and scale it down to fit the parent for example:

Container(
  height: //parent height,
  width:  //parent width,
  child: const FittedBox(
    fit: BoxFit.scaleDown,
    child: ReallyBigWidget(),
  ),
);

more on FittedBox : https://api.flutter.dev/flutter/widgets/FittedBox-class.html