文字

class TextDemo extends StatelessWidget {

  final String _title = '将进酒';
  final String _author = '李白';

  @override
  Widget build(BuildContext context) {
    return Text(
      '《$_title》—— $_author 君不见黄河之水天上来，奔流到海不复回。君不见高堂明镜悲白发，朝如青丝暮成雪。人生得意须尽欢，莫使金樽空对月。',
      // 设置对齐方式
      textAlign: TextAlign.left,
      // 最多显示行数
      maxLines: 2,
      // 溢出设置
      overflow: TextOverflow.ellipsis,
      // 设置文字样式
      style: TextStyle(
        fontSize: 16.0, // 字体大小
      ),
    );
  }
}

富文本

class RichTextDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RichText(
      text: TextSpan(
        text: '网页链接：',
        style: TextStyle(
          color: Colors.black, // 设置字体颜色
          fontSize: 30.0, // 设置字号大小
          fontWeight: FontWeight.w800, // 设置字体粗细
        ),
        // 同一段文字需要有不同段样式需要添加children这个属性来设置不同文字的样式
        children: [
          TextSpan(
            text: 'https://baidu.com',
            style: TextStyle(
              fontSize: 17.0,
              color: Colors.blue,
              fontStyle: FontStyle.italic,
              fontWeight: FontWeight.w100, // 设置字体倾斜
            ),
          ),
        ],
      ),
    );
  }
}

Container容器

class ContainerDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      // 设置容器背景图像
      decoration: BoxDecoration(
        image: DecorationImage(
          image: NetworkImage('http://i3.qhmsg.com/t01f0a5906f7c201806.jpg'),
          alignment: Alignment.topCenter, // 背景图对齐方式
          repeat: ImageRepeat.noRepeat, // 背景图重复样式
          fit: BoxFit.cover, // 背景图填充样式
          // 添加背景图滤镜
          colorFilter: ColorFilter.mode(Colors.indigoAccent[400].withOpacity(0.5), BlendMode.hardLight),
        ),
      ),
      child: Row(
        children: <Widget>[
          Container(
            // 设置容器里面的内容
            child: Icon(Icons.pool, size: 32.0, color: Colors.white,),
//            color: Colors.blue, // 设置容器背景颜色
            padding: EdgeInsets.all(15.0), // 设置容器内边距
            margin: EdgeInsets.all(20.0), // 设置容器外边距
            width: 150.0, // 设置容器宽度
            height: 150.0, // 设置容器高度
            // 设置容器的装饰效果
            decoration: BoxDecoration(
              color: Colors.blue, // 这里也可以设置背景颜色，如果设置了decoration外面就不可以设置color了
              border: Border.all( // 统一设置边框样式
                color: Colors.indigoAccent[100], // 边框颜色
                width: 5.0, // 边框宽度
                style: BorderStyle.solid, // 边框样式
              ),
//              border: Border( // 可以单独设置每个边框的样式 top，bottom，left，right
//                top: BorderSide(
//                  color: Colors.indigoAccent[100],
//                  width: 3.0,
//                  style: BorderStyle.solid,
//                )
//              )
              // 统一设置圆角
              borderRadius: BorderRadius.circular(20.0),
//              borderRadius: BorderRadius.only( // 单独设置圆角
//                topLeft: Radius.circular(30.0),
//                topRight: Radius.circular(40.0),
//                bottomLeft: Radius.circular(15.0),
//                bottomRight: Radius.circular(45.0),
//              )
              // 设置阴影
              boxShadow: [
                BoxShadow(
                  offset: Offset(6.0, 6.0), // 阴影偏移量
                  color: Color.fromRGBO(16, 20, 188, 1.0), // 阴影颜色，默认是黑色
                  blurRadius: 20.0, // 阴影模糊程度
                  spreadRadius: -2.0, // 阴影扩散程度 正数扩大阴影面积，负数缩小阴影面积
                )
              ],
              // 设置容器的形状
//              shape: BoxShape.circle, // 设置为圆形就不能设置圆角，矩形可以设置圆角
              // 添加渐变效果
//              gradient: RadialGradient( // 镜像渐变
//                colors: [
//                  Colors.blueGrey,
//                  Colors.deepPurpleAccent,
//                ],
//              ),
              gradient: LinearGradient( // 线性渐变
                colors: [
                  Colors.yellowAccent,
                  Colors.deepPurpleAccent,
                ],
                begin: Alignment.topCenter, // 设置渐变的开始位置
                end: Alignment.bottomCenter, // 设置渐变结束位置
              ),
            ),
          )
        ],
      ),
    );
  }
}