[移动开发]Flutter学习笔记二，组件的使用

Text组件

import 'package:flutter/material.dart';

/**
 * Text组件使用
 */
class TextDemo extends StatelessWidget {
  const TextDemo({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Text(
      "文本内容" * 100, // 内容参数，这里使用*可以直接进行数据量增加
      maxLines: 3, // 最大展示行数
      overflow: TextOverflow.ellipsis, // 设置溢出时的展示效果，这里我们使用。。。风格
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Container( // 这玩意就类似div，他的child属性也可以是组件
      width: double.infinity, // 设置宽度为最大
      color: Colors.deepOrangeAccent, // 设置背景色
      child: Text(
        "文本内容", // 内容参数，这里使用*可以直接进行数据量增加
        maxLines: 3, // 最大展示行数
        overflow: TextOverflow.ellipsis, // 设置溢出时的展示效果，这里我们使用。。。风格
        textDirection: TextDirection.ltr, // 设置从左到右或者从右到左
        textAlign: TextAlign.center, // 设置对其风格，居中或者左右等
        style: TextStyle( // 设置样式，这里追进去可以看到许多可选配置
          color: Colors.white, // 文本颜色
          fontSize: 20, // 文本大小
          backgroundColor: Colors.green // 文本背景色
        ) ,
      ),
    );
  }
}