先上效果图
上面是对一张带有透明背景的png图片做颜色渐变,原图如下:
直接上代码:
ShaderMask(
child: Image.asset('images/spring.png'),
shaderCallback: (rect) {
return LinearGradient(
colors: [
Colors.greenAccent,
Colors.deepPurpleAccent,
Colors.redAccent,
],
stops: [0, _controller.value, 1],
).createShader(rect);
},
blendMode: BlendMode.srcATop,
)
复制代码
核心是blendMode
属性,用来确定shader和child之间重叠部分的显示效果。其中child是处于上层,shader是属于下层,BlendMode
的各种属性的效果如下: