创建内部透明孔的小部件

在“最简单”的方法我发现这样做是使用ColorFiltered的Widget与一个堆栈。

以下代码将完全创建您所需的代码：

@overrideWidget build(BuildContext context) {return Material(  child: Stack(    fit: StackFit.expand,    children: [      Image.network(        'https://wallpaperplay.com/walls/full/e/5/3/13586.jpg',        fit: BoxFit.cover,      ),      ColorFiltered(        colorFilter: ColorFilter.mode( Colors.black.withOpacity(0.8), BlendMode.srcOut), // This one will create the magic        child: Stack(          fit: StackFit.expand,          children: [ Container(   decoration: BoxDecoration(       color: Colors.black,       backgroundBlendMode: BlendMode.dstOut), // This one will handle background + difference out ), Align(   alignment: Alignment.topCenter,   child: Container(     margin: const EdgeInsets.only(top: 80),     height: 200,     width: 200,     decoration: BoxDecoration(       color: Colors.red,       borderRadius: BorderRadius.circular(100),     ),   ), ), Center(   child: Text(     'Hello World',     style: TextStyle(fontSize: 70, fontWeight: FontWeight.w600),     ),   ) ],          ),        ),      ],    ),  );}

您不仅可以在视图上创建“孔”，还可以使用任何东西！包括文字等