查找文本的确切范围

Question

我需要知道一段文本的确切范围-等同于Android 的getTextBounds。我意识到这有点与Flutter的设计背道而驰，但是我以非传统方式使用文本（例如，将文本以精确的位置和大小嵌入艺术图片中）。

我尝试了三种方法：

• TextPainter的minIntrinsicWidth和height。资料来源如下。这将产生一个边界框，该边界框的所有侧面都留有空间：

  

  我需要该矩形的边紧靠“ 8”的黑色像素。（在该特定情况下，width并maxIntrinsicWidth得到相同的值minIntrinsicWidth;而且，preferredLineHeight给出了相同的值height。）

• Paragraph的getBoxesForRange结果-与TextPainter基本上相同。

• FittedBox-不管BoxFit枚举值如何，都会留下空格。我以这个答案为起点。

TextPainter代码如下。（我意识到这是低效率的；在获得所需的边界框之前，我不在乎。我使用Scene / Picture / etc是为了希望在较低级别找到合适的功能。）

import 'dart:ui';
import 'dart:typed_data';
import 'package:flutter/painting.dart';

const black = Color(0xff000000);
const white = Color(0xffffffff);

final identityTransform = new Float64List(16)
  ..[0] = 1.0
  ..[5] = 1.0
  ..[10] = 1.0
  ..[15] = 1.0;

TextPainter createTextPainter() {
  return new TextPainter(
    text: new TextSpan(
      text: '8',
      style: new TextStyle(
        color: black,
        fontSize: 200.0,
        fontFamily: "Roboto",
      ),
    ),
    textDirection: TextDirection.ltr,
  )..layout();
}

void drawBackground(Canvas canvas, Rect screen) {
  canvas.drawRect(
      screen,
      new Paint()
        ..color = white
        ..style = PaintingStyle.fill);
}

Picture createPicture() {
  final recorder = new PictureRecorder();
  final screen = Offset.zero & window.physicalSize;
  final canvas = new Canvas(recorder, screen);
  final offset = screen.center;
  final painter = createTextPainter();
  final bounds = offset & Size(painter.minIntrinsicWidth, painter.height);
  drawBackground(canvas, screen);
  painter.paint(canvas, offset);
  canvas.drawRect(
      bounds,
      new Paint()
        ..color = black
        ..style = PaintingStyle.stroke
        ..strokeWidth = 3.0);
  return recorder.endRecording();
}

Scene createScene() {
  final builder = new SceneBuilder()
    ..pushTransform(identityTransform)
    ..addPicture(Offset.zero, createPicture())
    ..pop();
  return builder.build();
}

void beginFrame(Duration timeStamp) {
  window.render(createScene());
}

void main() {
  window.onBeginFrame = beginFrame;
  window.scheduleFrame();
}

Answer 1

您可以使用 TextPainter 类来确定某些文本的宽度。 https://api.flutter.dev/flutter/painting/TextPainter-class.html Flutter 在布局期间使用它来确定文本小部件的大小。

不确定 TextPainter 的结果是否包含少量填充，但如果包含，已经提出的解决方案也可能会包含少量填充。