Flutter 常用控件 - Text

做 App 开发，甚至所有前端开发，文本控件应该是用的最多的，用户看到最多的基本上也都是文本控件相关的，这篇博客详细介绍一下 Flutter 中的文本控件 Text

Text 基本介绍

位置

在 Flutter SDK 下，flutter -> widgets -> text.dart源码不大，加注释总共才不到400行。

继承关系

Text -> StatelessWidget ->Widget -> DiagnosticableTree ->Diagnosticable,这里可以看出Text 是直接继承 StatelessWidget的。这里额外结介绍下Flutter 有两种状态控件:StatelessWidget（无状态组件）、StatefulWidget（有状态组件）,这两者的区别可以参考下走路不穿鞋oO作者写的
Flutter中StatefulWidget控件状态管理的两种方式

Text 的基本用法

这让我这个习惯用 XML 画布局感到特别的不习惯。

class MyTextApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        body: new Center(
          child: new Text(
            "This is Text"
          ),
        ),
      ),
    );
  }

image.png

就这么简单我们完成了第一个 Text 控件的使用，new Text("This is Text") .

Text 的常见属性

这个我们只需要查看一下 Text 的构造方法就知道了。

  const Text(this.data, {
    Key key,
    this.style,
    this.textAlign,
    this.textDirection,
    this.locale,
    this.softWrap,
    this.overflow,
    this.textScaleFactor,
    this.maxLines,
    this.semanticsLabel,
  })