Flutter学习第二课-基础组件 Text

/*
  const Text(
    this.data, {
    Key key,
    this.style,//文本样式 TextStyle
    this.strutStyle,
    this.textAlign,//文本对其方式
    this.textDirection,
    this.locale,
    this.softWrap,
    this.overflow, //超出一行呈现方式 TextOverflow
    this.textScaleFactor,文本缩放因子
    this.maxLines,//行数限制
    this.semanticsLabel,
    this.textWidthBasis,
  })
  TextOverflow {
    clip,// 剪辑溢出的文本以固定其容器。
    fade, // 将溢出的文本淡化为透明。
    ellipsis,// 使用省略号表示文本已溢出。 常用
    visible,// 在容器外呈现溢出的文本。
  }
  const TextStyle({
    this.inherit = true,//是否继承默认样式
    this.color,//字体颜色
    this.backgroundColor,//文本背景颜色
    this.fontSize,//文字大小,单位为像素，如果没有指定大小则默认为14像素，可以乘以textScaleFactor来增加字体大小以便用户更加方便的阅读
    this.fontWeight,//粗体
    this.fontStyle,//斜体
    this.letterSpacing,//横向字符间距 负数为缩进，正数为增长
    this.wordSpacing,//字符串中‘空格’的长度
    this.textBaseline,//用于对齐文本的水平线
    this.height,//行高设置
    this.locale,
    this.foreground,
    this.background,//使用paint赋予文本背景颜色
    this.shadows,//    文本的阴影可以利用列表叠加处理
      例如shadows: [Shadow(color:Colors.black,offset: Offset(6, 3), blurRadius: 10)]
      color即阴影的颜色，
      offset即阴影相对文本的偏移坐标，
      blurRadius即阴影的模糊程度，越小越清晰
    this.fontFeatures,
    this.decoration,// 文本装饰线样式，比如 underline 下划线， lineThrough删除线
    this.decorationColor,// 文本装饰线颜色
    this.decorationStyle,// 文本装饰线样式 比如 dashed 虚线
    this.decorationThickness,
    this.debugLabel,
    String fontFamily,//字体样式
    List<String> fontFamilyFallback,
    String package,
  })
  const Text.rich(
    this.textSpan, {
    Key key,
    this.style,
    this.strutStyle,
    this.textAlign,
    this.textDirection,
    this.locale,
    this.softWrap,
    this.overflow,
    this.textScaleFactor,
    this.maxLines,
    this.semanticsLabel,
    this.textWidthBasis,
  })
 */
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final TextStyle _protocolFont = new TextStyle(fontSize: 30.0);
    final TapGestureRecognizer _tapRecognizer = new TapGestureRecognizer();
    _tapRecognizer.onTap = () {
      print('协议被点击!');
    };
    return MaterialApp(
      title: 'Flutter Demo',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Text Sample'),
        ),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text('You have pushed the button this many times.',
                textAlign: TextAlign.left,
                style: TextStyle(
                  inherit: true,
                  color: Colors.white,
                  fontSize: 20.0,
                  fontWeight: FontWeight.w400,
                  fontStyle: FontStyle.italic,
                  letterSpacing: 5,
                  wordSpacing: 20,
                  textBaseline: TextBaseline.alphabetic,
                  height: 1.2,
                  locale: Locale('fr', 'CH'),
                  background: Paint() ..color = Colors.blue,
                  shadows: [Shadow(color:Colors.black,offset: Offset(6, 3), blurRadius: 10)],
                  decoration: TextDecoration.underline,
                  decorationColor: Colors.black54,
                  decorationStyle: TextDecorationStyle.dashed,
                  debugLabel: 'test',
                )),
            Text.rich(TextSpan(children: [
              TextSpan(
                  text: "Home:",
                  style: TextStyle(
                      fontSize: 12.0,
                      color: Colors.black)),
              TextSpan(
                  text: "https://flutterchina.club",
                  style: TextStyle(
                      fontSize: 18.0,
                      color: Colors.blue),
                  recognizer: _tapRecognizer),
            ])),
            DefaultTextStyle(
              style: TextStyle(
                color: Colors.red,
                fontSize: 20.0,
              ),
              textAlign: TextAlign.start,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text("hello world"),
                  Text(
                    "hello world",
                    style: TextStyle(
                        inherit: false,
                        color: Colors.grey),
                  ), //单独设置样式不继承默认样式 方式一
                  Text(
                    "hello world",
                    style: _protocolFont,
                  ), //单独设置样式缺省部分任然继承默认样式 方式二
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}

常用方法已经添加了注释，可复制代码直接运行看效果