Flutter中从Firestore读取数据时如何保留文本换行格式

我在Flutter应用中从Firebase Firestore读取并展示数据，但文本格式无法保留——比如文本间的空行在展示时会被删除。我希望在应用展示时仅保留这些空行。
我手动将数据录入Firestore，以下是应用中的相关代码：

模型文件 #

class Post {
  final String title;
  final String image;
  final String des;

  const Post({
    required this.title,
    required this.image,
    required this.des,
  });

  Post.fromJson(Map<String, Object?> json)
      : this(
          title: json['title']! as String,
          image: json['image']! as String,
          des: json['des']! as String,
        );
  Map<String, Object?> toJson() => {
        'title': title,
        'image': image,
        'des': des,
      };
}

数据查询与展示文件（通过ListView.Builder展示数据） #

final queryPost =
    FirebaseFirestore.instance.collection('thedata').withConverter<Post>(
          fromFirestore: (snapshot, _) => Post.fromJson(snapshot.data()!),
          toFirestore: (user, _) => user.toJson(),
        );

1. 确认Firestore中的换行符 #

先检查Firestore中存储的des字段是否包含换行符（\n）：在Firestore控制台打开对应文档，查看JSON结构，确认手动输入的回车已被保存为\n。

2. 拆分文本实现空行保留 #

Flutter的Text组件默认会合并连续的换行和空格，因此我们可以将文本按换行符拆分，用Column包裹多个Text组件，每个段落（包括空行）单独渲染：

在ListView.Builder的itemBuilder中，替换原来展示post.des的代码：

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: LineSplitter.split(post.des)
      .map((line) => Padding(
            padding: const EdgeInsets.symmetric(vertical: 3.0), // 可选：调整行间距
            child: Text(line),
          ))
      .toList(),
)

原理 #

LineSplitter.split()会把字符串按\n分割成列表，空行对应列表中的空字符串，对应的Text组件会保留一行空白，从而实现空行的展示。

如果需要更紧凑的排版，可以去掉Padding，或者通过TextStyle(height: 1.2)调整行高。

内容的提问来源于stack exchange，提问作者ItsSaed