You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter中如何将动态字符串的指定部分设置为粗体?

解决Flutter simple_text包无法正确渲染粗体的问题

嘿,我看你用simple_text包的时候遇到了粗体渲染的问题——CHUNKY BUTT的星号没被解析成粗体,反而直接显示出来了对吧?结合你提供的代码和截图,我给你两个靠谱的解决办法:

办法一:换用更适配Markdown的flutter_markdown包

这个包是Flutter生态里专门处理Markdown文本的,对标准Markdown语法支持很完善,能直接识别*包裹的粗体内容。步骤如下:

  1. 先在pubspec.yaml里添加依赖:
    dependencies:
      flutter_markdown: ^0.6.17+1 # 可以替换为最新版本
    
  2. 替换原有的SimpleRichText为MarkdownBody组件,代码示例:
    MarkdownBody(
      data: "THE ONLY MARATHON YOU'VE EVER DONE IS A MOVIE MARATHON. GET OFF THE COUCH *CHUNKY BUTT* AND DO SOME CARDIO.",
      textAlign: TextAlign.center,
      styleSheet: MarkdownStyleSheet(
        p: const TextStyle(
          fontSize: 35.0,
          fontFamily: 'SFPRO',
          color: Colors.white,
          letterSpacing: 1,
          fontWeight: FontWeight.w100,
        ),
        strong: const TextStyle(
          fontWeight: FontWeight.bold, // 指定粗体样式
        ),
      ),
    )
    
    这样就能完美把*包裹的内容渲染成粗体了。

办法二:保留simple_text包,自定义解析规则

如果你不想换包,可以给simple_text添加自定义匹配规则,让它识别星号包裹的文本。代码示例:

SimpleRichText(
  "THE ONLY MARATHON YOU'VE EVER DONE IS A MOVIE MARATHON. GET OFF THE COUCH *CHUNKY BUTT* AND DO SOME CARDIO.",
  textAlign: TextAlign.center,
  style: const TextStyle(
    fontSize: 35.0,
    fontFamily: 'SFPRO',
    color: Colors.white,
    letterSpacing: 1,
    fontWeight: FontWeight.w100,
  ),
  matchers: [
    Matcher(
      pattern: r'\*(.*?)\*', // 正则匹配*包裹的内容
      styleBuilder: (match) => const TextStyle(
        fontWeight: FontWeight.bold,
      ),
    ),
  ],
)

问题的根源其实是simple_text默认没有内置Markdown粗体的解析规则,所以直接把星号当成普通文本显示了,手动添加Matcher就能解决这个问题。

内容的提问来源于stack exchange,提问作者Kafiul Islam

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.04 17:15:49