如何使用 Wrap 小部件仅显示特定数量的行？答案

【问题标题】：How show only a specific number of lines with the Wrap widget?如何使用 Wrap 小部件仅显示特定数量的行？
【发布时间】：2021-06-09 08:23:00
【问题描述】：

我有一个 Wrap 小部件，它最多显示 10 个标签（筹码），默认方向（从左到右和从上到下）。我只需要显示此 Wrap 小部件的 3 行，但有时 10 个项目需要 4 行，我将 Wrap 放在 SizedBox 内，并尝试根据内容的大小配置尽可能匹配 Box 的高度的包装。但它并不完美，它在某些屏幕上显示得很好，但在另一些屏幕上却不是太短就是太大（剪掉第三行，或者剪掉第四行，如果有的话）。

是否有一个小部件可以让我动态调整 Wrap 的大小以始终只显示 3 行，独立于屏幕和字体大小？

谢谢

【问题讨论】：

标签： flutter

【解决方案1】：

您可以使用richText 小部件并将其maxLines 设为3。

maxLines → int?文本的可选最大行数跨度，包装（如有必要）。如果文本超过给定数量行，它将根据溢出截断。 [...] 最终

RichText(
  maxLines: 3,
  text: TextSpan(
    text: 'Hello ',
    style: DefaultTextStyle.of(context).style,
    children: const <TextSpan>[
      TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
      TextSpan(text: ' world!'),
    ],
  ),
)

然后您可以在子项中添加标签。

https://api.flutter.dev/flutter/widgets/RichText-class.html

【讨论】：