Does Flutter ignore given sizes to use whatever size it wants?

180 views Asked by At

I have built my app onto an iPhone 8.

I have a column of widgets and some of these widgets are instances of SizedBox of a given height. I will tell one SizedBox to have a height of 24. However when it runs the actual height is 48.

Is it a thing that Flutter multiplies every measurement by 2, which in this case is coincidentally the same as the scale factor of the phone? Or does it just multiply all SizedBoxes by 2 regardless of the scale factor and being twice the desired height coincidentally corresponds to the scale factor?

This is the code used to make the SizedBox:

SizedBox(height: 24),

On an iPhone with 2x scale (iPhone 8) then the 24 becomes 48. On a phone with 3x scale (iPhone 13 Pro Max) then the 24 becomes 72.

How it's used is like this:

return Flexible(
      child: Center(
        child: LayoutBuilder(
          builder: (context, constraints) => Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Image.asset(StringAsset.logo),
              SizedBox(height: 40),
              Text(
                AppLocalizations.of(context)!.welcomeTitle,
                style: textTheme.h3.copyWith(
                  color: colorScheme.darkBluePrimary,
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 24),
              SizedBox(
                width: (constraints.maxWidth - 96),
                child:
                Text(
                  AppLocalizations.of(context)!.welcomeDetails,
                  style: textTheme.bodyRegular.copyWith(
                    color: colorScheme.darkBluePrimary,
                  ),
                  textAlign: TextAlign.center,
                ),
              ),
            ],
          ),
        ),
      ),
    );
1

There are 1 answers

3
petras J On

Can you give us some code example? And what are the results on both Android phones and smaller/larger iPhone phones?

Although according to official apple documentation https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/image-size-and-resolution/ scale factor exists and does multiply by x2 or x3 even with high pixel density phones, that should not affect your overall UI layout.