如何获得文本的交错网格视图

Question

我正在从在线 api 中提取书籍，但是此 api 将其作为句子列表返回。 我想在容器中显示这些句子，让它看起来像一个普通的段落，但每个句子都是可点击的。

预期结果： 每个都是一个单独的容器，以便可点击

Sentence number one. This is
sentence number two. And
this is sentence number three.
This sentence 4. This is 
sentence number 5

我尝试加入字符串，并将它们全部放在一个 Text 小部件中，这看起来与预期的一样，但失去了对每个句子的控制。 我还尝试将每个句子放在 Text 小部件中，并用 Wrap() 小部件包装它们。

包装小部件结果

Sentence number 1. This is 2.
This is sentence number 3 and
it's long.
This is sentence number 4.
This is 5.
This is sentence number 6 and
its longer than all of them.

它离我们更近了一步，当句子比屏幕宽度长时，它开始看起来更像一个列表视图，我试图找到一种方法将这些文本小部件分成两部分屏幕，而不是默认情况下占用 2 行。我想知道它是否可能，如果可能，如何？

Answer 1

List<TextSpan> reasonList = [];
                  snapshot.data!.forEach((element) {
                    reasonList.add(TextSpan(text: '${element.sentence}'));
                  });
                  return Container(
                    child: RichText(
                      text: TextSpan(
                          children: reasonList,
                          style: TextStyle(
                              color: Colors.black, fontSize: 16)),
                    ),
                  );