Ver 1.0.0 : FontSize(this.size) - strange behavior

[pamir72]

if you make the font larger in your phone settings, font size from FontSize(this.size) looks more larger, the right border is defined incorrectly, word wrap is also incorrect.

But there was no such problem until version 1.0.0 !

[komaromil]

Upgrading to 1.0.0 on Android device Fontsize is not the same than in previous versions - strange size - but it seems good on ios. There is a problem with the right side only - text flows out of the screen - on Android device. (See attached image)
It looks like:

[veresvit]

The text scaling is not in sync with regular font scaling when user has a system Font size different than default.

[tantotea]

v1.0.0 in iPhone follows dynamic text size but the larger text size is much larger than it should be.

[simone40love]

The html is not wrapping if the font size is bigger than the default.

        "body": Style(
          fontSize: FontSize(30.0),
        ),

[acanteror]

Same problem here, text and more html content (with and without customRender) flows out of the screen and the elements size is too much big.
This just occurs with some devices.
For example:
Works wrong in:

• Xiaomi Note 7
• iPhone 11 Pro Max
  Works fine in:
• Xiaomi Note 8
• Nokia
• Xiaomi Note 6
• iPhone 7
• and more
  With Android and iOs emulators works fine.

It looks like

[RomanKapshuk]

Same issue with right border of content on some devices (e.g. Samsung S10 or any else device with textScaleFactor > 1.0). Any updates?

[RomanKapshuk]

As hotfix you can wrap html parser with MediaQuery widget with textScaleFactor: 1.0. Then to achieve resizing according to system's real scale factor just multiply fontSize in all of your custom Styles (in styles map and customRender) by your real scale factor. In this case you need to save your real scale factor with context that does not belong to your custom MediaQuery widget tree in some global/static variable.

See the example

...
build: (context) {
GlobalDataStorage.realDeviceScaleFactor = MediaQuery.of(context).textScaleFactor;
return MediaQuery(
data: MediaQueryData(textScaleFactor: 1.0, [other values should be provided from your real MediaQuery])
child: YourWidgetWithHtmlParserInside(),
)}

class YourWidgetWithHtmlParserInside ... {
...
build: (context){
return Html(
styles: {
'*':  Style(fontSize: yourFontSize * GlobalDataStorage.realDeviceScaleFactor);
});}
}`

[VietTho1989]

hotfix: set textScaleFactor entire application in main.dart
return MaterialApp(
builder: (context, child) {
return MediaQuery(
child: child,
data: data.copyWith(
textScaleFactor: 1.0
),
);
},
);

[RomanKapshuk]

@VietTho1989 Yes, you can do like this. But if you want support of accessibilities features what iOS or Android provides (like large font size for people with poor eyesight) – it's not a good idea. Up to you.

[edwardaux]

stumbled across this issue and realise that I created what is essentially a duplicate in #308. The good news is that I think I have a fix and will push up a PR soon.

[DFelten]

@edwardaux Did you find a solution for this? I'm looking forward to your PR :)

[edwardaux]

Yep: #333 has been merged into master which gets us part-way there.

However, the maintainers of this project will need to cut a new release that contains that fix (unless you want to pull in via a commit id).

Probably more importantly, though, it depends on a Flutter bug being fixed which I raised in flutter/flutter#59316. There are two PRs for that flutter/flutter#59711 and flutter/flutter#60021, but I'm not sure what timeframe or flutter release they're going to eventually be released in.

[erickok]

This was eventually fixed and released via #333.