Flutter笔记75：DefaultTextStyle文本样式组件

Flutter的DefaultTextStyle组件用于给子Text加样式，所有隶属于它的子元素的Text都会应用这种样式。如果Text组件指定了自己的样式，则使用自己的样式，否则就继承DefaultTextStyle的样式：

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';

void main(){
  //开启调试线条，比如引入rendering.dart
  debugPaintSizeEnabled = true;
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    //DefaultTextStyle用法1：
    var text1 = DefaultTextStyle.merge(
      style: TextStyle(
        color: Colors.red,
        fontWeight: FontWeight.w800,
        fontFamily: 'Roboto',
        fontSize: 12.0,
        height: 1.2  //行高，倍数
      ),
      child: Row(
          children: [
            Column(
              children: [
                Text('PREP'),
                Text('25 min')
              ],
            ),
            Column(
              children: [
                Text('COOK'),
                Text('1 hours', style: TextStyle(color: Colors.blue),)
              ],
            ),
            Column(
              children: [
                Text('PEEDS'),
                Text('4-6')
              ],
            )
          ],
        ),
    );

    var text2 = Container(
      width: 150,
      color: Colors.red,
      child: DefaultTextStyle(
        style: TextStyle(fontSize: 18),
        // TextOverflow.clip：直接截取
        // TextOverflow.fade：渐隐
        // TextOverflow.ellipsis：省略号形式
        // TextOverflow.visible：可见
        overflow: TextOverflow.ellipsis,
        child: Text('我爱模板网，我爱模板网，我爱模板网，我爱模板网，我爱模板网，'),
      ),
    );

    return MaterialApp(
        title: 'DefaultTextStyle',
        theme: ThemeData(
          primarySwatch: Colors.blue
        ),
        debugShowCheckedModeBanner: false,
        home: Scaffold(
          appBar: AppBar(
            title: Text('DefaultTextStyle'),
          ),
          body: Column(
            children: [
              text1,
              text2
            ],
          )
        ),
      );
  }
}