위의 이미지와 같이 배경의 색을 그대로 아이콘에 적용할 상황이 있을 때는 다음과 같이 하면 된다.
class TransparentIconWidget extends StatelessWidget {
final Widget child;
final Color color;
const TransparentIconWidget({Key key, this.color, this.child})
: super(key: key);
Widget build(BuildContext context) {
return ShaderMask(
blendMode: BlendMode.srcOut,
shaderCallback: (bounds) =>
LinearGradient(colors: [color], stops: [0.0])
.createShader(bounds),
child: child);
}
}
ShaderMask
위젯을 사용하여 blendMode를 적용하여 아이콘의 색상을 제거하면 된다.