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

Flutter项目中如何规范化含特殊字符的桌游名称以正常显示?

解决Flutter中带HTML标签/特殊字符的桌游名称显示异常问题

你的问题核心不是单纯的Unicode规范化,而是JSON返回的文本里混了HTML标签(比如<strong>),导致直接用Text组件显示时会把标签原样输出。给你两个实用方案:

方案一:提取纯文本(不需要保留格式)

用html包解析HTML内容,提取里面的纯文本:

  1. 在pubspec.yaml里添加依赖:
    dependencies:
      html: ^0.15.4 # 可使用pub.dev上的最新版本
    
  2. 写一个清理文本的工具方法:
    import 'package:html/parser.dart' show parse;
    
    String cleanGameTitle(String rawTitle) {
      final document = parse(rawTitle);
      return document.body?.text ?? rawTitle;
    }
    
    调用这个方法后,Tal der K<strong>ö</strong>nige会变成Tal der Könige,直接用Text组件就能正常显示。

方案二:保留HTML格式(比如加粗)

如果想保留<strong>这类格式,用flutter_html组件替代Text:

  1. 添加依赖:
    dependencies:
      flutter_html: ^3.0.0 # 可使用pub.dev上的最新版本
    
  2. 在ListView的item中使用:
    import 'package:flutter_html/flutter_html.dart';
    
    // ListView.builder的itemBuilder里
    @override
    Widget build(BuildContext context) {
      return ListTile(
        title: Html(data: game.name), // 替换原来的Text(game.name)
      );
    }
    
    这样会正确渲染加粗效果,不会显示标签代码。

补充:结合Unicode规范化

如果你的文本里还有分解形式的特殊字符(比如ö拆成o+分音符),可以在清理完HTML后用unorm_dart做规范化:

import 'package:unorm_dart/unorm_dart.dart';

String normalizeTitle(String rawTitle) {
  final cleanTitle = cleanGameTitle(rawTitle);
  return nfc(cleanTitle); // 合并组合字符为单个Unicode字符
}

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.07.16 04:33:16