Flutter RichText不显示

Question

我在一个居中的Scaffold中有一个普通的富文本(Rich Text)小部件，可以参考https://api.flutter.dev/flutter/widgets/RichText-class.html。然而我无法看到它，什么都看不到。调试工具显示富文本确实在小部件层次结构中存在（尽管我无法看到其中的TextSpans，可能它们在其中）。

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

- mako

---

你的问题对任何人来说都不清楚。请添加你已经完成的代码。 - Pratik Butani

我说过，这是像我提供的链接中的代码一样的（在一个居中的脚手架内），但好吧。 - mako

Answer 1

我尝试构建安卓版本以判断这是否是Linux桌面版的特定bug。然而，并非如此！这个问题也发生在安卓上。不过，我的手机对比度足够高，我勉强能看到那里的文字，白字呈现在浅白色背景上。原来，与文本小部件不同，富文本的默认文本颜色是白色，即和主题的背景相同，因此文本不会显示出来。

（难道应用程序响应了系统范围内的暗黑模式主题吗？不是。切换主题不会影响任何内容。）

那么，为什么这是默认颜色呢？因为DefaultTextStyle有问题吗？使用Theme.of(context).textTheme.bodyText1，你将得到你所期望的结果。

- mako

---

如果我想修复RichText中的所有TextSpans怎么办？ - genericUser

我相信 style 是继承的，所以如果你正确地设置根 TextSpan 的 style（将其设置为除了 DefaultTextStyle 之外的其他值），它应该可以修复所有子元素。 - mako

更好的解决方案是将RichText(...)替换为Text.rich(...),您可以保留您现有的区段 :) - rjh

Answer 2

RichText 是一种基本的、较低级别的文本呈现方式，故意不使用主题样式。

然而，Text.rich 则使用了主题样式：

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

- Knoxy