繁体   English   中英

如何在 Flutter 中为容器创建自定义边框?

[英]How to create a custom border for container in Flutter?

我试图像这样的代码为容器设置边框:

              Container(
                padding: EdgeInsets.all(15.sp),
                decoration: BoxDecoration(
                  // color: Colors.yellow,
                  border: Border.all(
                    color: kPrimaryColor,
                    width: 7,
                    style: BorderStyle.solid,
                  ),
                ),
                child: QrImage(
                  data: controller.generatedCode,
                  version: QrVersions.auto,
                  size: 300.0,
                ),
              ),

上面的代码给了我一个完整的边框

二维码的边框,我想实现这样的边框

一世

尝试这个。 它会起作用的。

Container(
  child: Text(
    'This is a Container',
    textScaleFactor: 2,
    style: TextStyle(color: Colors.black),
  ),
  decoration: BoxDecoration(
    borderRadius: BorderRadius.circular(10),
    color: Colors.white,
    boxShadow: [
      BoxShadow(color: Colors.green, spreadRadius: 3),
    ],
  ),
  height: 50,
),

我找到了,使用 dotted_border package:

Widget get customBorder {
    Path customPath = Path()
      ..moveTo(0, 0)
      ..lineTo(0, 25)
      ..moveTo(0,0)
      ..lineTo(25, 0)
      ..moveTo(75,0)
      ..lineTo(100,0)
      ..lineTo(100,25)
      ..moveTo(0,75)
      ..lineTo(0, 100)
      ..lineTo(25, 100)
      ..moveTo(100,75)
      ..lineTo(100, 100)
      ..lineTo(75,100)
    ;
  return DottedBorder(
      customPath: (_) => customPath,
      color: Colors.indigo,
      dashPattern: [1, 1],
      strokeWidth: 2,
      child: Container(
        height: 100,
        width: 100,
        color: Colors.green.withAlpha(20),
      ),
    );
  }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM