Flutter 初识：文本控件

最新推荐文章于 2024-07-29 17:55:21 发布

数星星的磊

最新推荐文章于 2024-07-29 17:55:21 发布

阅读量1k

点赞数 17

分类专栏： Flutter 初识文章标签： flutter javascript 前端

本文链接：https://blog.csdn.net/yang_6799/article/details/139371523

版权

Flutter 初识专栏收录该内容

16 篇文章 0 订阅

订阅专栏

在Flutter中，有多种控件可用于显示文本。本文对这些控件进行了整理，并提供了一些简单的使用示例。

Text

这是Flutter中最基本和最常用的文本显示控件。它适用于显示简单、静态的文本。

属性解析：

const Text(
    String this.data, {
    super.key,
    this.style,
    this.strutStyle,
    this.textAlign,
    this.textDirection,
    this.locale,
    this.softWrap,
    this.overflow,
    @Deprecated(
      'Use textScaler instead. '
      'Use of textScaleFactor was deprecated in preparation for the upcoming nonlinear text scaling support. '
      'This feature was deprecated after v3.12.0-2.0.pre.',
    )
    this.textScaleFactor,
    this.textScaler,
    this.maxLines,
    this.semanticsLabel,
    this.textWidthBasis,
    this.textHeightBehavior,
    this.selectionColor,
  })

data(String)：显示的文本内容
key：控制框架如何使用该小部件的唯一标志符。通常用于在构建过程中保持状态。很少用于简单的文本显示，但在复杂的应用中非常有用。
stype：文本样式。它是一个TextStyle类型，可以设置字体、颜色、粗细等属性。
strutStyle: 用于定义段落内文本的布局策略，类型为 StrutStyle。它可以影响行高和首尾对齐等。
textAlign: 文本对齐方式，类型为 TextAlign，例如 TextAlign.left, TextAlign.center, TextAlign.right 等。
textDirection: 文本方向，类型为 TextDirection，例如 TextDirection.ltr（从左到右）和 TextDirection.rtl（从右到左）。
locale: 用于指定语言环境，类型为 Locale。在国际化应用中常用。
softWrap: 一个布尔值，用于指示文本是否在软换行处换行。如果为 false，文本将不会换行并可能溢出。
overflow: 文本溢出时的处理方式，类型为 TextOverflow，例如 TextOverflow.clip, TextOverflow.ellipsis 等。
textScaleFactor: 已弃用。用于控制文本缩放因子，但建议使用 textScaler 替代它。
textScaler: 用于替代 textScaleFactor 的新属性，未来版本将支持非线性文本缩放。
maxLines: 设置显示文本的最大行数。如果超过这个数字，超出的部分会被截断或隐藏。
semanticsLabel: 语义标签，用于屏幕阅读器，以帮助有视力障碍的用户理解文本内容。
textWidthBasis: 控制文本宽度计算的基准，类型为 TextWidthBasis，例如 TextWidthBasis.parent 和 TextWidthBasis.longestLine。
textHeightBehavior: 控制文本高度相关的行为，类型为 TextHeightBehavior，可以用来调整行间距等。
selectionColor: 文本选中的背景颜色。

示例：

class TextPage extends StatelessWidget {
  const TextPage({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Text Widget Example')),
        body: Center(
          child: Text(
            'Hello, Flutter!',
            key: Key('exampleText'),
            style: TextStyle(
              fontSize: 24,
              fontWeight: FontWeight.bold,
              color: Colors.blue,
              letterSpacing: 2.0,
            ),
            strutStyle: StrutStyle(
              fontSize: 24,
              height: 1.5,
            ),
            textAlign: TextAlign.center,
            textDirection: TextDirection.ltr,
            locale: Locale('en', 'US'),
            softWrap: true,
            overflow: TextOverflow.ellipsis,
            textScaleFactor:
                1.2, // Note: It's deprecated, use textScaler in future versions
            maxLines: 2,
            semanticsLabel: 'Greeting text for accessibility',
            textWidthBasis: TextWidthBasis.longestLine,
            textHeightBehavior: TextHeightBehavior(
              applyHeightToFirstAscent: false,
              applyHeightToLastDescent: true,
            ),
            selectionColor: Colors.yellow,
          ),
        ),
      ),
    );
  }
}

在这里插入图片描述

RichText

用于显示带有丰富样式的文本，可以在同一段文本中应用不同的样式。通常与TextSpan一起使用。

属性解析：

RichText({
    super.key,
    required this.text,
    this.textAlign = TextAlign.start,
    this.textDirection,
    this.softWrap = true,
    this.overflow = TextOverflow.clip,
    @Deprecated(
      'Use textScaler instead. '
      'Use of textScaleFactor was deprecated in preparation for the upcoming nonlinear text scaling support. '
      'This feature was deprecated after v3.12.0-2.0.pre.',
    )
    double textScaleFactor = 1.0,
    TextScaler textScaler = TextScaler.noScaling,
    this.maxLines,
    this.locale,
    this.strutStyle,
    this.textWidthBasis = TextWidthBasis.parent,
    this.textHeightBehavior,
    this.selectionRegistrar,
    this.selectionColor,
  })

text: 使用 TextSpan 和 children 来定义不同样式的文本片段。
- 第一个 TextSpan: 普通文本 "Hello, "，字体大小为 24，颜色为黑色。
- 第二个 TextSpan: 加粗的蓝色文本 “Flutter”。
- 第三个 TextSpan: 普通文本 "! Welcome to the world of "。
- 第四个 TextSpan: 斜体红色文本 “RichText.”。
textAlign: TextAlign.center - 文本居中对齐。
textDirection: TextDirection.ltr - 文本从左到右显示。
softWrap: true - 启用软换行。
overflow: TextOverflow.ellipsis - 如果文本溢出，将其截断并显示省略号。
textScaleFactor: 1.2 - （已弃用）设置文本缩放因子为 1.2。
maxLines: 2 - 最多显示两行文本。
locale: Locale(‘en’, ‘US’) - 设置语言环境为美式英语。
strutStyle: 定义段落内文本的布局策略，设置行高为 1.5。
textWidthBasis: TextWidthBasis.longestLine - 根据最长行计算文本宽度。
textHeightBehavior:
- applyHeightToFirstAscent: false - 不应用高度到第一上升线。
- applyHeightToLastDescent: true - 应用高度到最后下降线。
selectionColor: Colors.yellow - 设置选中文本的背景颜色为黄色。

通过这些配置，你可以用 RichText 创建复杂的、多样式的文本显示，以满足更高级的需求。

示例：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('RichText Example')),
        body: Center(
          child: RichText(
            text: TextSpan(
              text: 'Hello, ', // 第一个部分
              style: TextStyle(color: Colors.black, fontSize: 24),
              children: <TextSpan>[
                TextSpan(
                  text: 'Flutter', // 第二个部分
                  style: TextStyle(
                    color: Colors.blue,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                TextSpan(
                  text: '! Welcome to the world of ',
                ),
                TextSpan(
                  text: 'RichText.',
                  style: TextStyle(
                    color: Colors.red,
                    fontStyle: FontStyle.italic,
                  ),
                ),
              ],
            ),
            textAlign: TextAlign.center,
            textDirection: TextDirection.ltr,
            softWrap: true,
            overflow: TextOverflow.ellipsis,
            textScaleFactor: 1.2, // Note: It's deprecated, use textScaler in future versions
            maxLines: 2,
            locale: Locale('en', 'US'),
            strutStyle: StrutStyle(
              fontSize: 24,
              height: 1.5,
            ),
            textWidthBasis: TextWidthBasis.longestLine,
            textHeightBehavior: TextHeightBehavior(
              applyHeightToFirstAscent: false,
              applyHeightToLastDescent: true,
            ),
            selectionColor: Colors.yellow,
          ),
        ),
      ),
    );
  }
}

在这里插入图片描述

SelectableText

允许用户选择和复制文本，但无法编辑。适用于需要使文本可选择而不希望文本被修改的场景。

属性解析：

const SelectableText(
    String this.data, {
    super.key,
    this.focusNode,
    this.style,
    this.strutStyle,
    this.textAlign,
    this.textDirection,
    @Deprecated(
      'Use textScaler instead. '
      'Use of textScaleFactor was deprecated in preparation for the upcoming nonlinear text scaling support. '
      'This feature was deprecated after v3.12.0-2.0.pre.',
    )
    this.textScaleFactor,
    this.textScaler,
    this.showCursor = false,
    this.autofocus = false,
    @Deprecated(
      'Use `contextMenuBuilder` instead. '
      'This feature was deprecated after v3.3.0-0.5.pre.',
    )
    this.toolbarOptions,
    this.minLines,
    this.maxLines,
    this.cursorWidth = 2.0,
    this.cursorHeight,
    this.cursorRadius,
    this.cursorColor,
    this.selectionHeightStyle = ui.BoxHeightStyle.tight,
    this.selectionWidthStyle = ui.BoxWidthStyle.tight,
    this.dragStartBehavior = DragStartBehavior.start,
    this.enableInteractiveSelection = true,
    this.selectionControls,
    this.onTap,
    this.scrollPhysics,
    this.semanticsLabel,
    this.textHeightBehavior,
    this.textWidthBasis,
    this.onSelectionChanged,
    this.contextMenuBuilder = _defaultContextMenuBuilder,
    this.magnifierConfiguration,
  })

data (String): 必需参数，要显示的文本内容。
key: 唯一标识符，用于在构建过程中保留状态。
focusNode (FocusNode?): 用于控制焦点的节点，可以监听和控制焦点状态。
style (TextStyle?): 文本的样式，包括颜色、字体大小、字体粗细等。
strutStyle (StrutStyle?): 定义段落内文本的布局策略，可以影响行高和首尾对齐等。
textAlign (TextAlign?): 文本对齐方式，例如 TextAlign.left, TextAlign.center, TextAlign.right 等。
textDirection (TextDirection?): 文本方向，指定为从左到右(TextDirection.ltr)或从右到左(TextDirection.rtl)。
textScaleFactor (double?): 已弃用。用于控制文本缩放因子，建议使用 textScaler 替代它。
textScaler (TextScaler?): 用于替代 textScaleFactor 的新属性，未来版本将支持非线性文本缩放。
showCursor (bool): 是否显示光标，默认值为 false。
autofocus (bool): 自动获取焦点，默认值为 false。
toolbarOptions (ToolbarOptions?): 已弃用。控制上下文菜单中的选项。
minLines (int?): 文本最小显示行数。
maxLines (int?): 文本最大显示行数。
cursorWidth (double): 光标宽度，默认值为 2.0。
cursorHeight (double?): 光标高度。
cursorRadius (Radius?): 光标圆角半径。
cursorColor (Color?): 光标颜色。
selectionHeightStyle (ui.BoxHeightStyle): 选择区域的高度样式，默认为 ui.BoxHeightStyle.tight。
selectionWidthStyle (ui.BoxWidthStyle): 选择区域的宽度样式，默认为 ui.BoxWidthStyle.tight。
dragStartBehavior (DragStartBehavior): 拖动开始行为，默认值为 DragStartBehavior.start。
enableInteractiveSelection (bool): 是否启用交互选择，默认值为 true。
selectionControls (TextSelectionControls?): 自定义选择控件。
onTap (GestureTapCallback?): 点击事件回调。
scrollPhysics (ScrollPhysics?): 用于滚动视图的物理效果。
semanticsLabel (String?): 用于屏幕阅读器的语义标签。
textHeightBehavior (TextHeightBehavior?): 控制文本高度相关的行为，可以用来调整行间距等。
textWidthBasis (TextWidthBasis?): 控制文本宽度计算的基准。
onSelectionChanged (SelectionChangedCallback?): 选择更改时的回调。
contextMenuBuilder (ContextMenuBuilder): 用于构建自定义上下文菜单的回调，默认值为 _defaultContextMenuBuilder。
magnifierConfiguration (MagnifierConfiguration?): 配置放大镜效果。

示例：

import 'dart:ui' as ui show BoxHeightStyle, BoxWidthStyle;

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('SelectableText Example')),
        body: Center(
          child: SelectableText(
            'Hello, Flutter! This is a selectable text.',
            style: TextStyle(
              color: Colors.blue,
              fontSize: 24.0,
              fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
            textDirection: TextDirection.ltr,
            textScaleFactor: 1.2, // Note: It's deprecated, use textScaler in future versions
            showCursor: true,
            autofocus: true,
            cursorColor: Colors.red,
            cursorWidth: 3.0,
            cursorRadius: Radius.circular(5.0),
            selectionHeightStyle: ui.BoxHeightStyle.max,
            selectionWidthStyle: ui.BoxWidthStyle.max,
            enableInteractiveSelection: true,
            onTap: () => print("Text tapped!"),
            scrollPhysics: BouncingScrollPhysics(),
            semanticsLabel: 'Selectable greeting text',
            textHeightBehavior: TextHeightBehavior(
              applyHeightToFirstAscent: false,
              applyHeightToLastDescent: true,
            ),
            textWidthBasis: TextWidthBasis.longestLine,
            onSelectionChanged: (TextSelection selection, SelectionChangedCause? cause) {
              print('New selection: ${selection.baseOffset} to ${selection.extentOffset}');
            },
            contextMenuBuilder: (BuildContext context, EditableTextState editableTextState) {
              return AdaptiveTextSelectionToolbar.editableText(
                editableTextState: editableTextState,
              );
            },
          ),
        ),
      ),
    );
  }
}

在这里插入图片描述

CupertinoText

UIKit 风格的文本控件，通常用于构建 iOS 风格的应用。虽然没有单独的 CupertinoText 控件，但是你可以使用 DefaultTextStyle 来设置 Cupertino 风格：

属性解析：

const DefaultTextStyle({
    super.key,
    required this.style,
    this.textAlign,
    this.softWrap = true,
    this.overflow = TextOverflow.clip,
    this.maxLines,
    this.textWidthBasis = TextWidthBasis.parent,
    this.textHeightBehavior,
    required super.child,
  })

key: 唯一标识符，用于在构建过程中保留状态。
style (TextStyle): 必需参数，定义文本的默认样式，包括颜色、字体大小、字体粗细等。
textAlign (TextAlign?): 文本对齐方式，例如 TextAlign.left, TextAlign.center, TextAlign.right 等。
softWrap (bool): 是否启用软换行，默认值为 true。
overflow (TextOverflow): 文本溢出时的处理方式，默认为 TextOverflow.clip。其他选项包括 TextOverflow.ellipsis 和 TextOverflow.fade。
maxLines (int?): 文本显示的最大行数。如果超过这个数字，多余的行会被裁剪或隐藏。
textWidthBasis (TextWidthBasis): 控制文本宽度计算的基准。可选值有 TextWidthBasis.parent 和 TextWidthBasis.longestLine，默认值为 TextWidthBasis.parent。
textHeightBehavior (TextHeightBehavior?): 控制文本高度相关的行为，可以用来调整行间距等。
child (Widget): 必需参数，要应用默认文本样式的子节点。

示例：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('DefaultTextStyle Example')),
        body: Center(
          child: DefaultTextStyle(
            style: TextStyle(
              color: Colors.blue,
              fontSize: 24.0,
              fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
            softWrap: true,
            overflow: TextOverflow.ellipsis,
            maxLines: 2,
            textWidthBasis: TextWidthBasis.parent,
            textHeightBehavior: TextHeightBehavior(
              applyHeightToFirstAscent: false,
              applyHeightToLastDescent: true,
            ),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text('This is the first line of text.'),
                Text('This is the second line of text.'),
                Text(
                  'This text will inherit the default style but override some properties.',
                  style: TextStyle(
                    color: Colors.red,
                    fontSize: 20.0,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

在这里插入图片描述

Text.rich

这是 RichText 的简写形式，它直接使用 Text 构造函数中的 text 参数来创建一个 TextSpan。

属性解释：

const Text.rich(
    InlineSpan this.textSpan, {
    super.key,
    this.style,
    this.strutStyle,
    this.textAlign,
    this.textDirection,
    this.locale,
    this.softWrap,
    this.overflow,
    @Deprecated(
      'Use textScaler instead. '
      'Use of textScaleFactor was deprecated in preparation for the upcoming nonlinear text scaling support. '
      'This feature was deprecated after v3.12.0-2.0.pre.',
    )
    this.textScaleFactor,
    this.textScaler,
    this.maxLines,
    this.semanticsLabel,
    this.textWidthBasis,
    this.textHeightBehavior,
    this.selectionColor,
  })

textSpan: 使用 TextSpan 和 children 来定义不同样式的文本片段。
- 第一个 TextSpan: 普通文本 "Hello, "，字体大小为 24，颜色为黑色。
- 第二个 TextSpan: 加粗的蓝色文本 “Flutter”。
- 第三个 TextSpan: 普通文本 "! Welcome to the world of "。
- 第四个 TextSpan: 斜体红色文本 “Text.rich.”。
style: 设置默认文本样式，如 fontFamily 为 Arial。
textAlign: TextAlign.center - 文本居中对齐。
textDirection: TextDirection.ltr - 文本从左到右显示。
softWrap: true - 启用软换行。
overflow: TextOverflow.ellipsis - 如果文本溢出，将其截断并显示省略号。
textScaleFactor: 1.2 - （已弃用）设置文本缩放因子为 1.2。
maxLines: 2 - 最多显示两行文本。
semanticsLabel: ‘Rich text example’ - 用于屏幕阅读器的语义标签。
textWidthBasis: TextWidthBasis.longestLine - 根据最长行计算文本宽度。
textHeightBehavior:
- applyHeightToFirstAscent: false - 不应用高度到第一上升线。
- applyHeightToLastDescent: true - 应用高度到最后下降线。
selectionColor: Colors.yellow - 设置选中文本的背景颜色为黄色。

通过这些配置，你可以用 Text.rich 创建复杂的、多样式的文本显示，以满足更高级的需求。

示例：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Text.rich Example')),
        body: Center(
          child: Text.rich(
            TextSpan(
              text: 'Hello, ', // 第一个部分
              style: TextStyle(color: Colors.black, fontSize: 24),
              children: <TextSpan>[
                TextSpan(
                  text: 'Flutter', // 第二个部分
                  style: TextStyle(
                    color: Colors.blue,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                TextSpan(
                  text: '! Welcome to the world of ',
                ),
                TextSpan(
                  text: 'Text.rich.',
                  style: TextStyle(
                    color: Colors.red,
                    fontStyle: FontStyle.italic,
                  ),
                ),
              ],
            ),
            style: TextStyle(fontFamily: 'Arial'), // 默认样式
            textAlign: TextAlign.center,
            textDirection: TextDirection.ltr,
            softWrap: true,
            overflow: TextOverflow.ellipsis,
            textScaleFactor: 1.2, // Note: It's deprecated, use textScaler in future versions
            maxLines: 2,
            semanticsLabel: 'Rich text example',
            textWidthBasis: TextWidthBasis.longestLine,
            textHeightBehavior: TextHeightBehavior(
              applyHeightToFirstAscent: false,
              applyHeightToLastDescent: true,
            ),
            selectionColor: Colors.yellow,
          ),
        ),
      ),
    );
  }
}

在这里插入图片描述

总结

简单文本: 使用 Text。
富文本: 使用 RichText 或 Text.rich。
可选择文本: 使用 SelectableText。
iOS 风格文本: 使用 DefaultTextStyle 配合 Cupertino 风格。

如果你只需要显示文本，大多数情况下 Text 已经能够满足需求，而对于更复杂的样式和功能，你可以选择 RichText、SelectableText 等控件。

备注：

1、TextStyle

TextStyle({
    this.inherit = true,
    this.color,
    this.backgroundColor,
    this.fontSize,
    this.fontWeight,
    this.fontStyle,
    this.letterSpacing,
    this.wordSpacing,
    this.textBaseline,
    this.height,
    this.leadingDistribution,
    this.locale,
    this.foreground,
    this.background,
    this.shadows,
    this.fontFeatures,
    this.fontVariations,
    this.decoration,
    this.decorationColor,
    this.decorationStyle,
    this.decorationThickness,
    this.debugLabel,
    String? fontFamily,
    List<String>? fontFamilyFallback,
    String? package,
    this.overflow,
  })

TextStyle 是 Flutter 中用于定义文本样式的类。它包含了许多可配置的参数，可以用来设置文本的外观。以下是每个参数的详细解释：

inherit (bool): 是否继承父级文本样式。默认值为 true。
color (Color?): 文本颜色。例如：Colors.red。
backgroundColor (Color?): 文本背景颜色。例如：Colors.yellow。
fontSize (double?): 字体大小。例如：18.0。
fontWeight (FontWeight?): 字体粗细。例如：FontWeight.bold 或 FontWeight.w500。
fontStyle (FontStyle?): 字体风格，通常为斜体。例如：FontStyle.italic。
letterSpacing (double?): 字母间距。例如：1.5。
wordSpacing (double?): 单词间距。例如：2.0。
textBaseline (TextBaseline?): 用于对齐文本的基线，例如：TextBaseline.alphabetic。
height (double?): 行高，是行间距和字体大小的乘积。例如：1.5。
leadingDistribution (TextLeadingDistribution?): 控制文本顶部和底部空白分布。
locale (Locale?): 指定语言环境。在国际化应用中使用。
foreground (Paint?): 文本前景色，用于更复杂的颜色或渐变效果。
background (Paint?): 文本背景，用于更复杂的颜色或渐变效果。
shadows (List?): 文本阴影效果。可以设置多个阴影。
fontFeatures (List?): 字体特性，例如小型大写字母(small-caps)等。
fontVariations (List?): 字体变体，用于可变字体。
decoration (TextDecoration?): 文本装饰，例如下划线、删除线等。
decorationColor (Color?): 装饰线颜色。
decorationStyle (TextDecorationStyle?): 装饰线样式，例如实线、虚线等。
decorationThickness (double?): 装饰线厚度。
debugLabel (String?): 用于调试的标签，开发过程中用于标识不同的文本样式。
fontFamily (String?): 字体家族名称，例如 ‘Roboto’。
fontFamilyFallback (List?): 字体家族后备列表，当指定的字体不可用时，依次尝试这些字体。
package (String?): 字体所在包的名称，常用于从包中加载字体。
overflow (TextOverflow?): 文本溢出处理方式，例如 TextOverflow.ellipsis。
示例：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('TextStyle Example')),
        body: Center(
          child: Text(
            'Hello, Flutter!',
            style: TextStyle(
              inherit: true,
              color: Colors.blue,
              backgroundColor: Colors.yellow,
              fontSize: 24.0,
              fontWeight: FontWeight.bold,
              fontStyle: FontStyle.italic,
              letterSpacing: 2.0,
              wordSpacing: 4.0,
              textBaseline: TextBaseline.alphabetic,
              height: 1.5,
              shadows: [
                Shadow(
                  offset: Offset(2.0, 2.0),
                  blurRadius: 3.0,
                  color: Color.fromARGB(255, 0, 0, 0),
                ),
              ],
              decoration: TextDecoration.underline,
              decorationColor: Colors.red,
              decorationStyle: TextDecorationStyle.dashed,
              decorationThickness: 2.0,
              fontFamily: 'Roboto',
              fontFamilyFallback: ['NotoSans', 'Arial'],
              overflow: TextOverflow.ellipsis,
            ),
          ),
        ),
      ),
    );
  }
}

2、Marquee(第三方库)

用于实现跑马灯效果的文本
marquee：https://pub.dev/packages/marquee

3、AutoSizeText(第三方库)

AutoSizeText 是一个可以自动调整字体大小以适应容器大小的文本小部件。
auto_size_text：https://pub.dev/packages/auto_size_text

4、Markdown (第三方库)

用于解析和显示 Markdown 格式文本的小部件。
flutter_markdown：https://pub.dev/packages/flutter_markdown

数星星的磊

关注

17
点赞
踩
15

收藏

觉得还不错? 一键收藏
0
评论
Flutter 初识：文本控件

简单文本: 使用 Text。富文本: 使用 RichText 或 Text.rich。可选择文本: 使用 SelectableText。iOS 风格文本: 使用 DefaultTextStyle 配合 Cupertino 风格。如果你只需要显示文本，大多数情况下 Text 已经能够满足需求，而对于更复杂的样式和功能，你可以选择 RichText、SelectableText 等控件。
复制链接

扫一扫