Flutter初学之路—`Text` （文本组件）

Text（文本组件）负责显示文本和定义显示样式，其提供了多个构造函数：

• new Text：创建一个文本组件；
• new Text.rich：创建一个拥有TextSpan的文本组件。

Text组件显示一个样式单一的文本字符串。根据布局约束，字符串可能跨多行显示，也可能全部显示在同一行上。
样式参数时可选的。当省略时，文本将使用最接近的DefaultTextStyle中的样式。如果给定样式的TextStyle.inherit属性为true（默认），则给定样式将于最接近的DefaultTextStyle的样式合并。这种合并行为是很有用的，例如，使用默认字体系列和大小时使文本粗体显示。

//Text构造函数
        body: Center(
          child: Text(
            'Hello, $name! How are you?',
            textAlign: TextAlign.center,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(fontWeight: FontWeight.bold),
          ),
        ),
//Text.rich构造函数
        body: Center(
          child: const Text.rich(
            TextSpan(
              text: 'Hello',
              children: <TextSpan>[
                TextSpan(text: ' beautiful ', style: TextStyle(fontStyle: FontStyle.italic)),
                TextSpan(text: 'world', style: TextStyle(fontWeight: FontWeight.bold))
              ]
            )
          )
        ),

交互：

• 若使用文本对触摸事件作出反应，请将其包装在GestureDetector组件中，并使用GestureDetector.onTap处理。
• 在material design应用程序中，考虑使用FlatButton代替，或者如果不适用，至少使用InkWell来代替GestureDetector。
• 若使用部分文本做交互，需要使用RichText，并将TapeReservator指定为文本相关部分的TextSpan.recognizer。
  • RichText：提供了对文本样式的更多控制；
  • DefaultTextStyle：为文本组件提供默认样式。

继承：

Object > Diagnosticable > DiagnosticableTree > Widget > StatelessWidget > Text

构造函数：

//Text构造函数
  const Text(String data, {//要显示的文本
    Key key,
    TextStyle style,//文本样式
    StrutStyle strutStyle,//支撑样式
    TextAlign textAlign,//文本水平对齐方式
    TextDirection textDirection,//文本显示的方向
    Locale locale,//用于在相同Unicode字符可以根据区域设置不同时选择字体
    bool softWrap,//文本是否应该在换行符处断行
    TextOverflow overflow,//处理溢出
    double textScaleFactor,//每个逻辑像素的字体像素值
    int maxLines,//文本可显示多少行
    String semanticsLabel,//该文本的另一种语义标签
  })
//Text.rich构造函数
  const Text.rich(TextSpan textSpan, {//以`TextSpan`方式显示文本
    Key key,
    TextStyle style,
    StrutStyle strutStyle,
    TextAlign textAlign,
    TextDirection textDirection,
    Locale locale,
    bool softWrap,
    TextOverflow overflow,
    double textScaleFactor,
    int maxLines,
    String semanticsLabel,
  })

属性：

名称	类型	说明
data	String	要显示的文本
locale	Locale	用于在相同Unicode字符可以根据区域设置不同时选择字体
maxLines	int	文本可显示多少行。如果文本超过给定的行数，则根据溢出截断。
overflow	TextOverflow	处理溢出
semanticsLabel	String	该文本的另一种语义标签
softWrap	bool	文本是否应该在换行符处断行
strutStyle	StrutStyle	支撑样式。Strut样式定义了设置最小垂直布局指标的支持。
style	TextStyle	设置文本样式
textAlign	TextAlign	文本水平对齐方式
textDirection	TextDirection	文本显示的方向
textScaleFactor	double	每个逻辑像素的字体像素值
textSpan	TextSpan	以TextSpan方式显示文本
hashCode	int	哈希码
runtimeType	Type	对象运行时类型的表示形式

方法：

方法名	类型	说明
build(BuildContext context)	Widget	组件表示的部分用户界面
debugFillProperties(DiagnosticPropertiesBulider properties)	void	添加与节点关联的其他属性
createElement	StatelessElement	创建一个StatelessElement来管理组件在树中的位置
debugDescribeChildren()	List<DiagnosticsNode>	返回描述词节点子节点的diagnostics节点对象列表
noSuchMethod(Invocation invocation)	dynamic	当访问不存在的方法或属性时调用
toDiagnosticsNode({String name, DiagnosticsTreeStyle style})	DiagnosticsNode	返回由使用调试工具和DiagnostisNode.toStringDep的对象的调试表示形式
toString({DiagnosticLevel minLevel: DiagnosticLevel.debug})	String	返回此对象的字符串表示形式
toStringDeep({String prefixLineOne:'', String prefixOtherLines, DiagnosticLevel minLevel: DiagnosticLevel.debug})	String	返回子节点和它的子节点的字符串表示形式
toStringShallow({Sting joiner:',', DiagnosticLevel minLevel:DiagnosticLevel.debug})	String	返回对象的一行详细说明
toStringShort()	String	对组件简短的文本描述

示例：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  
  @override
  Widget build(BuildContext context) {
    const data = "Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep";
    return MaterialApp(
      title: 'Hello World!',
      theme: ThemeData(
        primaryColor: Colors.red,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('Welcome to Fultter'),
        ),
        body: Center(
          child: Text(
            data,
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
            softWrap: true,
            strutStyle: StrutStyle(),
            style: TextStyle(
                fontStyle: FontStyle.normal,
                fontWeight: FontWeight.bold,
                fontSize: 15.0
            ),
            textAlign: TextAlign.justify,
            textDirection: TextDirection.rtl,
            textScaleFactor: 2.0,
          ),
        ),
      ),
    );
  }
}

---

参考文档：Text class