Flutter学习笔记 边框

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/weixin_42215775/article/details/100978168

BoxDecoration(装饰器)

const BoxDecoration({
  this.color,
  this.image,
  this.border,
  this.borderRadius,
  this.boxShadow,
  this.gradient,
  this.backgroundBlendMode,
  this.shape = BoxShape.rectangle,
})

例:

在这里插入图片描述

      body: Center(
        child: Container(
          height: 100.0,
          width: 100.0,
//          color: Colors.pinkAccent,   //会跟decoration里的Color冲突
          decoration: BoxDecoration(
            color: Colors.blue,
            border: Border.all(
              color: Colors.yellow,
              width: 5.0,
              style: BorderStyle.solid,
            ),
            borderRadius: BorderRadius.circular(20.0),
            //圆角
            boxShadow: [
              BoxShadow(
                offset: Offset(5.0, 5.0), //偏移
                color: Colors.grey,
                blurRadius: 10.0, //阴影的模糊
                spreadRadius: 10.0, //阴影的扩散
              ),
            ],
            //shape: BoxShape.rectangle,    //形状,注意与borderRadius冲突
            gradient:
                //镜像渐变
//            RadialGradient(colors: [
//              Color.fromRGBO(7, 102, 255, 1.0),
//              Color.fromRGBO(3, 28, 128, 1.0)
//            ]),
                //线性渐变
                LinearGradient(
              colors: [
                Color.fromRGBO(7, 102, 255, 1.0),
                Color.fromRGBO(3, 28, 128, 1.0)
              ],
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
            ),
          ),
        ),
      ),

猜你喜欢

转载自blog.csdn.net/weixin_42215775/article/details/100978168