时间戳

首页 > 解决方案 > Flutter 在文本小部件中使用带有 \u00ad 的连字符，并且只有在应用时才用软连字符 (-) 替换

flutter - Flutter 在文本小部件中使用带有 \u00ad 的连字符，并且只有在应用时才用软连字符 (-) 替换

问题描述

有没有办法在文本小部件中使用 \u00ad 进行断字，并且只有在应用断字的情况下，它才应该替换断词上的软连字符 (-)？

例如：

Hyphen\u00adation text

如果文本没有中断，应该看起来像

Hyphenation text

或者如果文本用 (-) 符号分成两行，则像这样

Hyphen-
ation text

标签： flutterflutter-layout

解决方案

我只是为此目的编写了这个 StatelessWidget：

import 'dart:ui' as ui;

import 'package:flutter/material.dart';

class TextWithHyphenation extends StatelessWidget {
  const TextWithHyphenation(
    this.data, {
    Key? key,
    this.style,
  }) : super(key: key);

  final String data;
  final TextStyle? style;

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, size) {
      final String text = data;
      final span = TextSpan(text: text, style: style);
      final textPainter = TextPainter(
          text: span, maxLines: 2, textDirection: ui.TextDirection.ltr)
        ..layout(maxWidth: size.maxWidth);

      final TextSelection selection =
          TextSelection(baseOffset: 0, extentOffset: text.length);
      final List<TextBox> boxes = textPainter.getBoxesForSelection(selection);
      final int lines = boxes.length;
      if (lines > 1) {
        // The text has more than a line
        return Text(text.replaceFirst('\u00ad', '\u00ad-'), style: style);
      } else {
        return Text(text, style: style);
      }
    });
  }
}

请注意，这只适用于\u00ad字符串资源中的一个字符。

推荐阅读