mako
mako

Reputation: 1323

Flutter RichText is not showing

I have a regular normal rich text widget in a Centered per https://api.flutter.dev/flutter/widgets/RichText-class.html within a Scaffold. I can't see it. I can't see anything. The debug tools show that the Rich Text is indeed there in the widget heirarchy (though I can't see the TextSpans within it, presumably they're in there.)

Scaffold(body: Center(child:
  RichText(
    text: TextSpan(
      text: 'Hello ',
      style: DefaultTextStyle.of(context).style,
      children: <TextSpan>[
        TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
        TextSpan(text: ' world!'),
      ],
    ),
  ),
));

Upvotes: 6

Views: 6174

Answers (2)

Knoxy
Knoxy

Reputation: 157

RichText is a basic, lower-level approach to rendering text and intentionally does not use theme styles.

However, Text.rich does:

Scaffold(body: Center(
  child: Text.rich(
    TextSpan(
      text: 'Hello ',
      children: <TextSpan>[
        TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
        TextSpan(text: ' world!'),
      ],
    ),
  ),
));

Upvotes: 9

mako
mako

Reputation: 1323

I tried an android build to see whether this was a bug specific to linux desktop builds. It wasn't! It's happening here too. However, the contrast ratio of my phone is high enough that I can just barely see the text in there, White on Off White. It turns out that, unlike the Text widget, the default color for RichText text is white, same as the theme's background, so the text wont be visible.

(Is it possible the app is responding to the system-wide dark mode theme? Nope. Switching theme doesn't affect anything.)

So, WHY is this the default color? Because DefaultTextStyle is bad and wrong I guess? Use Theme.of(context).textTheme.bodyText1 and you will get the results you expect.

Upvotes: 10

Related Questions