Question

如何获取文本行数在Flutter项目中，我们需要确定文本行数是否超过3，然后将显示提示消息。我们如何使用代码来实现它？

Answer 1

如果您只想检查文本包含多少个换行符，则可以执行简单的操作

final numLines = '\n'.allMatches(yourText).length + 1;

但是，我想您对视觉上实际显示的行数更感兴趣。在这里，事情变得有些复杂，因为您需要知道可用空间（BoxConstraints）才能计算文本需要多少行。为此，您可以使用LayoutBuilder来延迟小部件的构建，并使用TextPainter来进行实际的计算：

return LayoutBuilder(builder: (context, size) {
  final span = TextSpan(text: yourText, style: yourStyle);
  final tp = TextPainter(text: span, maxLines: 3);
  tp.layout(maxWidth: size.maxWidth);

  if (tp.didExceedMaxLines) {
    // The text has more than three lines.
    // TODO: display the prompt message
    return Container(color: Colors.red);
  } else {
    return Text(yourText, style: yourStyle);
  }
});

我从auto_size_text pub package中提取了一些代码，这也许对您也很有趣：它会调整其文字大小，使其适合给定的空间。

无论如何，显示提示时要小心：窗口小部件的build方法每秒可能被调用几次，导致同时显示多个提示。

Answer 2

现在很容易找到段落中的行数：

List<ui.LineMetrics> lines = textPainter.computeLineMetrics();
int numberOfLines = lines.length;

注释

computeLineMetrics必须在布局后调用。
此更改是Flutter存储库中最新的主分支的最新更改。我不知道进入稳定频道需要多长时间。
出于历史目的，我保留了另一个答案，因为我需要在解释更改时链接到它。

Answer 3

如果您有一个TextPainter对象并且已经调用了layout，则可以通过选择所有内容并调用getBoxesForSelection来获得行数。每个框都是行的大小。

TextSelection selection = TextSelection(baseOffset: 0, extentOffset: text.length);
List<TextBox> boxes = textPainter.getBoxesForSelection(selection);
int numberOfLines = boxes.length;

这里是一个例子：

final text = 'My text line.\nThis line wraps to the next.\nAnother line.';

print(numberOfLines); // 4

不幸的是，如果混合了双向文本，此操作将失败：

final text = 'My text line.\nThis كلمة makes more boxes.\nAnother line.';

print(numberOfLines); // 6

可以通过仅计算沿一条边的盒子来克服。如果您从上方注意到数据，则只有四个框的边为0.0。

flutter: TextBox.fromLTRBD(0.0, 0.2, 171.8, 36.0, TextDirection.ltr)
flutter: TextBox.fromLTRBD(0.0, 36.5, 68.4, 72.3, TextDirection.ltr)
flutter: TextBox.fromLTRBD(68.4, 38.2, 111.5, 75.0, TextDirection.rtl)
flutter: TextBox.fromLTRBD(111.5, 36.5, 299.9, 72.3, TextDirection.ltr)
flutter: TextBox.fromLTRBD(0.0, 77.2, 92.2, 113.0, TextDirection.ltr)
flutter: TextBox.fromLTRBD(0.0, 113.2, 179.7, 149.0, TextDirection.ltr)

我希望有一个TextPainter.numberOfLines方法，但我没有找到它。

更新：

有一个proposal添加此功能。

Answer 4

我刚刚得到了这段代码的支持，因此这是我验证它是否越过 maxlines 的方式

var text="Clita takimata dolor diam magna aliquyam et sed dolores sadipscing. Sed ut 
diam rebum labore sadipscing sit amet, diam labore.";
final span=TextSpan(text:text);
final tp =TextPainter(text:span,maxLines: 3,textDirection: TextDirection.ltr);
tp.layout(maxWidth: MediaQuery.of(context).size.width); // equals the parent screen width
print(tp.didExceedMaxLines);
//false for maxlines 3
//true for maxlines 1

Flutter：如何获取文本行数

4 个答案:

更新：