Flutter RichText is not showing

user_1085128 0
Viewed 2595

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!'),
      ],
    ),
  ),
));
flutter
2 Answers

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.

user_10851280

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!'),
      ],
    ),
  ),
));
user_12968110
Related