Flutter: Difference of size between ios and android

Question

I have an issue with my flutter app.

I use 2 physical devices

Android: A20 Iphone: Iphone 11

I setup fontsize but the font size on the iPhone is not fulfilled.

Please find below: the screens from both devices.

How can I fix this difference?

IPhone 11

Android

Material app

GetMaterialApp(
      title: L.localize('Wetip'),
      debugShowCheckedModeBanner: false,
      navigatorKey: navigatorKey,
      theme: ThemeData(
        primarySwatch:
            PaletteGenerator.generateMaterialColor(MyTheme.PrimaryColor),
        primaryColor: MyTheme.PrimaryColor,
        accentColor: MyTheme.SecondaryColor,
        textTheme: GoogleFonts.ralewayTextTheme(),
        disabledColor: Colors.grey.withOpacity(0.5),
        errorColor: MyTheme.PrimaryColor,
        visualDensity: VisualDensity.adaptivePlatformDensity
      ),
      home: MyApp())

The textformfield

 TextFormField(
      style: TextStyle(
        fontSize: 16,
        color: colorText != null ? colorText : Colors.black,
        decorationColor: Colors.black),

Et mon titleSection

Widget TitleSection(String text, {color = Colors.white, TextStyle? 

style}) { return Text( text, textAlign: TextAlign.center, style: style == null ? TextStyle( color: color, fontSize: Theme.of(navigatorKey.currentContext!) .textTheme .headline4! .fontSize) : style, ); }

Solution

I prefer Sizer Package for auto scaling of fonts

First you have to wrap materialApp with Responsive Sizer widget

ResponsiveSizer(
      builder: (context, orientation, deviceType) {
        return MaterialApp();
      }
 )

Then you can use font size like below

    Text(
      'Sizer',style: TextStyle(fontSize: 15.sp),
    );

Comments

[Dinesh Nagarajan]

can you check the iOS device's default text size?

[dalton5]

Ok I have been able to fix this by changing text size in settings. But it's not a solution. How can I ensure I will have the same text size between ios and and android? And I would say it's more a scaling than a font size

[Dinesh Nagarajan]

Can you add some code of how you set text and its property for the attached screenshot?

[dalton5]

I added some code

[dalton5]

Ok thanks. Is it a normal behaviour? Or I missed something in my development? I mean if I put textscalefactor to 1 if the user increase the text size it will not be changed. So the final solution should be to multiply my font sizes by the text factor?

[epynic]

Yes, that's how accessibility/pixel density settings works across device AFAIK flutter.dev/docs/development/accessibility-and-localization/‌​…

[dalton5]

But I don't get it. the picture I show in my first message is the default scaling provided in the iPhone. There is no special accessibility settings setup.

[epynic]

just a guess, your A20 had less pixel ratio compared to your iphone 11, can you check visiting different website/apps on both the phones and check

[dalton5]

The A20 has 268 pixels per inch and the iphone 11 has 458 PPI. It's a big difference. Then how can I setup my project to have the same scale?

[epynic]

using textScaleFactor doesn't help ? something like scaleFactor = MediaQuery.of(context).textScaleFactor;... and in fontSize: 14 / scaleFactor ?